How to Embed YouTube Videos in HTML

The easiest way to play videos in HTML is to embed YouTube videos. Converting videos to different formats can be difficult and time-consuming. A simpler solution is to embed YouTube videos directly on your web page . You can do it using an <iframe> element.

YouTube Video ID

YouTube will display an ID (such as wDMhITgmlc0) when you save or play a video. You can use this ID to reference your video in the HTML code.

Playing a YouTube Video in HTML

To play your video on a web page, follow these steps:

• Upload the video to YouTube.
• Note the video ID.
• Define an <iframe> element in your web page.
• Set the src attribute to the video URL.
• Use the width and height attributes to specify the dimensions of the player.
• Add any additional parameters to the URL as needed (see below).

<iframe width="480" height="270" src="https://www.youtube.com/embed/wDMhITgmlc0" ></iframe>

YouTube Autoplay + Mute

You can enable your video to start playing automatically when a user visits the page by adding autoplay=1 to the YouTube URL. However, keep in mind that autoplaying videos can be annoying for your visitors.

Note: Chromium browsers do not allow autoplay in most cases. However, muted autoplay is always allowed.

To allow your video to start playing automatically (but muted), add mute=1 after autoplay=1 in the YouTube URL.

<iframe width="480" height="270" src="https://www.youtube.com/embed/wDMhITgmlc0?autoplay=1&mute=1">
</iframe>

YouTube Loop

To allow your video to loop forever, add loop=1 to the YouTube URL. You also need to specify the video id in the playlist parameter as show on the below code.

<iframe width="480" height="270" src="https://www.youtube.com/embed/wDMhITgmlc0?playlist=wDMhITgmlc0&loop=1">
</iframe>

YouTube Controls

To hide controls in the video player, you can add controls=0 to the YouTube URL.

<iframe width="480" height="270" src="https://www.youtube.com/embed/wDMhITgmlc0?controls=0"></iframe>