Search This Blog

Saturday, June 2, 2012

Add Facebook Box Count Like Button To Blogger!





This might be a little bit late since Facebook box_count like button had been around for a while now, but let us look into it. Many people say that Facebook Share buttonmay go down because of this, moreover now we can comment directly from Facebook like button. But i believe both of them have a specific uniqueness on their own. Here, we will be learning on how to add it in the Blogger.


Step 1 : In your Blogger dashboard Click 'Layout' -->'Edit Html' -->'Expand Widget Templates'. Don't forget to backup your template by download it first. Find <data:post.body/>  and paste the code below right after it.








<!-- facebook like this -->

<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=box_count&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:50px; height:65px;'/>
</b:if>

<!-- /facebook like this -->



If you want to place it inside the post and floating at the right side, find <div class='post-header-line-1'/> and paste the following code after it.

If you want the button appear in home page, remove "<b:if cond='data:blog.pageType == &quot;item&quot;'>" and "</b:if>" codes!

<!-- facebook like this -->

<div style='float:right; margin-left:5px;'>
<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=box_count&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:50px; height:65px;'/>
</b:if>
</div>

<!-- /facebook like this -->





If you want the button appear in home page, remove "<b:if cond='data:blog.pageType == &quot;item&quot;'>" and "</b:if>" codes!



Sharing is simple! Make sure, drop some comment here! Thanks me if you had benefit from this post! If you have anything in mind, feel free to drop some comment here.. Just ask me if you have any problem with those codes.. Happy Blogging Guys! Follow me for the latest post and hacks!


Add To Google BookmarksStumble ThisFav This With TechnoratiAdd To Del.icio.usDigg ThisAdd To RedditTwit ThisAdd To FacebookAdd To Yahoo

0 comments:

Post a Comment