Home / WordPress / Hoe je YouTube video’s kunt embedden op je WordPress website

Hoe je YouTube video’s kunt embedden op je WordPress website

Hoe je YouTube video's kunt embedden op je WordPress website

Videoโ€™s geven je blogbericht een heel nieuw leven. Mensen kijken graag naar dingen en iets wat in 600 woorden beschreven wordt, kun je in een filmpje van 2 minuten uitleggen.

Sinds WordPress versie 2.9 kun je heel eenvoudig videoโ€™s van YouTube embedden in je berichten en paginaโ€™s op je WordPress website. Met de nieuwe editor in WordPress 5.0 is het gelukkig niet moeilijker geworden.

Het is niet alleen mogelijk om YouTube videoโ€™s te embedden, het kan ook met videoโ€™s van websites als Vimeo, Flickr, DailyMotion, WordPress.tv, en nog een aantal meer.

Voor het gemak neem ik in dit artikel YouTube als voorbeeld omdat dit de grootste en populairste videowebsite is.

Video: YouTube video insluiten op WordPress

In onderstaande video laat ik je zien hoe je een Youtube video kunt insluiten op jouw WordPress website.

Abonneer je op mijn YouTube kanaal

Heb je de uitleg liever in tekst? Lees vooral hieronder verder.

Hoe je een YouTube video embed op je WordPress website

Er zijn verschillende manieren om een video van YouTube te embedden op je WordPress website. Bij de ene manier doet WordPress het werk en bij de andere manier kun je zelf de embedcode (insluitcode) handmatig plaatsen.

Youtube video insluiten in WordPress 5.0 en hoger

In WordPress 5.0 is een nieuwe editor gekomen, namelijk de Gutenberg editor. Je kunt met deze editor op een hele eenvoudige manier een YouTube video embedden op je website.

Om een video in te sluiten kun je het YouTube blok gebruiken. Je kunt dit blok vinden onder het tabje insluitingen.

WordPress YouTube Gutenberg blok invoegen

Zodra je op het YouTube blok hebt geklikt, krijg je de mogelijkheid om een URL van een YouTube video toe te voegen.

YouTube video url insluiten

Vul de URL van de video in die je wilt embedden en druk vervolgens op โ€œInsluitenโ€. Meer werk is het niet. Je video zal nu getoond worden in de editor zelf en natuurlijk in het artikel. In de editor ziet het er als volgt uit.

Ingesloten YouTube video in de Gutenberg editor

Je hebt zoals je ziet dus ook nog de mogelijkheid om een onderschrift toe te voegen.

Youtube video insluiten in WordPress 4.9 en lager

In WordPress 4.9 en lager werkt alles net een heel klein beetje anders. Je hebt hier namelijk nog te maken met de klassieke editor. In plaats van met blokken, werk je met een lap tekst. Je kunt de video insluiten met behulp van de URL of je kunt een insluitcode gebruiken die je op YouTube kunt vinden.

Manier 1: Maak gebruik van WordPress oEmbed

Sinds WordPress versie 2.9 maakt WordPress gebruik van de oEmbed functionaliteit. oEmbed is een protocol voor site A (je blog) om aan site B (zoals YouTube) de HTML code te vragen die nodig is om content van site B te embedden.

oEmbed is gemaakt om te voorkomen dat je HTML code hoeft te kopiรซren van de video (of andere media) van de website waar het gehost staat. Je kunt met de volgende stappen eenvoudig een video embedden dankzij oEmbed.

Stap 1: Zoek op YouTube een video uit die je op jouw website wilt plaatsen.

Stap 2: Kopieer de URL van je uitgekozen video.

YouTube video URL

Stap 3: Ga naar het bericht (of pagina) waar je de video op wilt embedden en plak de URL op de juiste plek in het bericht. De YouTube video zal nu te zien zijn wanneer je je bericht bekijkt.

Extra informatie
Het maakt niet uit of je de URL in de visuele editor (WYSIWYG) plakt of in de HTML editor. Het zal in beide gevallen werken.

Waar je wel op moet letten is dat de URL een regel voor zichzelf heeft en dat de URL niet klikbaar (een hyperlink) is.

Voorbeeld hoe het moet:
Tekst, tekst en nog meer tekst.

http://www.youtube.com/watch?v=ID

Meer hoef je niet te doen om een filmpje in je bericht te krijgen, het is echt super eenvoudig.

Manier 2: Embed handmatig een YouTube video

Dit is een manier die je ook kunt gebruiken als je geen WordPress website hebt. Het is nog altijd vrij eenvoudig.

Stap 1: Zoek op YouTube uit die je op jouw website wilt plaatsen.

Stap 2: Klik onder de video op โ€œDelenโ€ en vervolgens op โ€œInsluitenโ€. Je krijgt nu het volgende te zien:

Embed YouTube video

Stap 3: Vul de opties naar wens in en kopieer de insluitcode die je krijgt.

Videoformaat: Wanneer je op de knop klikt waar in bovenstaande afbeelding 560ร—315 staat, kun je het formaat van de video aanpassen. Er staan een aantal suggesties voor formaten en je hebt ook de mogelijkheid om een aangepast formaat te maken zodat het perfect op je website past.

Voorgestelde videoโ€™s: Indien je op het einde van de video andere videoโ€™s wilt laten zien kun je hier een vinkje neerzetten. Deze voorgestelde videoโ€™s kunnen ook van andere mensen zijn.

Privacymodus: Als je deze optie inschakelt betekent het dat YouTube geen informatie over bezoekers opslaat op je webpagina tenzij ze de video afspelen.

Oude insluitcode: Indien je alleen Flash ondersteuning wilt geven aan deze video kun je hier een vinkje zetten. Dit zou ik zelf niet aanraden om te doen. De standaard insluitcode ondersteunt namelijk ook flash en verder ook nog HTML5.

Stap 4: Ga naar het bericht (of pagina) waar je de video op wilt embedden. Je kunt vervolgens de insluitcode in de teksteditor plakken op de juiste plek in het bericht. De YouTube video zal nu te zien zijn wanneer je je bericht bekijkt.

Teksteditor WordPress

Let op: Je moet de insluitcode altijd plakken in de teksteditor en dus niet in de Wysiwyg editor. Plak je het wel in de Wysiwyg editor, dan zal de insluitcode als tekst verschijnen. Je kunt rechtsboven in de bewerker de teksteditor selecteren.

Extra informatie
Het is ook mogelijk om voor elkaar te krijgen dat de video automatisch afspeelt, vanaf een bepaalde tijdstip start of dat de ondertiteling automatisch aan staat.

Hoe je dit precies kunt instellen kun je bekijken op de pagina โ€œVideoโ€™s afspeellijsten insluitenโ€ van YouTube zelf.

YouTube video’s maken je website trager

YouTube video’s op je website plaatsen is sowieso altijd een goed idee. Bij mij zie je ook niet voor niks allerlei video’s in mijn artikelen. Wanneer je echter heel veel video’s plaatst, zeker op een enkele pagina, dan zal je merken dat je website wat trager wordt.

Er zijn diverse plugins beschikbaar die ervoor kunnen zorgen dat je hier geen last van zal ondervinden. Een cache plugin als WP rocket, wat ik sowieso aan kan raden om te gebruiken, is hier een ontzettend goed voorbeeld van. Hier heb je de optie om lazyloading voor YouTube video’s te gebruiken.

Wanneer een bezoeker je pagina bezoekt, dan zal er eerst alleen een thumbnail van de video geladen worden. Klikt de bezoeker op de thumbnail om de video te bekijken, dan wordt de video snel geladen zodat de bezoeker het kan bekijken.

Dit zorgt voor een vermindering van het aantal HTTP-verzoeken. Ik snap dat je wellicht niet weet wat ik hiermee bedoel. Simpel gezegd hoeft er minder direct geladen te worden op je pagina, wat voor een snelheidsverbetering zorgt.

Ik hoop dat het embedden van een YouTube video geen probleem meer voor je is na het lezen van dit artikel.

Indien je nog vragen hebt kun je deze hieronder in de reacties stellen. Wil je graag op de hoogte blijven van de videoโ€™s die ik publiceer op YouTube? Abonneer je dan op mijn YouTube kanaal.


WordPress Hulp Nodig? Join Het WP Lab

Het WordPress Lab Mockup

Heb je vragen aan de hand van dit artikel of wil je verder op weg geholpen worden met je website?

Sluit je aan bij Het WordPress lab, een community voor WordPress-liefhebbers waarin ik antwoord geef op jouw WordPress vragen en je toegang krijgt tot al mijn WordPress cursussen.

ยซ
ยป

52 reacties op “Hoe je YouTube video’s kunt embedden op je WordPress website”

  1. Pien avatar

    Hi Maikel,
    Kan je bekijken op youtube.com ook weghalen wanneer je de video insluit op je website?
    ben benieuwd of dat mogelijk is.
    Groet Pien

    1. Maikel van de Weerd avatar

      Er zullen ongetwijfeld plugins voor zijn die zo’n video op een andere manier inladen dan YouTube uit zichzelf doet waarmee het kan, maar ik heb daar zelf nog niet naar gezocht. Via de standaardmogelijkheden is het echter niet mogelijk.

  2. Esmee avatar

    Goedemorgen, op de homepage van ons bedrijf hebben we een achtergrond video staat. Deze staat gelinkt aan onze Youtube video. Sinds een aantal weken staat hier alleen “Deze video is niet beschikbaar”. Het lukt me ook niet om hem opnieuw te linken aan de site omdat ik telkens de bovenstaande melding krijg. Weet iemand wat ik hier fout doe?

    Alvast bedankt!

    1. Maikel van de Weerd avatar

      Het is je zo te zien ondertussen alweer gelukt.

  3. Monique Boesten avatar

    Hoi Maikel, ik begrijp uit voorgaande vragen dat ik niet kan voorkomen dat aan het einde van de video een overzicht van youtube videoโ€™s te zien is. Maar… als je na het afspelen van de video (in youtube) teruggaat naar de website dan zie ik daar dus een still van het overzicht van youtube videoโ€™s in plaats van de still van mijn eigen video. Hoe kan ik dat voorkomen?
    Groetjes, Monique

    1. Maikel van de Weerd avatar

      Ik weet niet goed of het nu nog steeds werkt, maar dan zal je de insluitcode van YouTube moeten gebruiken en in HTML op je website moeten plaatsen. In de URL zal je dan aan het einde nog “?rel=0” moeten toevoegen. Dit geeft aan dat er alleen gerelateerde video’s van je eigen kanaal gebruikt mogen worden.

  4. Marijke avatar

    Beste Maikel, dank voor de duidelijke uitleg. Ik heb nog รฉรฉn vraag: kost het embedden van een vimeo filmpje me een hoop geheugenruimte binnen mijn hosting pakket, zoals bij foto’s, of is dat hier niet aan de orde?

    1. Maikel van de Weerd avatar

      Nee, het kost je helemaal geen ruimte en je server wordt ook niet belast bij het afspelen. Daarom adviseer ik mensen ook altijd om YouTube of Vimeo te gebruiken om video’s op te plaatsen.

  5. Sven avatar
    Sven

    Voor een livestream heb ik mijn youtube link op mijn wordpress website toegevoegd. dat geeft die wel weer maar als ik mijn livestream wil starten en wil vanaf mijn website de livestream bekijken geeft die aan afspelen op andere websites is uitgeschakeld door de eigenaar van de video. ik ben zelf eigenaar en in youtube heb ik insluiten toestaan aangevinkt maar youtube zegt dan Er zijn problemen opgetreden bij het opslaan van de video,
    Wat doe ik verkeerd?

    1. Maikel van de Weerd avatar

      Je moet volgens mij ook embedden voor live streams aan hebben staan. Dit is weer een andere optie als ik het goed hebt.

      1. Lisanne avatar
        Lisanne

        Ik loop tegen hetzelfde probleem aan maar kan de optie niet vinden. Als ik een livestream start en bij instellingen ‘insluiten toestaan’ kies krijg ik de melding dat er problemen zijn bij het opslaan van de video. Is het probleem bij Sven opgelost? Dan hoor ik graag hoe. Bvd.

  6. Trees van der Vliet avatar

    Hoi Maikel,
    Heb een vraagje over het formaat van de ingesloten video. In de klassieke editor van Wordpress kon je dat zelf regelen.
    Is daar ook een mogelijkheid voor via de blokken-editor? Ik kan het zelf niet vinden.
    Voor mij hoeft zo’n video niet zo heel groot te zijn…
    Dank alvast voor je antwoord!
    Met vriendelijke groet,
    Trees van der Vliet

    1. Maikel van de Weerd avatar

      Hier is inderdaad niet direct een optie voor. Je zou dit kunnen aanpassen door een CSS class toe te voegen en hier CSS code voor te schrijven. Ik weet alleen niet of dit ook in de WordPress.COM versie kan. Ik richt mij alleen op de WordPress.ORG versie.

  7. Joshua avatar
    Joshua

    Beste Maikel,

    Klopt het dat als je een video van Youtube insluit (embed) op je website, ook de bijbehorende reclames worden afgespeeld, die normaal op Youtube plaats vinden? Zo ja, is dat (legaal) te voorkomen?

    Groeten,

    Joshua

    1. Maikel van de Weerd avatar

      Volgens mij kan het worden weergegeven inderdaad, maar is dit ook weer niet altijd. Hoe je het kunt uitschakelen voor embeds durf ik niet direct te zeggen.

  8. Marcel avatar

    Beste Maikel,

    Supertips allemaal en dank daarvoor!
    Is het mogelijk om bij het insluiten van een YouTube video in een training binnen een e-learn omgeving (zoals b.v. Learndash) de url van de video (die je ziet als je met de rechtermuistoets op de video klikt) te dis-abelen? Tenslotte wil je dat alleen degenen die toegang hebben tot de training deze video zien en niet dat ze de link van de verborgen YouTube video verspreiden.

    1. Maikel van de Weerd avatar

      Nee, dit kan volgens mij niet bij YouTube. Het is dan ook gebruikelijker om voor online leeromgevingen gebruik te maken van Vimeo Plus, omdat je hier dit soort opties wel hebt en het bijvoorbeeld alleen op een specifiek domeinnaam kunt tonen.

  9. Merlina avatar

    Hoi Maikel, ik wil voorkomen dat aan het einde van de video een overzicht van youtube videos’s te zien is. Kun je me misschien een (hele) voorbeeldcode geven hoe ik dat kan voorkomen? Deze vraag stond al eerder op deze pagina met jouw antwoord: “Dit kan je doen door achter de url ?rel=0 te zetten tijdens het insluiten.”
    Helaas lukt het me nog niet.
    Groetjes Merlina

    1. Maikel van de Weerd avatar

      YouTube heeft deze optie uitgeschakeld, zodoende dat het niet meer voor je werkt. Met de ?rel=0 code kun je als het goed is nu nog wel zorgen dat alleen video’s van je eigen YouTube kanaal worden getoond.

      1. Merlina avatar
        Merlina

        Hoi Maikel, bedankt voor de snelle reactie. Kun je misschien aangeven waar ik die ?rel=0 moet plaatsen? Dat lukt me maar niet.
        in iframe?
        Ik kan de code hier niet plaatsen, accepteert de website niet, misschien kun je het per mail sturen?
        Alvast bedankt voor je hulp
        Groetjes Merlina

  10. Kees avatar
    Kees

    Op http://www.vanhattum-infra.nl is een .mp4 bestand van 10 seconden ge-embedded. Dat is gelukt, echter is deze niet op de smartphone in afspeelmodus zichtbaar. Enig idee wat ik hiervoor moet doen?

    1. Maikel van de Weerd avatar

      Nee, ik heb hier nooit problemen mee gehad. Zal vermoedelijk aan de manier liggen hoe je het embedded hebt.

  11. maarten avatar

    Beste maikel ,

    Ik heb verschillende video’s van youtube op mijn site staan. echter nu ik deze video wil afspelen staat er : Video niet beschikbaar . afspelen op andere websites is uitgeschakeld door de eigenaar van de video.

    Nu ben ik zelf de eigenaar van de video , en heb deze embedded op mijn site

    Enig idee hoe ik dit kan uitschakelen zodat mijn video’s het gewoon doen?

    Alvast bedankt voor je hulp!

    1. Maikel van de Weerd avatar

      Bij de instellingen van de video op YouTube kun je aangeven of de video ingesloten mag worden. Je doet dit door de video te bewerken en op “Meer opties” te klikken. Hier kun je bij de aanvullende opties aangeven of een video ingesloten mag worden.

  12. Jansma avatar
    Jansma

    Hallo Maikel,
    Ik zocht naar een oplossing voor mijn probleem en kwam bij jouw artikel uit. Op onze bedrijfswebsite heb ik youtube video’s staan. Werkt allemaal perfect. Alleen op de pagina waar je kunt kiezen welke vlog je wilt zien, zie je bovenaan dat bericht nog de youtube link. Ik krijg dit niet weg, zie ik iets over het hoofd?? Zie de website: https://www.jansma.biz/category/vlog/

    1. Maikel van de Weerd avatar

      Technisch gezegd: Dit komt omdat de intro teksten met de excerpt functionaliteit worden opgehaald. Hier wordt alle opmaak gestript en daardoor zie je bovenaan de link.

      Wellicht dat onderstaande functie werkt om het op te lossen, dit zou je even moeten uittesten. Je kunt dit in het functions.php-bestand van je child theme plaatsen.

      function my_clean_excerpt($excerpt)
      {
      $excerpt = preg_replace('~http(s)?://[^\s]*~i', '', $excerpt);
      $excerpt_length = apply_filters('excerpt_length', 20);
      $excerpt_more = apply_filters('excerpt_more', ' ' . '[…]');
      $excerpt = wp_trim_words($excerpt, $excerpt_length, $excerpt_more);

      return $excerpt;
      }
      add_filter('get_the_excerpt', 'my_clean_excerpt');

  13. Annelies avatar
    Annelies

    Is het mogelijk om de info die bovenin video komt te staan(link om video in YouTube te bekijken, met foto van wie kanaal is en om te delen enz) weg te halen.
    Werk niet in WP, maar in dreamweaver, principe zal wel hetzelfde zijn lijkt me.

    1. Maikel van de Weerd avatar

      Nee, volgens mij is het standaard niet mogelijk om deze informatie weg te halen. In elk geval niet wanneer je het op de standaard manier insluit op je website. Wellicht zijn er wel andere trucs voor om dit alsnog te bereiken.

  14. Edwin de Vos avatar
    Edwin de Vos

    Mocht het Youtube filmpje perse openbaar zijn of is het ook mogelijk om een verbogen of prive filmpje te embedden naar de website?

    1. Maikel van de Weerd avatar

      Nee, dit is niet mogelijk. De verborgen/prive functie zou anders niet werken zoals het hoort. ๐Ÿ™‚

    2. Mart avatar
      Mart

      Mooie tips!

      Vraag: kun je met het insluiten van een youtube video op je site ergens mee voorkomen dat erna afloop automatisch volgende video’s worden afgespeeld?

      1. Maikel van de Weerd avatar

        Standaard worden als het goed is niet direct automatisch video’s afgespeeld bij een ingesloten video. Er worden hooguit andere video’s getoond die je kunt laten afspelen. Vroeger was hier een makkelijke oplossing voor om dat uit te schakelen, maar YouTube heeft dit uitgeschakeld.

  15. Monique Pals avatar
    Monique Pals

    Hoi Maikel,

    Na het embedden “rekt” de video uit en wordt de thumbnail korrelig. De thumbnail is geplaatst op YT en ik kan (en wil) hier niets in wijzigen… Het lijkt of YT een thumbnail comprimeert, maar bij embedden niet weer de juiste kwaliteit geeft. Heb jij enig idee hoe dit op te lossen?
    Overigens, ik heb een screenshot gemaakt, maar kan dat hier helaas niet toevoegen…

    1. Maikel van de Weerd avatar

      Het kan best dat YouTube de afbeeldingen extra comprimeert, waardoor het in enkele gevallen te slechte kwaliteit wordt. Wellicht dat het werkt om de afbeelding in een ander formaat te uploaden.

  16. Trees avatar

    Prima uitleg, hoewel ik het al zelf had uitgevonden.
    Een OT vraagje>
    Er komen verontruste berichten dat we niet zomaar meer muziek oid van YouTube mogen gebruiken op blogs? Weet jij daar iets van Maikel? Geen zin in ellende en de rubriek Zwijmelen op Zaterdag op mijn blog is zo leuk al doen we het niet met heel veel mensen. Er zijn trouwens mensen die elke dag een muziek-video plaatsen. Dus… mag dat nog wel?
    Dank vast voor je antwoord!

    1. Maikel van de Weerd avatar

      Ik weet hier niks van. Het zal eerder over muziek in YouTube video’s zijn waar je geen rechten over hebt lijkt mij.

  17. Nikki Bruinen avatar
    Nikki Bruinen

    Top!
    Alleen een vraagje… Het filmpje plaatsen lukt maar op mijn homepage zie je niet in het klein het filmpje wat bij foto’s wel het geval is… (als je wil doorklikken zegmaar…) Is daar iets aan te doen?
    Hopelijk begrijp je wat ik bedoel… ๐Ÿ˜‰

    1. Maikel van de Weerd avatar

      Ik snap helaas niet precies waar je het over hebt.

  18. Jo avatar

    Hoe zorg ik dat een geplaatste vimeo video in een online academie niet kan worden gedeeld?

    1. Maikel van de Weerd avatar

      Je kunt bij Vimeo (in elk geval bij de bepaalde versie) instellen dat het alleen op een bepaalde website getoond mag worden.

  19. Jan avatar

    Hallo als ik de insluitcode gebruik bliijft de film in een lus draaien terwijl dit uit staat. dus heb ik in de insluitcode iets verkeerd staan.
    ik heb al geprobeerd loop op o te zetten maar helaas

    1. Maikel van de Weerd avatar

      Wanneer je alleen de URL toevoegt aan WordPress, zal de video ingesloten worden zonder dat het in een loop komt.

  20. Anouk avatar

    Hoi,
    wanneer ik een filmpje insluit op mijn website en hij is afgelopen wordt er doorverwezen naar andere films. Is dit ook uit te zetten / kan ik mijn filmpje laten herhalen?

    Groetjes
    Anouk

    1. Maikel van de Weerd avatar

      Dit kan je doen door achter de url ?rel=0 te zetten tijdens het insluiten.

  21. John avatar

    Het plaatsen van een youtube video is prima gelukt. Vraag is alleen of de bezoekersteller op youtube nu ook blijft tellen. Is daar een instelling voor?

    1. Maikel van de Weerd avatar

      Is geen instelling voor. YouTube doet dit allemaal voor je.

  22. Tessa de Graaf avatar
    Tessa de Graaf

    Mijn filmpjes doen het wel goed, maar kan ik ook een beginafbeelding kiezen? nu is het een saai grijs vlak….nodigt niet echt uit tot kijken.

    Groetjes,

    Tessa

  23. iris avatar
    iris

    Wanneer ik de video op de website plaats, krijg ik staan dat het verificatieprobleem is. Wat betekend dit?

    1. Maikel van de Weerd avatar

      Dit heb ik eerlijk gezegd nog nooit gehoord. Wat is de exacte errormelding die je ziet staan en op wat voor manier probeer je de video te embedden?

  24. Lenie avatar
    Lenie

    Ik kon altijd een video insluiten om op mijn Weblog te plaatsen , maar sinds kort lukt het alleen om een leeg zwart vak te plaatsen en is er niets van de gekozen video te zien ..ik doe dat altijd op de 2 e manier en ging altijd perfect…wat is er fout gegaan ook het oude scherm is er niet meer wat uitrold als je insluiten aanklikt er is alleen een link te zien en als ik die kopieer en plak in mijn weblog ..zie je alleen een zwart vak….
    graag zou ik horen wat ik fout doe , en hoe ik op de oude vertrouwde manier weer een video kan plaatsen….
    Groetjes Lenie

    1. Maikel van de Weerd avatar

      Op YouTube zie je wanneer je op insluiten klikt alleen nog de iframe code. Wanneer je echter op “Meer weergeven” krijg je weer meerdere opties die je voorheen ook had.

      Dat je op je website alleen een zwart vak te zien krijgt ligt waarschijnlijk aan een plugin die je (sinds kort) gebruikt. Je kunt het beste even alle plugins uitschakelen en kijken of het probleem er dan nog is. Is het probleem opgelost, zet dan alle plugins 1 voor 1 weer aan om erachter te komen welke plugin de veroorzaker van het probleem is. Je kunt hier dan een alternatief voor zoeken.