March 28, 2011

How To Add Facebook Like Button To Your Blog

I'm sure you've noticed the facebook like button above and below all posts on this blog. It makes it very much easier for readers to share your blog posts on facebook with their friends with the single click of a button. It's more like sharing and might fetch one or two more readers to your blog. To add this to your blog, follow this easy guide:
1. Login to your blogger account and click on "Design"

2. Click on "Edit HTML"

3. Check the box labelled "Expand Widget Template"

4. Like I always say, back up your template before making changes in case something goes wrong

5. Press CTRL + F and search for <data:post.body/>
If you're using a magazine style template or used the automatic read more hack I posted, you might find two pr more <data:post.body/> in your template. You should try both to know which one works. The second works on my template though.

6. If you want the facebook like button to appear on top of your blog post, paste the code below above <data:post.body/>


<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> <br/>


7. If you prefer to see the like button below your blog posts, paste this code below <data:post.body>


<br/> <br/> <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> <br/>


8. You might as well put it in both positions. Save your template and view the change on your blog.




Stay Connected With Free Updates

Subscribe via Email

10 comments:

Unknown says:

Thanx 4 ur nice article, can u tell me how i can add facebook like button 2 my magazine template?
i havent
as u can c in my homepage, the button doesnt recognize the url of the individuals posts, I will appreciate ur help :)
http://www.7zero-fa.blogspot.com

Anonymous says:

you probably removed




from the code. that's the part that hides it from your homepage.

And you should have two or three in your template since it's magazine style. Try them one after the other to know which one works for your template

suyog7 says:

very usefullll blog!
thanks for adsense.
Now I want to know that how to get wap.yourdomain.com(subdomain for other sites) in wapka.

Unknown says:

IT doesn't work for me. i saw this error

Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The reference to entity "layout" must end with the ';' delimiter.

Anonymous says:
This comment has been removed by a blog administrator.
Yes says:

Hey am timothy from jos plateau state.i have to admit you are doing a job here,i realy want 2 be blogger but i wish one dax u could come to jos for semina.thanks.i want 2 have ur phone number.

Anonymous says:

@میر امامی and Emmanuel. There was actually a mistake in the code and it'd been duly fixed. it's now working perfectly.

Don Caprio says:

@Suyog. you'll need to create a CNAME for that instead of changing your nameservers.
@Yes. thanks for the compliment.

iso 9000 says:

Hey, very nice site. I came across this on Google, and I am stoked that I did. I will definately be coming back here more often. Wish I could add to the conversation and bring a bit more to the table, but am just taking in as much info as I can at the moment.

iso 9000

social media for churches says:

Thanks for sharing, very helpful to us on how to add facebook like button in our sites. I really appreciate your help.

Post a Comment

100% Uptime, Unlimited Space, Unlimited Bandwidth