HTML YouTube Videos: Embed, Autoplay, Customize, and Loop

To embed a YouTube video in an HTML page, you can use the YouTube embedded player code.

Here are the steps to do so:

• Go to the YouTube video you want to embed on your HTML page and click on the "Share" button below the video player.

• Click on the "Embed" option from the list of options that appear.

• Customize the player size and other settings according to your preferences.

• Once you have set the settings, copy the HTML code provided by YouTube.

• Paste the HTML code in your HTML page where you want the video to appear.

• Save your HTML page and open it in a web browser to view the embedded video.

Here's an example of the YouTube embedded player code:

<iframe
     width="560"
     height="315"
     src="https://www.youtube.com/embed/VIDEO_ID"
     frameborder="0"
     allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
     allowfullscreen
></iframe>

• Replace the "VIDEO_ID" with the ID of the YouTube video you want to embed.
• The width and height attributes specify the dimensions of the player, while the other attributes allow for various player settings such as autoplay, full screen, and more.

YouTube Autoplay + Mute

To autoplay a YouTube video and mute it by default, you can add two parameters to the YouTube embedded player code.

Here are the steps to do so:

• autoplay=1 to enable autoplay
• mute=1 to enable mute

As an example:

<iframe
     width="560"
     height="315"
     src="https://www.youtube.com/embed/VIDEO_ID?autoplay=1&mute=1"
     frameborder="0"
     allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
     allowfullscreen
></iframe>

YouTube Loop

To loop a YouTube video and make it play continuously, you can add a parameter to the YouTube embedded player code.

Here are the steps to do so:

• loop=1 to enable video looping

As an example:

<iframe
     width="560"
     height="315"
     src="https://www.youtube.com/embed/VIDEO_ID?loop=1"
     frameborder="0"
     allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
     allowfullscreen
></iframe>

YouTube Controls

To enable or disable YouTube video controls in an embedded player, you can add a parameter to the YouTube embedded player code.

Here are the steps to do so:

• controls=0 to disable video controls
• controls=1 to enable video controls (this is the default)

As an example:

<iframe
     width="560"
     height="315"
     src="https://www.youtube.com/embed/VIDEO_ID?controls=0"
     frameborder="0"
     allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
     allowfullscreen
></iframe>