Add Facebook Like Button to Individual Posts In Blogger

Add Facebook like Button Social Plugin to Blogspot Blog

How To Get Like Button To Blogger

CSS code to copy

/*—Name:Ship Me This Url: https://www.shipmethis.com/2017/04/all-social-plugins-blogger.html — */ .shipmethis {font-size: 12px;}

Where to Paste the Copied Code

Paste the below CSS before skin code  ]]></b:skin>
You can use CTRL+F to find the code.

HTML code to copy

The like button code is shown below;

<b:if cond=’data:blog.pageType == &quot;item&quot;’><iframe allowTransparency=’true’ expr:src=’&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;’ frameborder=’0′ scrolling=’no’ style=’border:none; overflow:hidden; width:450px; height:40px;’/><div class=”shipmethis”><a href=”https://www.shipmethis.com/2017/04/all-social-plugins-blogger.html”>Get Widget</a></div></b:if>

This code uses iframe so that it may mildly slow down the speed of website. Copy the HTML code

You can also use HTML code without iFrame as below;

<b:if cond=’data:blog.pageType == &quot;item&quot;’><div class=”fb-like” expr:href=’data:post.url’ expr:title=’data:post.title’ expr:xid=’data:post.id’ data-layout=”standard” data-action=”like” data-size=”small” data-show-faces=”true” data-share=”true”></div><div class=”shipmethis”><a href=”https://www.shipmethis.com/2017/04/all-social-plugins-blogger.html”>Get Widget</a></div></b:if>

Where to Paste the Copied Code

Go to blogger template find the below Code by ctrl+F,

<div class=’post-body entry-content’>

Or

 <div class=’post-header1′>

Paste the like button code Before it. Just save the template. Now the button will appear in every post. 

If you are unable to find the <div class=’post-header-line-1’/> code, then find the below code.

<data:post.body/>

Paste the HTML code before that.

Hope this post helps. Please Subscribe to the Ship Me This.