New Facebook Like button for blogger

Facebook has now released an improved version of its like Button. The new Facebook like button looks like  the horizontal version of the Official Tweet Button. The Facebook Like button will show the no of likes just like the tweet button does.The like button has some changes from the older version in the way the user is allowed to like andunlike.

A Screen Shot of the New Like Button

Integrating the New  Like Button into your Blog

1. Blogger – Login to  your Blogger Dashboard, Navigate to the Edit HTML tab under Design and follow the instructions at this page (It also has instructions to upgrade your old like button to the new one)

Facebook Like Box For Blogger

Facebook Like Button allows you to provide more Sharing Options to your Readers. Your readers can share your posts on Facebook using the Like Button. Have you added the Like button and still not getting any “Likes”? :(. Ok then we will present the Like button in a much better and elegant way.

Here is a Screenshot of the Facebook Like Box. Isn’t it lovely and more “Likable” than the default Like Button?

The  Facebook Like box also includes a link to  your Facebook Fan Page. This FB Like Box was Designed Styled and coded by Mia of Dezign Matterz .  Thanks to her for designing and styling  this awesome Like Box.

Facebook Like/Fan Box For Blogger

This tutorial is for everyone who has already created a Facebook Fan Page. If have not created one, try making one. A Fan Box or Like Box allows your Blog visitors to like your Facebook fan page, without leaving your blog. It can also display faces of the “likers” on your blog. To add the fan box to blogger, follow these steps:

1. Find out your Facebook Fan Page URL. To do that, just visit your Facebook Fan Page, and copy the url in the address bar.

Facebook send button for Blogger

Color Scheme	LightDark
Font	arial lucida grandesegoe ui tahoma trebuchet ms verdana
Float	None LeftRight
Location of the Button	Below the Post Content Above the Post Content
Display	On Post pages only EverywhereEverywhere other than Static Pages

Demo

1. Login to your Blogger Dashboard, and navigate to Design > Edit HTML.

2. Click on the checkbox  which says “Expand Widget Templates”

3.  Look for <data:post.body/> and immediately below that paste the following code.

<div>
<b:if cond='data:post.isFirstPost'> 
<script>(function(d){
  var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
  js = d.createElement('script'); js.id = id; js.async = true;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
  d.getElementsByTagName('head')[0].appendChild(js);
}(document));</script>
</b:if> 
<fb:send expr:href="data:post.canonicalUrl" font="arial" colorscheme="light"></fb:send>
</div>

Facebook Comments For Blogger

Facebook Comments can bring better interactivity into your Blog. These comments will work like a Facebook Wall.This tutorial will help you to easily setup Facebook Commenting on your Blogger Blog.

Features:

1. Threaded Comments
2. Comment Permalinks
3. Likability
4. Can Subscribe or unsubscribe to comments
5. Can Moderate Comments at one place

Fix: Wrong Description and Image on sharing posts to Facebook

When you share a post on Facebook, it will display a thumbnail picked from the post page along with a short description of the post. But in many cases Facebook fails to  identify the correct image and description that it should use. This leads to irrelevant images and description coming up in Facebook when you or your readers share the post. This is totally annoying, and I had got many queries regarding this on my Facebook page and via email. So for those who are trying to figure a way out of this, here is the solution.

 

Which image and Description does Facebook pick from your Post Page

Facebook regularly scrapes your page and caches the data to your servers. They look for meta data information(Opengraph tags and others) in your post page. The meta data can explicitly specify the image and the description to use when the page is shared.If Facebook doesn’t find any meta data, then their Algorithms will fetch some description and image from your Page. Facebook shows a wrong description or image when their Algorithms are not able to fetch the correct image and description from your Post Page.
We will solve both of these issues using two different techniques.