How I added a custom “Facebook Like” button to my blog
Adding a Facebook Like button to Blogger can be both easy and complicated, depending on who explains it. After a quick search on Google, I found how to add a custom Facebook Like button to my blog. Obviously, it’s not something difficult if I could do it in three minutes all together, but I thought I’d share the experience.
First thing, I had to go to my “Design” link on the blog. Then, to “Edit HTML”. Next, click on “Expand Widget Templates”. The edit box there is not so friendly, so I decided to select all the text, to copy it in the clipboard and to paste it in Notepad++. Looks a bit better, but still hard to understand even for a computer geek. So, in the “Language” menu, I selected under “H” the option “HTML”. Nice to finally see everything a bit color-coded.
Now, ‘Where to insert the “Facebook Like” button?’
Use the “Find” function (CTRL+F
) and type there:
<b:includable id='shareButtons' var='post'>
Scroll a bit down until you find the next line with </b:includable>
Immediately before that line, you insert:
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like expr:href='data:post.url' layout="button_count" show_faces="false" width="150" font="tahoma"></fb:like>
After it’s done, copy/paste the entire page back from Notepad++ to the “Edit HTML” web page on Blogger and click on “Save Template”. Every blogpost you have should display the little “Like” button next to the Sharing Buttons.