How to Add Chromeless Youtube Videos in WordPress 3.9?

Sometimes we want our YouTube videos to be viewed in a clever media player that will add in a ton of functionality to help users get the most out of our content & there are cases when a simpler design or set of features makes more sense or would look more attractive.  In those situations, a developer might want to decrease the amount of “chrome”, the graphical user interfaces surrounding the content, that is viewable.  

The latest version of WordPress i.e. 3.9 is having in-built feature to add chromeless player with the help of HTML5 and CSS3. They integrated the latest version of MediaElement.js to get this feature and many more. That’s why if you are using the latest version of WordPress, you can have well integrated chromeless YouTube player by just using the below shortcode.

youtube_chromeless_wordpress

Video Embed shortcode of WordPress 3.9

This feature is available only in WordPress 3.9 and later. All you have to do is just embed the following shortcode having the url of the YouTube video in your page/post’s Edit panel & update the page/post.

[video src="https://www.youtube.com/watch?v=rrs7Z8FRQeQ"]

For the people having older versions of WordPress than WordPress 3.9, you can use any of the following plugins to get chromeless YouTube video player.

2. YouTube Chromeless :

The YouTube Chromeless plugin allows one easily insert YouTube videos into WordPress posts and play it in chromeless player.

Following are the step-wise guidelines to demonstrate its usage :

Step 1 :  On your WordPress dashboard, go to Plugins section. Click on Add New menu. Search for YouTube ChromelessInstall & Activate the plugin.

Step 2 : Now on the Edit panel of your page/post, simply enter their shortcode with the YouTube url of the video you want to play and its width. The plugin will do the rest. Update your page/post.

[youtube:http://www.youtube.com/watch?v=rrs7Z8FRQeQ 400]

3. YouTube Advanced by Embed Plus :

YouTube Advanced Embed is a plugin that enhances the YouTube videos you embed in your WordPress site. It’s a feature-rich and smart upgrade to the standard YouTube embed.By just pasting a YouTube link, you’ll not only get the features of YouTube’s standard embed, but also extra playback options, relevant user-generated content, video reactions beyond YouTube.com comments (e.g., Google+, Reddit, and Twitter). 

Following are the step-wise guidelines to demonstrate its usage :

Step 1 : On your WordPress dashboard, go to Plugins section. Click on Add New menu. Search for Youtube Advanced by Embed Plus. Install & Activate the plugin.

Step 2 : Now on the Edit panel of your page/post, simply enter the url of the YouTube Video on a separate line as shown in the figure below, & the plugin will do the rest.

Selection_017

Step 3 : If you want to add controls to the video, then you can customize those by clicking on the EmbedPlus Shortcode Wizard Button. A window will appear that will ask you for the Youtube video’s url that you want to display in your page/post. After entering the url,click on Next button.

Selection_016

Step 4 : In this window you will customize the controls you want in the video. Once you are done with it, click on Get Code button.

Selection_013

Step 5 : You will see the code generated for your settings. Click on the Insert button & this code will be inserted in your post/page’s Edit panel. Finally Update your page/post.

Selection_014

I hope you find this tutorial helpful. If you have any query or suggestions to achieve the same result as above plugins does, do share with us.

Leave a Reply

Your email address will not be published. Required fields are marked *