Friday 5 July 2013

How To Add A Facebook Like Button To Blogger ?

Facebook like button 
Hi Friends, Today in this tutorial i will teach you how to add a "Facebook Like Button" to your blog. Social networking site are always a great source of traffic and you can earn lots of visitors to your blog through these sites and this like button helps you to promote your blog on Facebook. You can place this Facebook like button anywhere in blog but people generally place it just below the header or after the post. In this tutorial i will explain you some easy steps to add this widget just below your header or just after the post or on both top and bottom of the post.

Also read: How to create a Facebook Badge for blog or website ?

Below are the steps describing the procedure to add the Facebook Like button to blogger:

  • Step 1: Go to the Facebook Developer page.    
  • Step 2: Add your Facebook fan page URL as described below and you can also customize the button as per your requirement as there are many customization options are available.
To enlarge the images please click on them.
  • Step 3: Now, click on the "GET CODE" tab.
  • Step 4: Then a window will pop up and you can see there are two codes available. 
  • Step 5: Copy these codes. 
To Enlarge the images please click on them.
  • Step 6: Now, Log in to your Blogger Account.
  • Step 7:Go to Dashboard >> Template >> Edit HTML.
  • Step 8:Then a window will pop up and first you have to search this code given below :
</body>
Note: you can search this code using CTRL + F , but in new blogger this CTRL+F feature is not working properly so you have to search it manually.
  • Step 10: Paste the Code 1 just above this closing body tag.
  • Step 11: Now, search this code given below :
<data:post.body/>
Note: this code appears three times in template's Edit HTML code , so you have to search for the second one.  
  • Step 12 :Now, paste the second code i.e. Code 2 just above or below( For placing the Facebook like button below header paste the Code 2 above <data:post.body/> this code and if you want the Facebook like button on bottom of your page then paste the Code 2 just after <data:post.body/> this code ) this above code.
To Enlarge the images please Click on them.
  • Step 13: Now, Click on "Save Template" tab and you are done. 
Demo

0 comments:

Post a Comment