Add Facebook Recommendations Bar To Blogger
Content is free. When you buy through links on my site, I may earn affiliate commission. Learn More.
Facebook has launched their "Recommendation Bar" in beta version, the Recommendation Bar is a plugin which shows a number of some recommended articles for your readers or visitors and you can set number of recommended articles, when any visitor visits to your any post, after some specific time the plugin pop-ups at the right/left corner of your blog with the recommended articles, that's how it helps you to keep busy your visitors on your blog.
How To Add Facebook Recommendations Bar To Blogger?
1. Creating a new Facebook App
2. Adding Facebook Recommendations Bar To Blogger
Part 1 : Creating new Facebook App
- First go to Facebook Apps and login with your Facebook account.
- Create your application using proper App name and App Namespace
- After creating you app go to edit app and see at the bottom Website with Facebook Login tab. enter your website link into box and click save changes.
- Now copy your App ID and paste it into notepad,we will need it later.
Part 2 : Adding Facebook Recommendations Bar To Blogger
1. Go to Blogger Dashboard > Template
2. Click on Edit HTML
3. Hit Proceed button
4. Now search for below code in your template
<html
replace it with below code,
<html xmlns:fb='https://ogp.me/ns/fb#'
Now find for below code,
<body>
just below of it paste following code,
<div id='fb-root'/>
<script>
//<![CDATA[
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=YOUR APP ID HERE";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
//]]>
</script>
<b:if cond='data:blog.pageType == "item"'><b:if cond='data:blog.pageType != "static_page"'><div style='z-index:999999; position:absolute;'>
<fb:recommendations-bar action='like' max_age='0' num_recommendations='3' read_time='10' side='right' site='https://www.cybertweaks/' trigger='40%'/></div>
</b:if></b:if>
Replace APP ID HERE with your APP ID which you have created in the first part
Replace https://www.cybertweaks with your blog URL.
Save your Template.
No comments: