Javatpoint Logo
Javatpoint Logo

How to Embed Youtube Video in Html

If we want to embed the Youtube video in Html document, we have to follow the steps which are given below. Using these steps, we can easily show a Youtube video on the web page.

Step 1: Firstly, we have to upload a video on a Youtube which is to be shown on a web page. And then we have to take an Id of that video.

Step 2: Now, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to embed a video.

Step 3: And then, we have to place the cursor at that point where we want to show the video. After that, we have to define the <iframe> tag at that point.

Step 3: Now, we have to add the attribute of iframe tag whose name is "src". So, type the src attribute within the <iframe> tag.

Step 4: After that, we have to give the URL of that Youtube video which we want to embed. So, type the URL of the video in the src attribute.

Step 5: After that, we can also set the dimensions (width and height) of a player by using two different attributes as shown in the following block:

Step 6: And, at last, we have to save the Html file or Html Code in the text editor. And then run the file.

Test it Now

The output of above Html code is shown in the following screenshot:

How to Embed Youtube Video in Html

Youtube Video Autoplay

If we want to start the video automatically when we visit the web page on which youtube video is present. Then, we can easily use the autoplay option in the Html document for starting the video automatically.

Test it Now

The output of above Html code is shown in the following screenshot with the autoplay feature:

How to Embed Youtube Video in Html




Help Others, Please Share

facebook twitter pinterest

Learn Latest Tutorials


Preparation


Trending Technologies


B.Tech / MCA