En av våra läsare frågade nyligen hur man kan visa de senaste YouTube-videorna på sin WordPress-webbplats. Det är en bra fråga, och vi har en enkel lösning.
Här på WPBeginner uppdaterar vi regelbundet vår egen YouTube-kanal med användbara WordPress-tutorials. Vi har själva lärt oss hur tidskrävande det kan vara att manuellt bädda in varje ny video på vår webbplats.
Tack och lov har vi hittat ett enkelt plugin för att automatiskt visa dina senaste YouTube-videor på din WordPress-webbplats. Den här metoden sparar tid och säkerställer att din webbplats alltid visar ditt senaste innehåll.
Låt oss gå igenom processen steg för steg.
Varför visa videoklipp från din YouTube-kanal i WordPress?
Om du run en YouTube-kanal utöver en WordPress site, är det vettigt att posta videoklippen till din website också.
Dessa videoklipp kan hjälpa till att genomföra besökarens uppmärksamhet och hålla dem kvar på din website längre. Detta kan öka antalet sidvisningar och minska avvisningsfrekvensen i WordPress.
Embed YouTube videoklipp kan till och med få fler besökare till din website. Faktum är att vår ultimata lista över bloggstatistik visar att blogginlägg med videoklipp får 83% mer trafik än de utan.
Om du bara vill add to ett litet antal videoklipp till din site är det enkelt att embedda YouTube-videor i blogginlägg i WordPress. Du måste dock lägga till varje new videoklipp manuellt, vilket tar tid och ansträngning.
Istället rekommenderar vi att du embedar ett YouTube feed som uppdateras automatiskt varje gång du postar en new video till din kanal. Detta garanterar att besökarna alltid kommer att se de allra senaste videoklippen, utan någon extra ansträngning från dig.
Med detta sagt, låt oss ta en titt på hur du visar de senaste videoklippen från din YouTube-kanal i WordPress. Du kan använda snabblänkarna under för att navigera genom den här artikeln:
Step 1: Installera och konfigurera ett YouTube Video Plugin
Det enklaste sättet att visa de senaste videoklippen från din YouTube-kanal är genom att använda det gratis tillägget Smash Balloon YouTube Feeds for YouTube. Detta plugin erbjuder massor av alternativ för customize för att justera hur din YouTube-kanals feed ser ut på din site.
För denna handledning kan du använda antingen Pro- eller gratisversionen av plugin-programmet, eftersom båda kommer att fungera. Det kompletta Smash Balloon plugin-kitet har också funktioner för att bädda in videor från TikTok, Facebook och så vidare.
Först installerar och aktiverar du pluginet Feeds for YouTube. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett WordPress plugin.
Efter aktivering, head över till YouTube Feed ” Settings och klicka på ’Add Source’.
På nästa vy, fortsätt och klicka på ”Anslut till YouTube via Google. Smash Balloon kommer nu att visa alla dina Google-konton.
Du kan antingen välja ett account från listan eller clicka på ”Use another account” och lägga till ett new Google account.
Efter det ser du en varning om att Smash Balloon kommer att kunna komma åt information om din YouTube-kanal.
Förutsatt att du är nöjd med att gå vidare, click på ”Continue”.
Vid denna punkt måste du add till ID:n eller användarnamnet för din YouTube-kanal.
För att få denna information, head över till YouTube-webbplatsen och klicka på din profilbild i det övre högra hörnet. Välj sedan ”Your channel”.
Titta nu på adressfältet i din webbläsare. Om you ser någon text efter ”user/” så är det ditt användarnamn för kanalen.
Om du ser ”channel/” följt av en string med siffror och bokstäver är detta kanalens ID:n, som du kan se på följande image.
Kopiera bara värdet och växla tillbaka till din WordPress dashboard. Klistra nu in värdet i fältet som visar ”Enter Channel ID:n or användarnamnet.
När du har gjort det klickar du på knappen ”Nästa”.
Step-by-Step 2: Skapa en API Key för YouTube i Google Console
Vid denna punkt kommer du att se följande message: No API Key Entered.
För att undvika störningar rekommenderar vi att du skapar en YouTube API key och lägger till den på din WordPress blogg eller website.
Är det möjligt att visa mina YouTube-videor utan en API-nyckel?
Svaret är ja, det är det. Smash Balloon rekommenderar dock inte att du hoppar över detta steg eftersom det ger mer stabil och konsekvent tillgång till YouTube-data över tid. Detta minimerar risken för störningar när det gäller att hålla ditt flöde uppdaterat.
Gå till Google Console i en new tab och logga in med ditt Google account.
När du är inloggad i konsolen klickar du på dropdown-menyn i toolbaren. Som standard visar den namnet på ditt senaste Google Console-projekt.
Om det här är första gången du loggar in i Google Console måste du godkänna villkoren och bestämmelserna.
När du har gjort det klickar du på ”New Project”.
You kan nu skriva in ett namn för projektet. Detta är bara för din referens så du kan använda vad du vill.
När du har gjort det klickar du på ”Create”.
Klicka nu på ikonen ”Sök” och skriv in ”YouTube Data API”.
Under ”Marketplace” hittar du YouTube Data API och klickar på det.
Detta tar dig till en vy där du kan aktivera nyckeln för att göra YouTube API requests.
För att göra detta klickar du helt enkelt på knappen ”Aktivera”.
I menyn till vänster klickar du på ”Credentials”.
När du har gjort det väljer du ”Create Credentials”.
I dropdown-menyn klickar du på ”API key”.
Efter några ögonblick kommer du att se en popup med ”API key created”. Du måste add to den här informationen till din website, så obs/observera den.
Som standard är YouTube API key obegränsad. För att hindra andra från att använda API key är det smart att begränsa den genom att klicka på länken ”Edit API Key” i popupen.
Detta öppnar en vy som visar alla dina Google API keys. Hitta bara den nyckel som du just har skapat och ge den ett click.
Obs/observera: Om du av misstag closeade popupen, så var inte orolig. Du kan nå samma vy genom att välja ”Credentials” från menyn till vänster. På samma sätt, om du inte registrerade API key, klicka bara på ”Show Key” för att se dina credentials.
Under ”Ange en begränsning för ett program” select the ”Websites” alternative.
Under ”Website Restrictions” klickar du på ”Add”.
You can now type in the address of your website, and click on ”Done”.
För att ge Smash Balloon tillgång till API:et måste du också skriva in www.googleapis.com och clicka på ”Done”.
Under ”API restrictions” väljer du knappen bredvid ”Restrict key”.
När du har gjort det klickar du på dropdown-menyn ”Select APIs” och kontrollerar boxen bredvid ”YouTube Data API”.
Därefter klickar du på ”OK”.
När du är nöjd med hur YouTube API key är inställd klickar du på ”Save”.
Du är nu redo att add to API key till din WordPress website. I WordPress dashboard går du till YouTube Feed ” Settings.
Slutligen klistrar du in nyckeln i fältet ”API Key” och klickar sedan på ”Add”.
Step-by-Step 3: Skapa och Customize en YouTube Channel Feed
När du har anslutit din WordPress website till YouTube kan du skapa ett galleri med videoklipp för din kanal.
Gå bara till YouTube Feed ” Alla Feeds och klicka sedan på ’Add New’.
Med YouTube Feed Pro kan du bädda in enskilda YouTube-videor, spellistor, livestreams och mycket mer.
Du kan till och med skapa en social vägg genom att kombinera inlägg från flera sociala plattformar. Du kan till exempel bädda in statusinlägg från Facebook, lägga till Instagram-foton och mycket mer.
Eftersom du använder det gratis pluginet klickar du bara på ”Channel” och väljer sedan ”Next”.
Detta öppnar Editorn, som visar en preview av ditt YouTube feed till höger.
På vänster sida ser du alla de olika Settings som du kan använda för att finjustera hur YouTube videoklipp ser ut.
Dessa Settings är enkla, så det är bara att clicka på varje alternativ i menyn till vänster och göra de ändringar you vill.
När du ändrar settings uppdateras live preview automatiskt så att du kan prova olika inställningar för att se vad som ser bäst ut på din website.
Till att börja med kan du ändra hur videoklippen visas genom att clicka på ”Feed Layout”. På den här vyn kan du växla mellan layouterna grid, gallery, list och carousel.
Beroende på vilken layout du väljer kan du få tillgång till några extra inställningar.
Om du till exempel väljer ”List” kan du ändra hur många videoklipp Smash Balloon visar i listan och skapa mer utrymme mellan YouTube-videorna.
Studier visar att 90 % av alla konsumenter tittar på videoklipp på sina mobila enheter och 70 % av alla som besöker YouTube gör det med en smartphone eller surfplatta. Med detta i åtanke vill du se till att dina senaste videoklipp ser lika bra ut på mobilen som de gör på datorn.
Du kan previewa hur YouTube Feed kommer att se ut på stationära datorer, surfplattor och smartphones med hjälp av raden med knappar i det övre högra hörnet.
Du kanske också vill ändra hur många videor du visar på smartphones och surfplattor. Detta kan hjälpa dina YouTube-videor att passa bekvämt på mindre skärmar på surfplattor och smartphones.
Som standard visar Smash Balloon ett annat antal Column på mobila enheter och datorer. För att ändra dessa standardinställningar skriver du bara in nya siffror i sektionen ”Columns”.
Du är nu redo att utforska nästa vy för inställningar, som är ”Färgschema”.
Som standard använder Feeds for YouTube samma färgschema som ditt WordPress-tema. Du kan dock också använda ett ”Light” eller ”Dark” färgschema för din video feed.
Du kan till och med skapa ditt eget färgschema genom att välja ”Custom” och sedan använda inställningarna för att ändra länkfärg, textfärg, ändra bakgrundsfärg med mera.
Smash Balloon kan också lägga till en header ovanför YouTube video feed. Denna header visar din YouTube-profil och kanalnamn så att besökare kan se exakt var innehållet kommer ifrån.
För att customize denna section, click on ’Header’ i vänster menu.
Här kan du använda personuppgiftsansvariga för att växla mellan standard- och textheader.
Om du väljer ”Text” kan du ändra textfärg och teckenstorlek. Som standard visas meddelandet ”Vi finns på YouTube” i sidhuvudet. Du kan ersätta detta med ditt eget meddelande genom att skriva in det i rutan ”Text”.
När du är nöjd med hur headern ser ut, är nästa vy för inställningar ”Videoklipp”.
Detta tar dig till en ny vy där du kan finjustera hur varje YouTube-video ser ut som standard, när en besökare hoverar musen över den och när videon spelas upp.
Om du klickar på ”Edit Individual Elements” kan du välja om du vill visa eller dölja ikonen ”Play”.
I Följer image lägger vi till en ”Play” icon till varje video i YouTube feed.
När du är nöjd med dina ändringar klickar du på länken ”Videos”.
Detta tar dig tillbaka till föregående vy, där du kan select ”Hover State”.
Här kan du välja om du vill visa videoklippets titel när besökaren hoverar över det.
Rubriken kan ge extra användbar information och uppmuntra visitorerna att spela upp videoklippet. Med detta i åtanke kanske du vill kontrollera boxen bredvid ”Video Rubrik”.
När en visitor klickar på ett videoklipp börjar det spelas upp i en embedad videospelare.
Du kan ändra hur spelaren agerar och ser ut genom att clicka på ”Video Player Experience”.
Här kan du ändra spelarens bildförhållande och välja om videoklippet ska börja spelas automatiskt eller vänta tills besökaren klickar på knappen Play.
När du är nöjd med hur videospelaren är inställd, klicka på länken ”Customize” för att gå tillbaka till huvudskärmen för Smash Balloon editor.
Här väljer du ”Load More Button” i menyn till vänster.
Besökare kan använda knappen ”Ladda mer” för att se fler av dina YouTube videoklipp. På så sätt kan besökarna stanna kvar längre på din website, samtidigt som de får mer engagement och fler views på din YouTube-kanal.
Med detta i åtanke kanske du vill få knappen ”Ladda mer” att sticka ut genom att ändra bakgrundsfärg, hovering och textfärg.
Den här knappen visar ”Ladda mer…” som standard, men du kan ersätta detta med en unik call-to-action genom att skriva i fältet ”Text”.
Som standard visar Smash Balloon en knapp ”Prenumerera ” under dina senaste YouTube-videoklipp.
Detta uppmuntrar besökarna att gå med i din YouTube-kanal. För att få fler prenumeranter kanske du vill customize knappen genom att välja ”Subscribe Button” från huvudinställningarna på Smash Balloon.
På den här vyn kan du lägga till och ta bort knappen ”Prenumerera” genom att clicka på ”Aktivera”.
Du kan också ändra knappens bakgrundsfärg, hovering och textfärg.
Som standard visar den här knappen en call-to-action med texten ”Prenumerera”.
You can replace this with your own message by typing it into the ”Text” box.
När du är nöjd med hur video feeden ser ut, glöm inte att clicka på ”Save” för att store dina ändringar. Nu kan du lägga till de senaste videoklippen från YouTube på din website i WordPress.
Step-by-Step 4: Embed de senaste videoklippen från YouTube-kanalen i WordPress
Du kan add your YouTube video feed till WordPress med hjälp av ett block, widget eller shortcode.
Om du har skapat mer än ett feed med pluginet Feeds for YouTube, måste du känna till feedens shortcode om du ska använda ett block eller widget.
För att få koden, gå till YouTube Feed ” All Feeds och kopiera sedan texten under ’Shortcode’.
I Följer exempel måste vi använda youtube-feed feed=2
.
Om du vill visa de senaste videoklippen på en page eller post rekommenderar vi att du använder blocket ”Feeds for YouTube”.
Öppna helt enkelt den page eller det post där du vill visa dina YouTube videoklipp. Klicka sedan på ikonen ”+ Add Block” för att lägga till ett nytt block och börja skriva ”Feeds for YouTube”.
När rätt block visas klickar du på det för att add to sidan eller posten.
Blocket visar ett av dina YouTube-flöden som standard. Om du vill använda ett annat feed istället hittar du ”Shortcode Settings” i menyn till höger.
Du kan nu add shortcode till denna box. När du har gjort det klickar du på knappen ”Tillämpa ändringar”.
Blocket kommer nu att visa de senaste videoklippen från din YouTube-kanal. Publicera eller update helt enkelt sidan för att göra din YouTube social media feed live.
Om du använder ett blockaktiverat tema kan du använda hela Site Editor för att add to Feeds for YouTube-blocket var som helst på din site. Stegen är mestadels liknande de som förklaras ovan, du behöver bara veta vilken template eller pattern du ska add to blocket till.
För mer information om detta kan du läsa vår kompletta guide till WordPress Full Site Editing.
You can also add the feed to any widget-ready area, such as the sidebar. This allows you to show the latest YouTube videos across entire your website.
För att göra detta, heada till Appearance ” Widgets i WordPress dashpanelen och klicka sedan på ”+” -knappen.
Börja nu skriva ”Feeds for YouTube” i sökfältet för att hitta rätt widget.
Du kan sedan dra widgeten till det area där du vill visa de senaste videoklippen från din YouTube-kanal.
Som standard visar widgeten en av de feeds som du skapade med Feeds for YouTube.
Om du vill visa ett annat feed istället skriver du in koden för det feedet i boxen ”Shortcode Settings”. Sedan klickar du på ”Tillämpa Changes”.
Slutligen klickar du på knappen ”Update” för att aktivera widgeten.
För mer information, vänligen se vår detaljerade guide om hur du lägger till och använder widgetar.
Ett annat alternativ är att bädda in de senaste videoklippen på vilken page, post eller widget-ready area som helst med hjälp av en shortcode. För att få rätt shortcode, gå helt enkelt till YouTube Feed ” Alla Feeds och kopiera värdet i kolumnen ”Shortcode”.
Nu är det bara att add to denna kod till din site. För mer information, vänligen se vår detaljerade guide om hur du lägger till en shortcode i WordPress.
Fler tips för att run en YouTube-kanal och en site i WordPress
Vill du lära dig mer om hur du visar YouTube videoklipp på din site i WordPress? Eller behöver du kanske fler tips för att runka en YouTube-kanal?
Kontrollera dessa artiklar för att hitta dina svar:
- Hur man startar en framgångsrik YouTube-kanal för ditt företag
- Bästa plugins för YouTube-videogallerier för WordPress
- Ska du starta en blogg eller en YouTube-kanal? (Nybörjarguide)
- Så här skapar du automatiskt ett WordPress-inlägg från en YouTube-video
- Hur man spårar videoklipp i WordPress (Step-by-Step)
- Så här optimerar du videoklipp för din website i WordPress
- Forskning: Sanningen bakom tjäna pengar online videoklipp på YouTube och TikTok
Vi hoppas att den här artikeln hjälpte dig att lägga till de senaste videorna från din YouTube-kanal på din WordPress-webbplats. Du kanske också vill kolla in vår guide om hur du bäddar in en Facebook-video i WordPress och våra expertval av de bästa plugins för sociala medier i WordPress.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Dennis Muthomi
I had a question come up while reading.
When connecting the Smash Balloon plugin to your YouTube channel, from the screenshots, I noticed it pulls videos to display in the feed automatically.
I’m wondering if you know whether it includes unlisted videos from your YouTube channel as well? Or does it only display the public videos?
WPBeginner Support
As long as you use the API key when setting up the feed it will not include your unlisted or private videos.
Administratör
THANKGOD JONATHAN
I think this method will help both the website and the y
Youtube channel aswell. But I have not heard you mention, does this Improve my website SEO?
WPBeginner Support
It would normally be an indirect increase to your SEO, your visitors would learn about your YouTube channel through the latest videos feed and your channel would grow then if you mention your site in your videos you can grow your audience that way.
Administratör
Sona
How can I give pagination for videos?
gnfb
Your articles are very helpful thanks you
joan
brilliant, thanks so much for these clear instructions…i was searching everywhere for an answer.
Robert Thompson
Nice article. I have a Youtube video player on my website’s homepage. Also my template is touch responsive.
Marika
Hello! I really like this plugin.. But I am wondering if it is possible to get all my user videos on page? Now there are visible only 9 of them…
Mike Johnson
How can I remove the video player AND let the videos play within themselves, rather than opening in YouTube?
Emma
This is awesome! Love your tips!
Ramesh Joshi
Its fantastic and easy way to learn. Thanks a lot to provide a good method to know more about wordpress.
Nancy Seeger
This looks great. Any idea is this works with WordPress 3.8? On wordpress.org it shows it is compatible up to 3.5.2 and no one has commented yet if it works with 3.8.
WPBeginner Support
Yes we tested it with WordPress 3.8 and it works fine.
Administratör