HTML YouTube Videos

De eenvoudigste manier om video's in HTML op te nemen is door YouTube te gebruiken.

Verward over videoformaten?

Het converteren van video's naar andere formaten kan moeilijk en tijdrovend zijn.

Een eenvoudiger oplossing is om YouTube de video op je webpagina af te spelen.

YouTube Video Id

Wanneer je de video opslaat (of afspeelt), toont YouTube een ID (bijvoorbeeld ih1l6wb7LhU).

Je kunt deze ID gebruiken en verwijzen naar je video in de HTML-code.

YouTube-video in HTML zetten

Wil je de video afspelen op je webpagina, voer dan de volgende stappen uit:

  • Laad de video op naar YouTube
  • Maak een notitie van de video ID
  • definiëren in je webpagina <iframe> element
  • Laat src eigenschap om de URL van de video aan te wijzen
  • Gebruik width en height Gebruik eigenschappen om de afmetingen van de speler te bepalen
  • Voeg andere parameters toe aan de URL (zie verderop)

Voorbeeld

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU">
</iframe>

Probeer het zelf

YouTube Autoplay + Mute

Je kunt de video automatisch afspelen wanneer de gebruiker de pagina bezoekt door autoplay=1 toe te voegen aan de YouTube URL. Maar, het automatisch afspelen van video's kan de gebruikers verveeld maken!

Opmerking:In de meeste gevallen staat Chromium-browser niet toe om automatisch af te spelen. Maar het is altijd toegestaan om gedempte automatische afspeling toe te staan.

In autoplay=1 Voeg daarna toe mute=1Maakt het mogelijk dat uw video automatisch begint af te spelen (maar is gedempt).

YouTube - Automatisch afspelen + Gemuteerd

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU?autoplay=1&mute=1">
</iframe>

Probeer het zelf

YouTube Afspeellijst

Door komma's gescheiden lijst van te spelen video's (originele URL uitgesloten).

YouTube Herhaling

Toevoegen loop=1 Zorgt ervoor dat uw video altijd herhaald wordt.

Waarde 0 (standaard): Video wordt eenmaal afgespeeld.

Waarde 1: Video zal herhalen (voor altijd).

YouTube - Herhaling

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU?playlist=ih1l6wb7LhU&loop=1">
</iframe>

Probeer het zelf

YouTube Bedieningsknoppen

Toevoegen controls=0 Zorgt ervoor dat de videospeler geen bedieningsknoppen weergeeft.

Waarde 0: Spelerbedieningsknoppen worden niet weergegeven.

Waarde 1 (standaard): Spelerbedieningsknoppen worden weergegeven.

YouTube - Bedieningsknoppen

<iframe width="420" height="315"
src="https://www.youtube.com/embed/ih1l6wb7LhU?controls=0">
</iframe>

Probeer het zelf