Facebook introduced their new awesome social plugin called “Facebook Recommendation Bar” which allows users to like content, get recommendations and share what they are reading with their friends. It is a great way to increase your site page views as this plugin will display
your most useful and popular articles on the bottom right corner of your site. This plugin also has a �Like/Recommendation button� which lets users share your posts with one click. This widget is more helpful to drive traffic from Facebook with instant likes. This is how the �FacebookRecommendation Bar� will look like on your site
Read Also :
v Add Facebook Like Button To Blogger Posts
v Add Facebook Like Button To Blogger Posts
How to add Facebook Recommendation Bar to Blogger?
Adding this widget to your site is really a piece of cake.
Just follow the steps bellow
1. First you need to create an app to get an id. So go to http://www.facebook.com/developers/createapp.php and pick a name that suits your website/blog for the Application Name.
3. Select the �Web Site� tab on the left and configure the app:
� Enter your Site URL in the format: http://MyTricksTime.com/ (make sure you include a trailing slash).
� Enter your Site Domain as: MyTricksTime.com (drop the http://, www., and the trailing slash.
� Hit the �Save Changes� button.
4. Now copy your App ID (located at the top). Eg: App ID: 4534xxxx34567
Keep your App ID on a side for future use.
Keep your App ID on a side for future use.
5. Now go to Blogger > Layout > Edit HTML and search the following code pressing Ctrl f key to make the search easy
<body>or
<body expr:class=�"loading" + data:blog.mobileClass�>
<body>or
<body expr:class=�"loading" + data:blog.mobileClass�>
6. Just below that code, we need to add the JavaScript SDK code which is this:
<div id=’fb-root’/>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'App_ID', status: true, cookie: true, xfbml: true, oauth: true}); };
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
<script>
window.fbAsyncInit = function() {
FB.init({appId: 'App_ID', status: true, cookie: true, xfbml: true, oauth: true}); };
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
Now replace the *APP_ID* of the above code with the ID of the App you created in the first steps of this tutorial.
Before to save changes, we need to add a special META tag in the head section to make it work in Blogger. So look for the code <head> and just below that, paste the meta code:
<meta property=”og:type” content=”article”/>
7. Now you can save the changes of your template.
8. To finish, we need to place the plugin code wherever you want it to appear on your page. Search for </body> tag and just above it, paste any of the following (just one):
<fb:recommendations-bar action=’recommend’ />
<fb:recommendations-bar action=’like’ />
<fb:recommendations-bar action=’like’ />
If you choose the first line, it will display the �Recommend button�, but if you choose the second one, then it will display the �Like button�.
And that�s all. If you followed all the steps above, you will have the widget installed on your site successfully.
*Important:*
By default the plugin will appear on the bottom right corner of your page, if you want it on the left, then use any of the following codes instead of the previous one:
By default the plugin will appear on the bottom right corner of your page, if you want it on the left, then use any of the following codes instead of the previous one:
<fb:recommendations-bar action=’recommend’ side=”left”/>
<fb:recommendations-bar action=’like’ side=”left”/>
<fb:recommendations-bar action=’like’ side=”left”/>
You can customise more options on the Facebook Social Plugin
Page: https://developers.facebook.com/docs/reference/plugins/recommendationsbar/
Enjoy Guys! and don’t forget to post your comments. � MyTricksTime.com
