How to Embed YouTube Video on Blogger use this HTML Code

How to Embed YouTube Video on Blogger. Best Way to Add YouTube Video in Blogger. Setting up your web page or blog site is easy, but gathering visitors, attracting visitors and keeping them coming back to your website is very difficult. Therefore, you need to make your website look beautiful, interactive and anything that doesn't bore your visitors. You need to get them interested in all the themes on your website: designs, animations, color; featured images; And of course, its content. YouTube will host your videos and you can easily embed them into your website. The following HTML code shows how to embedded youtube video on your webpage.

One of the popular plugins on a website is YouTube because it plays videos. Unlike other websites with just plain text, YouTube videos are more effective for your audience as it provides more interaction. First, visitors stay on your website longer than usual and it provides more value. Second, it may interest your visitors to visit your site again and again. Your visitors will share and promote your website thus getting more visitors. This is done only by video embed code generator to add YouTube videos to your website.

Benefits To use This Method

• Responsive YouTube Videos Size in Any Device.
• Show Only Your Related Videos when User Pause the video.
• Show Only Your Videos at the End of the video.

Steps to Add / Embed YouTube Videos in Your Blogger Blog Post

• First Copy the CSS Code Which We Provide in this post.
• Head Over to Blogger Dashboard.
• Select your blog.
• click on Layout
• click on Theme Designer
• Click on Advanced
• Now select "ADD CSS" from the drop down menu
• Now Paste the CSS Code
• Copy the Embed code which we provide in this post.
• Go Back to Blogger Dashboard.
• Open the post where you want to ADD or EMBED YouTube Video.
• Now Simply Remove VID-ID (from Embed code) and add Your Video ID.
• Publish or Update Your Post
• Done, Now You can see Responsive YouTube Video on the Post.

Note

• You Need to Add CSS Code only one time in Your Blogger Theme
• You Need Use iframe Embed code whenever you want to add YouTube Video on the post.

1. Copy This CSS code and Paste it in Your Blogger Theme File

<!--Youtube Embed Code Start--><br /><br />.ytiframe{<br /> position: relative;<br /> width: 100%;<br /> padding-bottom: 56.25%; <br /> height: 0;<br />}<br /><br />.ytiframe iframe{<br /> position: absolute;<br /> top:0;<br /> left: 0;<br /> width: 100%;<br /> height: 100%;<br />}<br /><br /><!--Youtube Embed Code End-->

2. Copy This Embed Code and Paste it in HTML of Your Blog Post

 

<div class="ytiframe"><iframe allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" frameborder="0" height="auto" src="https://www.youtube-nocookie.com/embed/VID-ID?rel=0" title="YouTube video player" width="100%"></iframe></div>

3. Copy This Embed Code and add in blog post for Autoplay Video. If want no auto play change the code autoplay=1 to autoplay=0

<div class="ytiframe"><iframe allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" frameborder="0" height="auto" src="https://www.youtube-nocookie.com/embed/VID-ID?&autoplay=1&rel=0" title="YouTube video player" width="100%"></iframe></div>