Aug 15, 2010

How to Add a Like Facebook Button in Blogger

Just like other newbies, i am also constantly finding ways to improve this little blog of mine.


So, i thought of putting something like the other blogs are using: the "Facebook Recommend Button".
Here's how to do it in Blogger:

1)  As usual, you need to login into your blogger account.  Click on the "Design" tab, then click "Edit HTML".

2) Look for the "Expand Widget Template" and be sure to tick the checkbox.

3) Highlight the following script and press Ctrl+C.  You are right!  You need to copy this script:

<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=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:450px; height:40px;'/>
</b:if>

4) Now look for <data:post.body/>. Fastest way to do this is to press Ctrl+F. Just type it in the search/find bar. Ding! Found it in a fraction of a second! If not, then you must have skipped step 2, haven't you?

5) Position the cursor exactly next to <data:post.body/> and press Ctrl+V. You are right again, we are trying to paste the above copied script to this specific location.

6) Click on the "Save Template" button.

There you go!
Check your blog pages. You should be able to see the results.

7) The above procedure will show the "Like Facebook Button" on post pages only. If you want it to be shown after all posts, then, just delete the part of the script in gold color.

Haha!
Easy, right?

Well, i hope this helps.
Happy blogging.

No comments:

Post a Comment

Let's be human and humane. Vulgarities and Spams will not be published. Thanks.

- Jack -