HTML YouTube

YouTube videos can be easily embedded into HTML pages using iframes. This approach avoids video format issues and relies on YouTube for hosting and playback.

On this page

HTML YouTube Videos

The easiest way to play videos on a web page is by embedding YouTube videos.

Why Use YouTube?

Handling video formats and browser compatibility can be complex.

By using YouTube, video hosting, encoding, and playback are handled automatically.

YouTube Video ID

Each YouTube video has a unique identifier, such as tgbNymZ7vqY.

This ID is used to embed the video into an HTML page.

Embed a YouTube Video

YouTube videos are embedded using the <iframe> element.

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

Always define width and height to control the player size.

YouTube Autoplay

You can enable autoplay by adding autoplay=1 to the video URL.

Most browsers block autoplay with sound, but muted autoplay is allowed.

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

YouTube Playlist

You can play a playlist or multiple videos by providing a comma-separated list of video IDs.

YouTube Loop

To loop a video continuously, use loop=1 together with the playlist parameter.

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

By default, loop is disabled and the video plays only once.

YouTube Controls

You can hide or show player controls using the controls parameter.

  • controls=1 – shows player controls (default)
  • controls=0 – hides player controls
 <iframe width="420" height="315"         src="https://www.youtube.com/embed/tgbNymZ7vqY?controls=0"> </iframe> 

HTML YouTube Examples (4)