Thursday, March 3, 2011

How To Add Facebook Like Button To Blogger



 Hello ,


in this tutorial i'll show you how to add your custom facebook like button !




Step 1 : Goto : Design > Edit HTML > and Check " Expand Widget Templates " Box .



Step 2 : Find this code 

<div class='post-footer-line post-footer-line-1'/>
Just after it put your custom code .



Now i will show you 3 custom codes for it 

A - Standard :
 Code for it : 
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div><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:400px; height:27px;'/></div>
</b:if>
- -
B - Button Count :
Code for it
<b:if cond='data:blog.pageType == &quot;item&quot;'><div><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_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:75px; height:27px;'/></div>
</b:if>
--
C - Box Count




Code for it :

<b:if cond='data:blog.pageType == &quot;item&quot;'><div><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:53px; height:65px;'/></div>
</b:if>

--



Step 3 : Chose any code from the 3 above and paste it after - Step 2 -  Code .

Now Save your work and Have Fun :)

===
watch how to make it ?

Twitter Delicious Facebook Digg Stumbleupon Favorites More