How to add facebook recommendation bar to right botton corner blogger heerentanna blog
Fb+recommendation+barInternal Links play a very important roll for any website. there are many ways to by which you can add internal links in your blog. One of the, is recommendation bar. Recently facebook launch feature of recommendation bar. It will show related recommended links of your blog on right bottom side.This post is all about how to add facebook recommendation bar to blogger blog.
For the purpose of adding facebook recommendation bar to your blog. you must need to create facebook application. If you already have facebook application than copy application id it will require letter.

Create Facebook Application

Step 1: Go to Facebook Application Page.
Step 2: Click on “Create New App”.
Step 3: One popup appear in which you required to Write “App Name” and click on “Continue” Button.


Step 4: Now fill up the details ( See following Screenshot )


Step 5: Save changes that set your FB App ID is Creaded. Now copy your App ID.(Find App Id : In above screenshot highlighted text is my application id, you need to copy your own id.)

Facebook Recommendation barĀ  for blogger.

Step 1: Login into your blogger account.
Step 2: backup your template. ( How to backup your blogger template? )
Step 3: Now select Template > Edit HTML > Proceed button.
Step 4: Find <head> tag by pressing Ctrl+F, and past following code below it.

<!-- Begin Open Graph metadata -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta content='article' property='og:type'/>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta expr:content='data:blog.pageName' property='og:title'/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta content='website' property='og:type'/>
<meta expr:content='&quot;en_US&quot;' property='og:locale'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<!-- End Open Graph metadata -->

Step 5: Now find <body> tag by pressing Ctrl+F and just below it past following code.

<div id=’fb-root’/>
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); = id;
js.src = “//“;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));
<b:if cond=’data:blog.pageType == &quot;item&quot;’>
<div style=’z-index:999999; position:absolute;’>
<fb:recommendations-bar action=’like‘ max_age=’0′ num_recommendations=’3
read_time=’15‘ side=’right‘ site=’Your_Blog_Url‘ trigger=’40%’/>

  • Replace highlighted “APP_ID” text with your own facebook application id which we created earlier.
  • Replace “Your_Blog_Url” text with your blog Address.

Customize your code:
Num_recommendation=‘3’: It’s indication the number of post that appear in your Facebook bar
read_time=’15’: It’s indication the time duration for appearing.
side=‘right’ : It’s indicating side where your recommendation bar will appear
action=‘like’ : You can use Like or Recommend

Step 6: Save Template. That set.

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.