2 Ways To Embed YouTube Videos Responsively On Blogger Blogs

YouTube is a great platform for videos and most of all, every bloggers wants to embed videos on their blogs. Well this is not at all a difficult task to do, but how can we embed a YouTube video that is responsive with respect to blog? We all know that responsive blog is a must as Google ranking is based on it. So making embedded video responsive is also a must as it makes your blog user friendly otherwise visitor might leave your blog for not being user friendly one.

In this article we will deal with 2 ways of adding responsive YouTube embeds in Blogger blogs.

#1 The first way of doing is by simply adding jQuery plugin called FitVids.js to your Blogger blog. Which makes YouTube embedded videos responsive with respect to your blog. This jQuery plugin is lightweight, easy-to-use for fluid width video embeds also supports other video platforms such as Vimeo.

#2 The second way of doing is by adding CSS code to your Blogger blog. Simply add the CSS code before </head> section of your blog.

Now when you place the YouTube video embed code in your blog post. Simple wrap it in a div with class video-container like this.

<div class=”video-container”>
<iframe allowfullscreen=”” frameborder=”0″ height=”315″ src=”https://www.youtube.com/embed/Om6tnEP6vvU” width=”560″></iframe>
</div>

Embedded video now becomes responsive with respect to your blog.

wAAACwAAAAAAQABAEACAkQBADs= - 2 Ways To Embed YouTube Videos Responsively On Blogger Blogs

Hi everyone, this is Harihara Kumar the HinduGeek guy! You can follow me on Twitter – @hariharakumar