Click Below Ad for Leaning Blogging Tricks.
Note :- This widget also work on Website if your website domain is .com ,.net, .org,etc. it also work on this websites. To add this widget on your blog follow this simple steps.
Also read:-Add Facebook Sliding Like box for Blogger/Blogspot
How to Add Facebook Recommend Bar widget for Blogger:-
- Go to Blogger Dashboard>>Template
- Click on Edit HTML Button
- Press (Ctrl+F) and find this code
xmlns:expr='http://www.google.com/2005/gml/expr'
- just Above code insert xmlns:og='http://ogp.me/ns#' {Don't forget to give space between both codes
- this code look like this image
xmlns:expr='http://www.google.com/2005/gml/expr'
xmlns:og='http://ogp.me/ns#'>
- Then find this tag in your template </head>
- Paste the following code before </head>
<b:if cond='data:blog.pageType == "item"'>
<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'/>
</b:if>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta content='website' property='og:type'/>
</b:if>
<meta expr:content='"en_US"' property='og:locale'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
- You are Successful to add meta tag in your blog but after this follow this steps carefully because this a main part of this widget.
- Again find this tag <body> in your template.
- Paste the following code before/above <body>
<div id="fb-root"></div>
<script>(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_GB/sdk.js#xfbml=1&appId=YOUR-FACEBOOK-APP-ID&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
- Replace YOUR-FACEBOOK-APP-ID with tour facebook app ID
- Now find this code <data:post.body/> in your template
- Paste the following code after this <data:post.body/>
<div class="fb-recommendations-bar" data-site="softwayrko.blogspot.com" data-read-time="20" data-side="right" data-action="like" num_recommendations="2"></div>
- Replace the softwayrko.blogspot.com with your blog URL
- Replace 20 this represent the number of seconds before the widget shown recommend posts
- Replace right with your desired position in your blog
- Replace 2 with the number of recommend posts you want to display
- Finished!
0 blogger-facebook: