How to Show Facebook Fan / Like Box on Blogger (Step Wise Tutorial)

By -
Social media as we have already said can work as most effective traffic driver for your blog. When we talk about social media, the first thing that comes to our mind is facebook, the most preferred social networking site. Creating a fan page let's your page followers to know about the latest updates in their notifications section. This box also displays faces of the "likers" on your blog.  The first and foremost thing to have fan/like box on your blog is that you should already possess a Facebook fan page. If you haven't yet created, Create a Facebook Fan Page.

How to Create a Facebook Like Box

  1. Visit your facebook page and copy the URL from address bar at the top of your browser. See the screenshot below, to know how exactly the URL looks like.

    Note: URL may also contain some numbers
  2. Then visit the page: https://developers.facebook.com/docs/plugins/page-plugin
  3. Paste the copied URL in step1, in "Facebook Page URL" field as shown in the screenshot. Fill in other details as required to adjust the looks of your fan box (A preview will be shown to you when you will enter the details). In the "Tabs" field, you can fill one of these: timeline (filled in by default), events and messages. 

    Cnfiguring Looks of Facebook Like Box
    • Timeline tab will allow you to show the most recent posts of your Facebook Page timeline. We suggest you to use this tab.
    • Events tab will allow people to follow your page events and subscribe to events from the plugin. We suggest to use events tab.
    • Messages tab will allow people to message to your Facebook page directly from your blog (User need to be logged in to fb to use this feature).
  4. When you are satisfied with the looks of your fan box, Click on the blue button saying "Get Code".
  5. You will get two codes: XFBML and IFRAME. The one you will need is iFrame. Select and copy the code generated.

    Copy the Selected Code as Shown in this Screenshot
  6. Now login to your Blogger account, go to Layout  and  Click on "Add a Gadget" link in blue. 

    Layout Page of Blogger Looks like this
  7. In the Pop-up window find and select "HTML/JavaScript" gadget. 

    This image shows how to write HTML/JavaScript to create a gadget in Blogger.
    Click on "+" Symbol Adjacent to HTML/JavaScript
  8. Enter the title of the new gadget , as you want. It can be "Facebook Followers". And Paste the code copied in step5 in the empty HTML box on your screen. 

    Configuring HTML/JavaScript
  9. Click on button saying "Save". The dialog box will disappear.
  10. Now you will be back on your Blogger Layout page. Click on the button saying "Save Arrangement" at the top right corner. 

    Click on "Save arrangement" Button on Layout Page of Blogger
  11. You are now done with the process. Visit your blog. Enjoy!

Stay tuned to our Blogging tips section for more info. Thanks for reading. Our first priority is reader's satisfaction. 

Comments

Post a Comment

Popular posts from this blog

Remove All hatom and BlogPosting Structured Data Errors from Blogger Blog

By -
Are you experiencing hatom structured data errors in Google Search Console ? Most of the bloggers are facing these problems. These errors does not have any impact on blog's performance but these errors should not exist more in your blog to make a healthy site. Structured data is used to display the site in a better manner on major search engines result pages. You can check the errors on your blog using Google webmasters tool called Structured Data Testing Tool .   This post will be covering procedures to fix all the structured data errors in blogger, such as: missing: author missing: updated missing: entry-title The property image_url is not recognised  The property blogId is not recognised The property postId is not recognised A value for the headline field is required A value for the image field is required The DateModified field is recommended. Please provide the value if available. The MainEntityOfPage field is recommended.  Please provide the value i
Read more

Favourite Facts That Are False

By -
Image
Napoléon Was Short - It is believed that he was a short person (short as dwarf). But ask yourself "Is a person 5' 6'' tall is really a short person?". He was slightly above average height for a frenchman of that time. Bulls Hate Red -   Bulls are color-blind. They actually perceive the motions of the bullfighter's cloth as a threat. Don't Eat And Swim - Few people believes that swimming after having meal increases the risk of cramps. It is not true. But full stomach make us short of breathe. Salty Water Boils Quicker - Adding little salt to water while boiling it, makes no difference. It can actually take longer time to boil. Shaving Thickens Hairs -  Hairs which re-grow after shaving are not thicker, coarser or darker. It just appears so because they grow up with a blunt tip.
Read more

Plus Transfer: Send Digital Files Secretly

By -
Image
Here is just another site about which you should know about and must exist in your Bookmarks list. Whenever you need to send huge files to some particular person(s) and don't want the file to exist on Internet after the recipient receives it, this website will help you. With the help of this site, you can send files secretly to anyone who owns an e-mail id. It's very simple. Procedure to send files through Plus Transfer Features of the Site Site is easy-to-use . Very simple though effective interface. Plus Transfer lets you send files up to 5 GB in size to anyone, anywhere. File to be sent can be in any extension i.e., .mkv, .mov, .dmg, .exe, .pdf, and all other  file extensions.  Simply upload your files, add your e-mail address, type a small note describing the files, and then type the e-mail address of the person for whom the files are intended. All the data uploaded from your PC is stored on the website's cloud-based servers for about one wee
Read more