How to Add Facebook Recommendation Bar on Blogger Blogspot Blogs

Facebook Recommendation Bar is a new and unique widget for your blog or site which suggests posts to your readers and give a chance to increase your blog readership and per day page/post views. This widget appears on each post automatically by using different explained parameters on bottom left or right side.

This Facebook Recommendation Bar shows posts according post share count and like. The Most liked posts are first suggestion to your readers. This recommendation bar shows post thumbnail, post link and post share, like count and quick like or recommend button.

The main benefit of this recommendation bar is it will help you to increase your blog readers and give a chance to your readers to quickly like your blog post.

Add Facebook Recommendation Bar on Blogger

1- Go to Facebook Apps Page –
2- Now click on ‘Create New App

Create New App

3- And select a valid App Name for e.g. your unique blog name and click on Continue button.

Set FB app name

4- Then fill the given verification Captcha Code and click on Submit button.

Verify Captcha

5- After clicking on Submit button click on Website with Facebook Login tab and fill your blog url [e.g.] in a given box.

Add App Domains

6- Finally click on Save Changes button and you’ll get App ID and App secret code.
7- On Newest Blogger – Dashboard › Blog Title › Template › Edit HTML › Edit template
8- Now look for <html code in your blog template
9- Now change <html with this code <html xmlns:fb=’’ . (Note: if you’ve already added this code then please ignore this step and go ahead)

Add open graph meta

10- Now search for <head> tag in your blog template and paste the following code just below it.

<meta content='article' property='og:type' />

11- After completing this step please look for </body> tag in this template and paste the following given code JUST ABOVE it. (Note: Do not forget to change App_ID and BLOG_URL shown in red color)

&lt;div id='fb-root'/&gt;
//Facebook Recommendation bar on all blogger country specific domains by
(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); = id;
  js.src = "//;appId=APP_ID";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div style='z-index:999999; position:absolute;'>
<fb:recommendations-bar action='like' max_age='0' num_recommendations='3' read_time='10' side='right' site='http://BLOG_URL' trigger='25%'/>

Example –

12- Now you should must aware about blogger blog opens on many country specific domains. So we will fix this thing because without this fix your recommendation bar will not work in different countries. Country specific root domain are as following please fill these as shown one of the above picture (Step 9).,,,,,,,,,,,,,,,

Other widget options are –

trigger: This trigger the recommendation bar when a reader scroll down your blog 25% [Default value: 25%]
num_recommendations: Set number of recommendation in recommendation bar [Default value: 3]
read_time: You can set when widget will appear automatically (Value in seconds) [Default value: 10]
side: You set left or right direction for your recommendation bar [Default value: right]

Regards! Enjoy this widget.

8 thoughts on “How to Add Facebook Recommendation Bar on Blogger Blogspot Blogs”

  1. Avatar photo
    My Say! India.

    This widget is nice but I think it won’t work for wordpress_com hosted sites .. will it ???

Leave a Comment

Your email address will not be published. Required fields are marked *