Facebook Recommended Bar for Blogger

Thursday, October 30, 2014

Facebook Recommended Bar for Blogger

Posted by Unknown | 12:23 PM | Leave a Comment

Finally the plugin of Facebook Recommended Bar is on your blogger. In order to engage readers more and let your visitors spend more time on your website Facebook has finally launched the "Recommendations Bar" in beta version. It's designed to display additional recommended articles right after readers have finished reading an article or spent some time on your blog. Only those articles are displayed that are previously liked or shared on Facebook. The number of likes are displayed under each article along with page title and a thumbnail. It also contains a like button and previously contained an Add to Timeline button that has been removed now. Unlike Facebook Recommendations box which offered related stories but with lack of user friendly interface and engagement, Facebook bar will force readers to stay longer on your site leading to increased pageviews, page impressions and thus traffic. It's a smart alternative to Recommended Post Slides widgets that we previously published.

Install it to Blogger

It can be installed easily on both BlogSpot blogs and Wordpress but with a little patience. We have kept the installation extremely easy and ignored unnecessary steps like installation ofOpen Graph Meta Tags. We would install necessary codes to keep the structure clean and make the widget work just fine. The code we are sharing is optimized and will display your blog titles and featured images correctly and with a lot of control attributes.

Creating Facebook Appication

First of all you have to create a Facebook Application. Here are the instruction that how you can create your facebook application. Click here to create a Facebook App.

Adding Recommended to your Blogger

Follow these steps to add the recommended bar to your blogger.

Go to Blogger > Template

Click on Edit HTML

Now Search for

<html

and replace it with

<html xmlns:fb='http://ogp.me/ns/fb#'

Now Search for <body> tag. and paste the following code just below it.

<div id='fb-root'/>
<script>
//Facebook Recommendation bar by www.mybloggerworld.net
//<![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='10' side='right'site='http://www.mybloggerworld.net' trigger='40%'/></div>
</b:if></b:if>

Now replace http://www.mybloggerworld.net with your blog url
By default it will show on right side if you want to change its site replace right

Now save the template and now you will see it on your blog.

71% of Users Run Latest Version of Browsers

Netgear Wants to Connect New Televisions

Dubai Faces Environmental Issues After Growth

Questions Linger as Shrimp Season Opens

Finding New Ways to Fill the Tank

Red Sox Exercise $12.5 Million Option on Ortiz

Running Backs Shift, but Bond Holds Tight

New Report: Toxic Metals Tied to Prison Work

China Said to Resume Shipping Rare Minerals

Coal Industry Spending to Sway Next Congress

Japan’s Auto Parts Makers Try to Anticipate Shift to Electric Cars

Rescue May Redeem a Troubled Past for Chilean City

Rum Battle in Caribbean Leaves Tax Hangover

Thursday, October 30, 2014