Embedding a YouTube Video in HTML5

In case you were wondering how to reference a YouTube video on your website, we've got you covered. Here, we will describe the step-by-step process you will need to follow in order to embed your video.


Step One:

The first step in embedding a video from YouTube is going to the actual site. Searching Youtube.com in your browser will bring you there.


Step Two:

The next step in this process is finding a video to embed. For this example, I chose a video made by Primer on the simulation of aggrssion. It explains aggression for finding food in societies and how parties may become more aggressive over scarce resources. Now, we need to click on this video.


Step Three:

The third step in the embed product is to look at the share options on the YouTube video you have selected. These are located to the lower right of the video player, right next to the like and dislike options. They should be pretty simple to find if you are looking.


Step Four:

Step four is to select the embed feature upon clicking the share option. The share option will bring up a meanu that looks like this (left) and allows the user to share the video in multiple different ways. The leftmost option, the embed option, is what we want to choose.



Step Five:

The final step in this process is to copy the embed text from this menu into your HTML5 file. It is very simple, and you can place it in a float, a div, or even in a fixed position to move along with your webpage. The embedded video from YouTube comes with built-in controls as you would see on the actual YouTube website, which allows for change in quality, speed, and the ability to play said video in fullscreen. See the result below!