How to display Embed Youtube video in your websites with various options

Lot of peoples struggling to place the video file to their websites. The YouTube is one of the good resource to use videos with perfect format in your website as a embedded YouTube video format. The youtube embedded videos haves lot of option to be enable and disable in this. We will see the entire videos option in this post. It is very easy to implement videos in webpages follow the below steps.

Step 1: Open uploaded video in Youtube and click share button.

Embed Youtube video in your websites



















Step 2: Click Embed and copy the code and paste it in your webpage.

Embed Youtube video in your websites


















Example Embed Video with full screen:

If you want embedded video also want to allow full screen you can use the below code. This code helps you to provide option in right corner icon to view the full screen .

<iframe allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/L9e-wC_1Mcs" width="560"></iframe>



Disable full screen on youtube Iframe Video

In some place you don't want to show the full screen option to the customers so you can disable the fullscreen mode using below code. This is nothing just remove the allowfullscreen from the previous code

<iframe frameborder="0" height="315" src="https://www.youtube.com/embed/L9e-wC_1Mcs" width="560"></iframe>



Example: YouTube Embed Video with Autoplay option

In some places you want to display the auto play videos there is an option in the youtube embed video you just use ?autoplay=1 to the youtube embed video url. just refer the below code and the below example to clear understand.

<iframe frameborder="0" height="315" src="https://www.youtube.com/embed/L9e-wC_1Mcs?autoplay=1" width="560"></iframe>



Example: YouTube Embed Video with Loop option

The youtube video with loop is nothing but this video will continuously repeated. To do this you can use the code ?playlist=video id&loop=1 you can also set the different video id so that that two videos will repeated. and also you can set the playlist using different types of video id.

<iframe frameborder="0" height="315" src="https://www.youtube.com/embed/L9e-wC_1Mcs?playlist=L9e-wC_1Mcs&loop=1" width="560"></iframe>



Example: YouTube Embed Video without Controls

If you don't want to display the any controls in the youtube video you just use ?controls=0 this code after youtube embed id with controls=0 so that it won't display any controls in youtube embed video.


<iframe frameborder="0" height="315" src="https://www.youtube.com/embed/L9e-wC_1Mcs?controls=0" width="560"></iframe>



Example: YouTube remove related Videos

This is one of the important thing because at the end of the video every youtube videos will show the related videos default so to avoid this related videos you can use this ?rel=0 in youtube embed video url.Below is the iframe code with example to your better understand.
<iframe frameborder="0" height="315" src="https://www.youtube.com/embed/L9e-wC_1Mcs?rel=0" width="560"></iframe>



 For More For more options and controls visit youtube api link  youtube iframe Player API Click Here

Post a Comment

0 Comments