Adding Facebook Like Button for Blogger

The Facebook Like button lets a user share your content with friends on Facebook. When the users clicks the Facebook Like button on your site, a story appears in the user’s friend’s News Feed with a link back to your blog or website.

Follow the below steps to add Facebook Like Button to Blogger

Step 1: Login to your blogger Dashboard.

Step 2: Go to Layout (Design) > Edit Html and check “Expand Widget Templates”

Step 3: Before editing any HTML code, take backup of your template.

Step 4: Find below line of code inside the box.

<data:post.body/>

For quick search press “Ctrl+F” and paste <data:post.body/> in the find box and then press enter.

Now paste the Facebook like button code just below that line:

Option 1: For Standard Facebook Like button for Blogger

b:if cond='data:blog.pageType != "static_page"'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/
plugins/like.php?href=&quot; + data:post.url + &quot;&amp;send=false&amp;
layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font
=arial&amp;colorscheme=light&amp;height=35&quot;' frameborder='0' scrolling='no'
style='border:none; overflow:hidden; width:450px; height:35px;'/>
</b:if>

Option 2: For Facebook Like button with Box for Blogger

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/
plugins/like.php?href=&quot; + data:post.url + &quot;&amp;send=false
&amp;layout=box_count&amp;show_faces=false&amp;width=55&amp;action=like
&amp;font=arial&amp;colorscheme=light&amp;height=65&quot;' frameborder='0'
scrolling='no' style='border:none; overflow:hidden; width:55px; height:65px;'/>
</b:if>

Option3: For Facebook Like Button with Button Count

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/
plugins/like.php?href=&quot; + data:post.url + &quot;&amp;send=false&amp;
layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;
font=arial&amp;colorscheme=light&amp;height=21&quot;' frameborder='0'
scrolling='no' style='border:none; overflow:hidden; width:90px; height:21px;'/>
</b:if>

Now save your template and refresh your page you will see the Facebook Like button appearing on your page.

If there is any a question or suggestions for Facebook Like Button then please use the comment box.

If you liked this post then please click on Facebook like and give Google Plus one to this post.

Related posts: