Menu Close Menu

how to Add FACEBOOK Like/Fan Box Using JAVASCRIPT SDK

Facebook_fan_box_using_java_script Today we will learn how to add a face book like box by using javascript to Bloggers Blog. Social networking websites like Face book, Twitter and Google+ are providing the custom follow and like boxes which helps every blogger. Now social networks are one the most important part of blogging. Face book like box help you to extend your reach and connect to the audience by proving them a mean to join you on face book. It does not only help you to grow your community but traffic as well. If people like your content they will voluntary like your Face book page. Facebook like box allows your visitors to join you easily and they don't have to find you manually. Face book developers have made this thing very easy to integrate a Face book like box in to your Blog by adding a few lines of code in it. We have already covered in our previous article how you can add a Face book like/fan box to blogger blog using Iframe.. you can see live demo on sidebar of our blog.


Add It To Blogger


1. First you need to go Face book Developer Page & Create your fan box by using your page user name and page id. (Get your Face book page user name & id URL by Visiting your Face book fan page.)



2. Set other parameters such as width, height and stream. The Preview on the right will update itself as you enter the changes.

3. Click on get code (you will get code look like screenshot below)



4. Go To Blogger Dashboard>> Template>>Edit HTML

5. Press CTRL+F and Find the Following code. “</body>”

6. and paste 1st code before/above </body>

7. finally click on save and you are done first step.

8. Go to your blogger layout and click on add a gadget and choose HTML/JavaScript

9. Paste 2nd code in text area.

10 write your Desired name in title section( If you hide face book like box Header while you creating this. if you no hide while you creating like box so your don’t need write gadget title.)

11. Finally click on save take new look of your blog..


For Further Help See Video Tutorial. Enjoy!  Adding this widget is surely easy but still if you encountered any troubles just post your query below in comment box and I would love to reply back as soon as time allow thanks for reading our post. happy blogging..!!

"Be the first to express your thoughts" :

  1. This comment has been removed by a blog administrator.

    1. This comment has been removed by the author.

  2. This comment has been removed by a blog administrator.

  3. This comment has been removed by a blog administrator.

  4. This comment has been removed by a blog administrator.


Important - Make sure to click the "Subscribe By Email" link below the comment for to be notified of follow up comments and replies.If you use Name/URL don't use keywords as your name. We love to hear from you! Leave us a comment.
To ensure proper display, HTML/XML/JavaScript need to be Encode first using this Encoder Tool Then paste the Encoded code here.