A Guide to YouTube Embedded Video Player Parameters
If you've ever looked at the YouTube video embed markup, it's really nothing more than an iFrame with the src set to the video server and unique video ID. What you may not realize is that the URL also accepts a number of query parameters that govern the behavior of the video playback. Popular options include starting at a specific point and forcing the HD quality version to play. In this follow-up to the There's More than One Way to Play Embedded YouTube Videos! article, we'll go over some of these and test their effect on an embedded video.
Including Video Parameters
Underneath the embed code, you'll see a link to "Show More" options:
That brings up a video preview, along with some extra parameters, including:
- Video size
- Show suggested videos when the video finishes
- Show player controls
- Show video title and player actions
- Enable privacy-enhanced mode
Setting the view size changes the iFrame's height and width attributes. The other four are added to the URL in the form of query parameters. For instance, deselecting the Show player controls checkbox adds "?controls=0" to the URL. Additional parameters are appended using the URL encoded "&" ampersand (&), i.e. "?controls=0&showinfo=0", but the unencoded ampersand character works just as well.
But that's just the tip of the iceberg. You can manually append many more options yourself. For the remainder of the article, we'll try out a few of them, using my alter ego's slideshow music video as an example.
Setting the Start and End Points
You may only be interested in showing part of a video on your site. For that, you can set the start and end parameters. Both take a positive integer that cause player to look for the closest keyframe to the times you specify, in seconds. That may result in the actual start and end times landing just before (for start) or after (for end) the requested times, but usually by no more than about two seconds. Keep in mind that the end time is from the real start of the video and not from point that you tell it to start. Here is the URL to play only the part of the video that shows me playing the latest addition to my axe arsenal - a double neck!
Here's the resulting playback:
How to Get the Start and End Values
Don't worry, you don't have to sit there with a stop watch to figure out the start and end points! Just play the main YouTube video and pause it where you'd like it to start. Then right-click on the video and select "Get video URL at current time" from the popup menu. That will give you an URL like the following:
Note that the URL produced is that of the main video and NOT the embed code. Therefore you have to copy the "t" value into your embed URL - "44" in the above example.
Continue playing the video until your end point and repeat the above procedure for the end point.
Looping the Video
The music doesn't have to end when the video does. You can loop it using the loop parameter. It only accepts a value of 0 (don't loop) or 1 (loop away). The default is 0, which is the same behavior as when the loop parameter is not included.
Note that the loop parameter works best in the HTML5 player. In the AS3 player, the loop parameter only works when used in conjunction with the playlist parameter. As a workaround, you can loop a single video by setting the playlist parameter value to the same video ID as already defined in the URL:
Here's the URL for that:
...which produces the following*:
*Note that I used the start parameter to begin video playback towards the end of the video.
Setting YouTube Video Parameters the Easy Way!
Once you've got more than a couple of parameters to deal with, it can quickly become a tiring process. An easier way to append parameters is to utilize an online form such as the one found on the TechAirlines site.
Just pick and choose the ones you want, and it generates the URL accordingly. In that form, the "Website Parameters" section generates URL to play the video on the YouTube site, whereas the "Embed Parameters" section is for creating a URL for embedded video content.
Rob Gravelle resides in Ottawa, Canada, and is the founder of GravelleWebDesign.com. Rob has built systems for Intelligence-related organizations such as Canada Border Services, CSIS as well as for numerous commercial businesses.
In his spare time, Rob has become an accomplished guitar player, and has released several CDs. His band, Ivory Knight, was rated as one of Canada's top hard rock and metal groups by Brave Words magazine (issue #92) and reached the #1 spot in the National Heavy Metal charts on Reverb Nation.