How to add a facebook like box to your blog

Jul 30, 2012, by admin

facebook-like-button

The “like box” (also known as the “like button”) was developed by Facebook as a way to gather feedback and measure popularity of different pages within a website. The like box icon can be added to the landing page as well as within separate posts depending on whether you want to enlarge the marketing reach of the blog as a whole by displaying how many people have liked it or focus on specific blog posts. For example, you can add a like box so people who like a certain blog post can let you know by clicking on the icon that says “Like” underneath that particular post. The method used for adding like boxes varies depending on which blogging service you use.

facebook-like-box

Steps to add a facebook like box to your blog

Adding a Like Box in Blogger

1.Copy the button code required to add the Blogger like box. You need to copy this complete code.

<b:if cond=’data:blog.pageType == “item”‘>

<iframe allowTransparency=’true’ expr:src='”http://www.facebook.com/plugins/like.php?href=” + data:post.url + “&layout=standard&show_faces=false&width=100&action=like&font=arial&colorscheme=light”‘ frameborder=’0′ scrolling=’no’ style=’border:none; overflow:hidden; width:450px; height:40px;’/>

</b:if>

2.Go to the Blogger homepage and log into your account. You will be taken to the Dashboard page.

3.Click on “Design” under the name of the blog that you want to add the button to.

4.Change the tab selection to “Edit HTML.”

5.Check the box that says “Expand Widget Templates.”

6.Find the line that says and paste the button code after it. Leave a gap of line before and after the button code.

7.Save your HTML edits and view your blog. You should see the Blogger like box appear just under the blog header.

How to add a facebook like box to your wordpress blog

1.Use the following button code for adding like boxes in WordPress.

<iframe src=”http://www.facebook.com/plugins/like.php?href=<?php echo urlencode(get_permalink($post->ID)); ?>&layout=standard&show_faces=false&width=450&action=like&colorscheme=light” scrolling=”no” frameborder=”0″ allowTransparency=”true” style=”border:none; overflow:hidden; width:450px; height:60px;”>

</iframe>

2.Open the single.php file in your WordPress themes folder.

3.Paste the button code inside the post loop (the area used by WordPress to display each of your posts).

4.View your blog after you have saved the changes. The like button will appear with every post within your blog.