Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Så här embedar du en YouTube Live Stream i WordPress

Vill du embedda en YouTube live streaming på din WordPress website?

Embed YouTube live streams på din site kan öka engagemanget genom att allow visitors att interagera med you och ditt content i realtid.

I den här artikeln visar vi dig hur du enkelt embedar en YouTube live streaming i WordPress.

How to embed a YouTube live stream in WordPress

Varför embedda YouTube Live Streams i WordPress

Live streaming aktiverar dig att sända live video eller ljud content över internet, vilket aktiverar användare att titta på videoklippet i realtid.

Att embeda en YouTube live streaming på din WordPress website är ett utmärkt sätt att ansluta till din publik och nå fler användare.

YouTube live stream

Det kan också öka engagemanget hos användarna genom att allow you att interagera med webbplatsens besökare.

En YouTube Live streaming kan också bidra till att öka sökmotorsoptimeringen på en website och locka mer trafik. Forskning har visat att blogginlägg med minst ett videoklipp får cirka 83% fler besökare än content utan något videoklipp.

Med detta sagt, låt oss se hur du enkelt kan embed en YouTube live streaming i WordPress.

Så här embedar du en YouTube Live Streaming i WordPress

Det enklaste sättet att embeda en YouTube-livestream är att använda Smash Balloon’s YouTube Feed Pro plugin.

Det är det bästa WordPress YouTube plugin på marknaden som gör att du kan embed YouTube videoklipp och live streams på din website.

Först måste du installera och aktivera pluginet YouTube Feed Pro. För mer instruktioner, vänligen se vår guide för nybörjare om hur man installerar ett plugin för WordPress.

Note: YouTube Feed har också en gratis version. Det stöder dock inte Live Stream-funktionen.

Efter aktivering, besök YouTube Feed ” Settings page från WordPress admin sidebar. Här måste du enter license key och klicka på knappen ”Activate”.

You can get this information from your account on the Smash Balloon website.

Activate your smash balloon license key

Gå sedan till sidan YouTube Feeds ” All Fe eds från WordPress dashboard.

Härifrån klickar du på knappen ”Add New” högst upp.

Click the Add New button to add the YouTube feed

Detta kommer att öppna prompten ”Select Feed Type” på vyn.

För att fortsätta måste du välja alternativet ”Live Streams” och klicka på knappen ”Next”.

Choose live stream as feed type

I nästa steg måste du ansluta YouTube Feed Pro till ditt YouTube-konto. Du kommer att bli ombedd att ange din YouTube API key.

Om du redan har en API key kopierar du den och klistrar in den i boxen ”Enter API Key” och klickar på knappen ”Add”.

Add YouTube API key

Skapa en API Key för YouTube

Om du inte har en API key ännu, gå till Google Cloud Console och logga in med ditt Google account.

När du är inloggad klickar du på knappen ”Select a project” högst upp.

Click Select Project button

Detta öppnar ett popup-fönster som visar alla projekt som du har skapat.

Klicka nu på knappen ”Nytt projekt” högst upp i högra hörnet.

Click the New Project button

Då kommer du till page ”New Project”, där du kan börja med att skriva in ett namn på your project. Det kan vara vad som helst som gör att du lätt kan identifiera det.

Därefter måste du välja en ”Organization” och dess location från dropdown-menyn. You can choose ”No Organization” and click the ”Create” button to continue.

Choose a project name and its organization

När projektet har skapats kommer du till projektets dashboard.

Härifrån klickar du på knappen ”+ Aktivera API:er och tjänster” i menyn högst upp.

Click on the + ENABLE APIS AND SERVICES button

Detta tar dig till API Library page. Där visas de olika tjänsterna från Google som du kan skapa API:er för och använda i dina projekt.

Gå nu vidare och sök efter ”YouTube Data API v3” i sökboxen.

Search for the YouTube data API v3 option

När resultatet ”YouTube Data API v3” dyker upp är det bara att clicka på det.

Du kommer nu att skickas till en new vy där du måste clicka på knappen ”Enable” för att aktivera YouTube API key.

Enable the YouTube API

Då kommer du till sidan ”API/Service Details”.

Klicka sedan på knappen ”Create Credentials” högst upp.

Click the Create Credentials button

Därefter kommer du till en new page, där du måste kontrollera boxen bredvid alternativet ”Public Data”.

Därefter klickar du på knappen ”Next” för att skapa ditt API.

Check the Public data box and click on the Next button

Din API Key kommer nu att skapas och visas på page.

Kopiera bara den här nyckeln och klicka på knappen ”Klar”.

Copy the YouTube API key

Nu är det dags att heada tillbaka till WordPress dashboard.

Gå vidare och klistra in API-nyckeln i boxen API Key Required. Klicka sedan på knappen ”Add” för att fortsätta.

Add YouTube API key

Add YouTube Live Stream till din website i WordPress

När du har addat din YouTube API key kommer du att redirectas till ”Select Feed Type” page.

Härifrån klickar du på alternativet ”Live Stream” igen, följt av knappen ”Nästa”.

Detta kommer att öppna ”Add Channel ID For Live Stream” page.

Visit the Add channel ID for live stream page

Nu måste du besöka YouTube-kanalen som innehåller dina live-stream videoklipp.

Gå vidare och kopiera texten som kommer efter ”/channel/” eller ”/user/” i URL:en högst upp.

Copy the code after channel or user in the URL

Gå sedan tillbaka till WordPress dashboard och klistra in koden i boxen ”Add Channel ID for Livestream”.

Därefter klickar du på knappen ”Connect” för att ansluta din YouTube-kanal till WordPress.

När kanalen har anslutits klickar du på knappen ”Next” (Nästa) för att fortsätta.

Add code and click the connect button

Customize ditt YouTube Feed

Nu när din YouTube live stream feed har skapats kan du customize den. Smash Balloon’s YouTube Feed Pro erbjuder många olika alternativ för display.

Först måste du välja en template på page ”Start with a template”. Du kan välja mellan layouterna Standard, Carousel, Cards, List, Gallery eller Grid.

När du har gjort ditt val, clickar du på knappen ”Next”.

Choose a template for your Live YouTube feed

När du har gjort det öppnas en redigeringsskärm som visar en preview av ditt YouTube-flöde till höger och anpassningsinställningar i den vänstra menyn column.

Här kan du börja med att förstora panelen ”Feed Layout”.

YouTube Feed editor

På den här vyn kan du växla mellan layouterna.

Du kanske också kan konfigurera ytterligare inställningar beroende på vilken layout du har valt.

Customize the YouTube feed layout

Därefter måste du klicka på panelen ”Color Scheme”.

Som standard använder YouTube Feed Pro samma färgschema som ditt WordPress-tema. Du kan dock även använda färgschemat ”Light” eller ”Dark” för video feed.

Du kan också designa ditt eget färgschema genom att clicka på alternativet ”Customize” och sedan använda controls för att ändra bakgrundsfärg, text och links.

Customize feed color scheme

För att add a header to your YouTube feed, you need to visit the ’Header’ panel. Härifrån, toggle ’Aktivera’ -omkopplaren för att aktivera headern.

Du kan också använda kontrollerna för att växla mellan standard och text header stilar. Om du väljer alternativet ”Text” får du möjlighet att ändra textstorlek och färg.

Customize YouTube feed header

Du kan också customize utseendet på videospelaren genom att gå till panelen ”Videos”.

Här ser du en lista med olika alternativ.

Videos panel option

För att customize videolayouten och enskilda egenskaper, besök panelen ’Video Style’ settings.

Här kan du selecta layout, bakgrundsfärg och ram för videoklippet.

Customize video style

Därefter öppnar du panelen ”Edit Individual Elements”. Här kontrollerar du boxarna bredvid de element som du vill visa tillsammans med YouTube live-stream videoklipp.

You can show or hide the Play icon, video title, live stream countdown, descriptions, and more.

Edit the individual elements you want to display along with the video

Därefter headar du över till inställningen ”Hover State”. Här kan du välja de enskilda element som ska visas när användaren hoverar musen över YouTube videoklippet.

You can pick many elements, including video title, description, date, views, and more.

Customize hover state

Efter det, besök panelen ”Video Player Experience”.

Du kan nu ändra bildförhållandet för videoklippet. Du kan också välja om videoklippet ska börja spelas automatiskt eller vänta tills besökaren klickar på knappen för uppspelning.

Customize video player experience

När du har customizeat de enskilda videoklippen växlar du till panelen ”Load More Button”.

Här, under inställningen ”Ladda mer knapp”, kan du växla toggle till ”Aktivera”. Detta kommer att visa fler förslag på videoklipp efter livestreamen.

Du kan också välja bakgrundsfärg, hovering och text från inställningarna i den vänstra panelen.

Customize the Load More button

Därefter växlar du till panelen ”Subscribe Button” och togglar knappen till ”Enable” om du vill aktivera knappen för YouTube-prenumeration.

Du kan också ändra knappens färg, text och hover-tillstånd i inställningarna.

Customize Subscribe button

När du har customize YouTube live feed, kan du preview hur det kommer att se ut på stationära datorer, surfplattor och smartphones. Klicka bara på de olika knapparna i det övre högra hörnet för att previewa feeden på olika devices.

Glöm inte att klicka på knappen ”Save” högst upp för att spara dina ändringar.

Preview and save feed

Embed YouTube Live Stream på en WordPress Page

Nästa steg är att embedda din YouTube live feed på en WordPress page. För att göra detta måste du först clicka på knappen ”Embed” högst upp.

Detta kommer att öppna prompten ”Embed Feed”. För att fortsätta, click the ”Add to a Page” button.

Click Add to a page button to embed YouTube feed

Popupen visar nu en lista över all WordPress pages på your website.

Välj bara den page där du vill embedda YouTube live stream och click the ”Add” button.

Choose a page where you want to embed the feed and click on the Add button

Den page som du valde kommer nu att öppnas i block editor.

Härifrån klickar du på knappen ”Add Block” (+) i det övre vänstra hörnet och söker efter Feeds for YouTube-blocket.

När du har hittat det kan du lägga till blocket på din page genom att clicka på det.

Embed YouTube Feed on a page

Glöm inte att clicka på knappen ”Update” eller ”Publicera” för att save your changes eller göra dem live.

Så här ser YouTubes live feed ut på vår demo website.

YouTube Feed Page preview

Add a YouTube Live Feed as a Widget

Du kan också add to en YouTube live feed till WordPress sidebar som en widget.

Först, head över till sidan Appearance ” Widgets från admin sidebar.

Här klickar du på knappen ”Add Block” (+) högst upp till vänster på vyn och hittar blocket Feeds for YouTube.

Klicka sedan på blocket för att lägga till det i widgetområdet.

Add YouTube Feed as a widget

Glöm inte att clicka på knappen ”Update” för att save your changes.

Så här ser YouTubes live feed ut i sidebaren på vår demo website.

Widget Preview of YouTube feed

Add to en YouTube Live Stream i hela Site Editor

Om du använder ett block-baserat theme är den här metoden något för dig.

Gå först till sidan Appearance ” Editor från admin sidebar för att starta Site Editor.

Härifrån klickar du på knappen ”Add Block (+)” högst upp och letar efter Feeds for YouTube-blocket.

Därefter kan du dra and drop blocket till var du vill visa YouTube-feeden på din page.

Add the YouTube feed in FSE

När du är klar, glöm inte att klicka på knappen ”Save” för att tillämpa ändringarna.

Här är en preview av live streamingen på vår demo website.

FSE preview of YouTube live feed

Bonus: Embed en YouTube Playlist i WordPress

Förutom live streams kan du också embedda YouTube playlists på din WordPress site med Smash Balloon YouTube Feed plugin.

Du kan använda den här playlisten för att fånga användarnas uppmärksamhet, öka engagemanget och minska avvisningsfrekvensen.

För att lägga till en YouTube playlist, besök YouTube Feeds ” All Fe eds page och klicka på knappen ’Add New’. Detta kommer att leda dig till en new vy, där du måste select alternativet ”Playlist” som feed-typ.

Select Playlist as feed type

Då måste du ansluta ditt YouTube-konto till Smash Balloon genom att tillhandahålla dess API key från Google Console.

Efter det måste du öppna den YouTube playlist som du vill add to och kopiera dess ID:n från URL:en ovan. ID:n kommer att vara en string med bokstäver och siffror efter symbolen ”=” i URL:en.

Nu kan du besöka din WordPress dashboard för att lägga till playlist ID:n i fältet ”Add Source” och klicka på knappen ”Next”.

När du har gjort det kommer Smash Balloons feed editor att öppnas på vyn, där du kan customize playlistornas appearance efter vad du gillar.

Add the playlist ID

Du har nu utan problem lagt till din YouTube playlist. För mer detaljer om detta kan du se vår tutorial om hur du embedar en YouTube playlist i WordPress.

Vi hoppas att den här artikeln hjälpte dig att lära dig hur du embedar YouTube live streams i WordPress. Du kanske också vill läsa vår tutorial om hur du lägger till dina sociala media feeds till WordPress eller kontrollera våra toppval för de bästa sociala media plugins för att växa din site.

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.

Avslöjande: Vårt innehåll stöds av våra läsare. Det innebär att om du klickar på några av våra länkar, kan vi tjäna en provision. Se hur WPBeginner finansieras, varför det är viktigt, och hur du kan stödja oss. Här är vår editoriala process.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Den ultimata WordPress-verktygslådan

Få GRATIS tillgång till vår verktygslåda - en samling WordPress-relaterade produkter och resurser som varje professionell användare bör ha!

Reader Interactions

1 kommentarLämna ett svar

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

Lämna ett svar

Tack för att du väljer att lämna en kommentar. Tänk på att alla kommentarer modereras enligt våra policy för kommentarer, och din e-postadress kommer INTE att publiceras. Vänligen använd INTE nyckelord i namnfältet. Låt oss ha en personlig och meningsfull konversation.