How to add this recommendation widget in blogger:
It is easy to get this app from Facebook developers page. Follow the below steps1) Login to your Facebook account and Go to Facebook developers Page. to make this recommendation app for your website/Blog.
2) Create a new app from the top left hand link.
Edit this app like below....
and click continue...
Enter Captcha and click continue to your app. Now your app has been created.
Now edit your app like setting below...
Copy you app id to note pad to add this plugin in blogger.
How to add it in Blogger
Login to your Blogger dashboard.Template >> backup your template >> Edit HTML
Search the code <html
And replace it with below code.
<html xmlns:fb='http://ogp.me/ns/fb#'We made the above change to make recommendation bar compatible with older versions of browsers.
Now search for <body/>
and paste the below code before/above closing <body/>
<div id='fb-root'/>
<script>
//Facebook Recommendation bar
//<![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=***************";
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='5' side='right' site='http://www.bloggingbee.com' trigger='30%'/></div>
</b:if></b:if>
Customization:
Just replace *************** with your 15 digit App Id that you saved in step1.
and replace http://www.bloggingbee.com with your domain name.
Save your template and you are done!
Enjoy!
0 comments:
Post a Comment