Friday 5 July 2013

How To Add A Facebook Like Button To Layout/Sidebar In Blogger ?

Facebook like button
In our previous tutorial we have discussed about how to add a Facebook Like Button below your posts header and after the post but today i am going to show you some easy steps to add this Facebook Like Button to your layout section i.e. in sidebar or you can say that as "Add A Gadget".

Facebook like button always helps us to increase the traffic of our blog and also we can use it as a system which judges our blog post that is, people are liking our posts or not. The main advantage of Facebook like button is that it is small and hence it does not takes much space of your blog/website like other big widgets. So, if you don't want to place any big social widget that can acquire your precious space then simply use smaller widgets that are as effective as the big widgets and one of such widget is Facebook like button.

Placing Facebook like button in layout section that is in sidebar or footer section will save your space that you can use for advertising purpose. But even if you don't want to loose any space then you can use other widgets like Facebook pop like box widget, scrolling Facebook like box widget etc which don't acquire any space of your blog/website. Both of these widgets doesn't consume any space and they are as effective as any other widget that you place in your sidebar or footer section to increase your social presence. The above two widgets are optional, now back on topic, adding Facebook like button to layout is very easy it just takes few minutes.

Below are the steps describing how to add Facebook like button to layout/sidebar in blogger:

  • Step 1: Go to Facebook Developers page.
  • Step 2: Now, paste your fan page URL as described below and do other customizations as per your requirement.
To Enlarge the images please click on them.
  • Step 3: Then click on "GET CODE" tab and a window will pop up with following four options:
  • Step 4: HTML5, XFBML, IFRAME, URL.
Facebook like button IFRAME code.
  • Step 5: Select "IFRAME"  and copy the entire code.
To Enlarge the images please click on them.



Note : This IFRAME code doesn't work for Facebook Send button. hence select only Facebook like button during customization. 
  • Step 6: Now, log in to your Blogger Account.
  • Step 7: Go to Dashboard >> Layout >> Add a Gadget.

  • Step 8: Now, select "HTML/JAVASCRIPT" and then paste the copied code in it and click on "Save" button and you are done. 
Tutorial Last Updated on October 2014.

Also read:

4 comments: