Friday, 25 May 2012

How to add facebook like button to each individual blog post


This is a tutorial to teach you guys out there how to add a facebook like button to each of your individual blogpost and not for the entire blog. Im doing this because I have had the worst time trying to do this and it has taken a superb amount of time and effort googling and reading. So far, no website ive visited actually worked, most probably due to the new blogger interface. I accidentally came up with this and now I'm sharing it with you guys.

Firstly, go to the main menu and choose the template tab. After that click on the edit html button.








A window will pop out. click Proceed. After that,tick on the "Expand Widget Templates".








Press " Ctrl F" and a search box will appear.






In the search box, type <data:post.body/>

If you want your like button to appear below you post, paste the code below <data:post.body/>
If you want your like button to appear above you post, paste the code above <data:post.body/>

The Code
----------------------------------------------------------------------------------------------------------
<div class='facebooklike'>
&lt;iframe src=&quot;//www.facebook.com/plugins/like.php?href=<data:post.url/>&quot;layout=standard&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font&amp;height=80&quot; scrolling=&quot;no&quot; frameborder=&quot;0&quot; style=&quot;border:none; overflow:hidden; width:450px; height:80px;&quot; allowTransparency=&quot;true&quot;&gt;&lt;/iframe&gt;
</div>
-----------------------------------------------------------------------------------------------------------
Its that simple. Then your button would look like this. The standard type.




I prefer this look alot better than the others. If you wan to try other styles, you may experiment with the codes. Just be sure that you've saved the original template on your computer before proceeding with the experiments. Hope this helped you guys. Good Luck. =)

Doughing off for now..... XOXO, Sunny Dough. =)

Comments