YouTube Shorts kan in je artikelen worden ingebed met een HTML-iframe. Hoewel YouTube momenteel geen directe embed-optie biedt voor Shorts, kun je ze tonen door de video-URL te wijzigen, te vervangen /shorts/ door /embed/, en deze in een iframe in te voegen. Dit geeft je volledige controle over de afmetingen, rand en styling van de ingesloten video.
Wanneer deze techniek te gebruiken
- Inbedding van korte videocontent: toon productwalkthroughs, snelle tips of aankondigingen die als YouTube Shorts zijn gemaakt direct in je artikelen.
- Schrijfwijze stappen aanvullen met video: voeg een Shorts-video in naast een procedure om lezers een visuele walkthrough te geven zonder de pagina te verlaten.
YouTube biedt momenteel geen native embed-optie voor Shorts aan. Deze oplossing werkt door te vervangen shorts door in embed de video-URL. Als YouTube in de toekomst officiële Shorts-embedding toevoegt, zou die methode in plaats daarvan gebruikt moeten worden.
Hoe je een YouTube Short inbed
-
Ga naar YouTube en open de Shorts-video die je wilt inbedden.
-
Kopieer de video-URL met een van de volgende methoden:
- Kopieer de URL uit de adresbalk van je browser.
- Klik op Delen > Kopiëren.
-
Plak de gekopieerde URL in het
srcveld van de iframe-code hierboven. -
In de URL vervangt
/shorts/u door/embed/.Bijvoorbeeld:
Before: https://www.youtube.com/shorts/pVRefGmQDJM After: https://www.youtube.com/embed/pVRefGmQDJM
- Plak de voltooide iframe-code in je artikel met behulp van de codeweergave of HTML-blok.
Snelle referentie
Vervang <Shorts_video_code> het door de ID van je video (de alfanumerieke code aan het einde van de Shorts-URL).
<iframe width="315" height="560"
src="https://www.youtube.com/embed/<Shorts_video_code>"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen></iframe>
| Veld | Standaard | Noten |
|---|---|---|
width |
315 |
Pas aan waar nodig, behoud de beeldverhouding |
height |
560 |
Optimale hoogte voor Shorts portretformaat |
src |
Je video-URL | Vervang /shorts/ met /embed/ in de URL |
frameborder |
0 |
Geplaatst in pixels, 0 verwijdert de rand |
Voorbeeld
Code:
<iframe width="315" height="560"
src="https://www.youtube.com/embed/pVRefGmQDJM"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen></iframe>
Output:
Reikwijdte en dekking
| Item | Detail |
|---|---|
| Aanbevolen maat | 315px × 560px (portret, komt overeen met Shorts 9:16 beeldverhouding) |
| Maatwerkmaten | Ondersteund, pas breedte en hoogte aan, maar behoud de verhouding 9:16 |
| Redacteurondersteuning | Elke editor die HTML iframe-tags ondersteunt |
| Native embed-optie | Momenteel niet beschikbaar voor YouTube Shorts |
Best practices
- Houd altijd de beeldverhouding van 9:16 aan: korte films worden in portretformaat opgenomen. Als je het frame verkleint, houd dan de breedte-hoogteverhouding op 9:16 (bijvoorbeeld 270×480 of 360×640) om te voorkomen dat de video uitgerekt of bijgesneden lijkt.
- Gebruik
frameborder="0": de rand op nul zetten geeft een strakker uiterlijk. Als je een zichtbare rand wilt, gebruik dan CSS op een wrapper<div>in plaats van hetframeborderattribuut, dat in HTML5 verouderd is. - Instellen
allowfullscreen: deze eigenschap stelt lezers in staat de video uit te breiden naar volledig scherm, wat de kijkervaring verbetert voor content met kleine tekst of details op het scherm. - Test de embed voordat je publiceert: na het invoegen van het iframe bekijk je het artikel om te bevestigen dat de video correct laadt. Als de video een fout laat zien, controleer dan dubbel of die
/shorts/volledig is vervangen door/embed/in de URL. - Houd videotitels beschrijvend: het
titleattribuut op het iframe wordt door schermlezers gelezen. Vervang"YouTube video player"het door een beschrijvende titel"Product setup walkthrough"om de toegankelijkheid te verbeteren.