Important: All scripts hosted on widcraft.googlecode.com don't work anymore because Google has blocked that SVN repository.
Most of bloggers/webmasters choose to host their videos on YouTube instead of their own website, which is a great way to get some extra views. Because if you're hosting it on YouTube, your video will also be visible to more than 800 million unique users every month. Also, by adding a backlink to your website, you can get some visitors from YouTube as well.
If you are going to use YouTube to host videos for your site, at the least, you should know some ways in which you can customize YouTube's embedded player.
YouTube Player Parameters:
To customize our YouTube player, first we need to learn about YouTube player parameters. So, I made a list of YouTube player parameters, which is available at this link. All of the parameters are optional. Note that these parameters are only officially supported by the embedded player.
For example, we're going to use "Autohide Video Controls After A Video Begins Playing," "Video Details" and "Video Player Theme" parameters from the list.
Customizing Old YouTube Player:
If you're still using old YouTube player, which is not a much smart choice but still, you can customize it with parameters. Below is the sample code of a non-customized YouTube player:
<object width="600" height="338"><param name="movie" value="http://www.youtube.com/v/6UWDdxJ_gZQ?hl=en_US&version=3"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/6UWDdxJ_gZQ?hl=en_US&version=3&autohide=0&showinfo=0&theme=light" type="application/x-shockwave-flash" width="600" height="338" allowscriptaccess="always" allowfullscreen="true"></embed></object>
Now to customize this player, we will add autohide=0 (to hide video controls after video begins playing), showinfo=0 (to hide video info) and theme=light (to add light theme to player.). Here is the customized old YouTube player:
<object width="600" height="338"><param name="movie" value="http://www.youtube.com/v/6UWDdxJ_gZQ?hl=en_US&version=3&autohide=0&showinfo=0&theme=light"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/6UWDdxJ_gZQ?hl=en_US&version=3&autohide=0&showinfo=0&theme=light" type="application/x-shockwave-flash" width="600" height="338" allowscriptaccess="always" allowfullscreen="true"></embed></object>
We'll add each parameter with "&" tag.
Customizing YouTube Player:
Now it's time for those who are up-to-date, and are using new YouTube player aka iFrame player. Customizing new player is same as old player. Below is the sample code for non-customized new YouTube player:
<iframe width="600" height="338" src="http://www.youtube.com/embed/6UWDdxJ_gZQ" frameborder="0" allowfullscreen></iframe>
First, we'll add "&" tag after video url. After "&" we'll add our first parameter, such as autohide=0. Then we'll add rest of parameters following "?" tag. Below is the code of customized new YouTube player:
<iframe width="600" height="338" src="http://www.youtube.com/embed/6UWDdxJ_gZQ?autohide=0&showinfo=0&theme=light" frameborder="0" allowfullscreen></iframe>
That was easy! Hope it'll help you in future posting. Finally, below are both, non-customized (in left) and customized (in right) YouTube players:
Important: Check our new website TricksPanda.com for WordPress tutorials, plugins and more.
