After you’ve created a Facebook Page for your blog, the next thing you’ll need to do is add a Facebook Like Box to your blog. The Like Box helps you attract and gain Likes (fans) from your own blog. The Like Box also allows your readers to see their friends and other readers who already like your Facebook Page.
Adding a Like Box to your blog is pretty simple:
1. Go to the Facebook Like Box plugin page.
2. Configure your Like Box.
– Enter your Facebook Page URL
(ex. http://www.facebook.com/pages/The.Mad.Tomato/442143805693).
– Width: You can use the default width (292 pixels) or replace it by the width of your blog’s sidebar.
– Select color scheme.
– Check or uncheck boxes for ‘Show Faces’, ‘Stream’, and ‘Header’.
3. Click Get Code (a dialog box will pop up) and copy the plugin code under IFRAME. (You can also use the HTML5 code)
4. FOR BLOGGER: Go to your Blogger Dashboard > Design > Page Elements > Add a Gadget > HTML/Javascipt
FOR WORDPRESS: Go to your Dashboard > Appearance > Widgets > then add a Text widget
5. Then paste the plugin code into the new HTML/javascript gadget (Text widget for WordPress). Click Save.
Have fun!
How to Add Facebook Like Button to Blogger.
Any chance you can tell me what I am doing wrong? I followed these exact directions but the only thing that shows up is a pic from my personal FB acct next to “switch back to” my real name.
Thanks!
Any URL we could look into?
Make sure you add your facebook page url (not your facebook profile).
Nice.. HTML/javascript is must…
Very Informative and please tell me how add a tool to search for data given file that is embedded in the blog
just copy no. 3 on xfbml tab, right… or i must copy from no.1 to no.3? i’m still confuse.. tq
XFBML
1.
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = “//connect.facebook.net/en_US/all.js#xfbml=1”;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));
2.
3.
Sorry, the post wasn’t updated. Just use the IFRAME plugin code.
You can also use the HTML5 code: just copy and paste both the JavaScript SDK code and the plugin code into the gadget/widget element of your blog.