How To Make Youtube Video Responsive In Blogger Post(2018) – Easy Step-By-Step Process embed youtube video and resize properly in blogger

Are you a Video Creator trying to embed your video on Blogger Post..? If so, then you are at the right place. Here you will lean step-by-step process to embed full Responsive Youtube video on blogger post. Check below how to make youtube video responsive and mobile friendly on blogger post.

Do you like to Embed your YouTube Video make your YouTube Video Responsive like this Responsive YouTube Video and like to embed youtube video and resize properly in blogger.

 

1. Follow all the Steps to make YouTube video embedding responsive in blogger post.
Select your video on YouTube that you would like to share, Click Share Button(then) -> Copy the embedded code.

2. Copy your Youtube Video Embed Code and keep that code on Note-Pad or anywhere, embedded youtube video code will be like

 <iframe width=”560″ height=”315″ src=”code here” frameborder=”0″ allow=”autoplay; encrypted-media” allowfullscreen></iframe> 

3. Now just copy the src code from your youtube embeded code which you kept in Note-Pad and paste that on Responsive Youtube Video embed code in your blogger post (HTML), your code will look like

<iframe allowfullscreen=”” frameborder=”0″ height=”270″ src=”code here” width=”480″></iframe>

4. Now its time to add some css codes in blogger HTML mode to make our YouTube Video Responsive. Goto Blogger->Theme->Edit HTML->(Now, press CTRL+F a search box will open paste ]]></:bskin> and hit enter. Now above ]]></:bskin> paste these codes

.resvideo {position: relative;max-width: 100%;margin: 20px auto;padding-bottom: 56%;padding-top: 30px;overflow: hidden;height: auto;}.resvideo iframe, .videoresp object, .videoresp embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

5.Click save your template and you are done. Now all videos of your blogger video were mobile responsiveComment down if you are benefited by this Tutorial, & let me know. If benefited share this post to help other.

Related Post

2 comments on “How To Make Youtube Video Responsive In Blogger Post(2018) – Easy Step-By-Step Process embed youtube video and resize properly in blogger

Leave a Reply

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