How to Embed HD YouTube Video in WordPress

Now that DragonBlogger.com has a very large post width area I was embedding larger YouTube video sizes into the WordPress posts but found that the embedded YouTube videos were too low resolution and required the viewer to manually click on the gear icon and switch the resolution to 720p or 1080p to get the best experience from the video.

Video Tutorial on how to Embed HD YouTube Video in WordPress

When you use WordPress to default to embedding videos it won’t be able to use HD mode and defaults to 360p but this is only really ideal if you have a smaller 500px or less post width area, if you have a larger post width area you may want to embed higher resolution video’s.

Assuming that you don’t want to use a WordPress plugin which makes use of shortcode to translate the URL and may become archaic someday and require you to update all your shortcode, I am going to show you how to embed HD video in WordPress using native YouTube embed code that you grab from YouTube for a video.  This does mean that you won’t be able to just cut/paste the YouTube URL link into your WordPress blog post anymore and you will have to set the video embed size manually.

• The first step is to go to YouTube and find the video that you want to embed.
• Click on the Share Button
• Then click on Embed

• Then click on Custom Size
• Enter your post width (first box) and the height will automatically change to keep it in context.

Now, cut and paste this embed code in your Text editor mode in WordPress (The text tab)

Then you have to manually make a sligth change to the src URL by adding the following after the video link.

?rel=0&vq=hd1080

 

Adding the above tag will default the video to 1080p resolution, but may not work properly if the video itself wasn’t supporting 1080p and will just default to low resolution probably.  So check the video to see if 720p or 1080p is option and add parameter to the URL accordingly.

?rel=0&vq=hd720

 

For 720p default video resolution use the above string and append it to your src=”youtube video url”.

Normal iframe code of this:

<iframe width="830" height="467" src="https://www.youtube.com/embed/ABd9B-i2Hhg" frameborder="0" allowfullscreen></iframe>

Now would become this:

<iframe width="830" height="467" src="https://www.youtube.com/embed/ABd9B-i2Hhg?rel=0&vq=hd1080" frameborder="0" allowfullscreen></iframe>

This is a manual but effective way to embed HD YouTube video into your WordPress blog posts without having to worry about a plugin becoming unsupported.  Hopefully at some WordPress future version there will be an option to default the URL translation to using HD quality videos but until then, this is a good trick.