Facebook’s Like Button Plugin: Share your pages with just one click

October 15th, 2011 | Facebook | 3 Comments »

Overview of the Like button Plugin

Like button is everywhere. From small to large web sites, it gives the Facebook user the ability to publish a content from a web site to a user’s wall as well as in a user’s friends’ newsfeed by just clicking a button. The content that was published has a link back to the  web site.

According to Facebook, the reason why they deprecated the old share button is that…

“The Like button improves clickthrough rates by allowing users to connect with one click, and by allowing them to see which of their friends have already connected”

Implementation of Like Button is available in HTML5, XFBML and Iframe. HTML5 and XFBML requires the Javascript SDK.

An example of Facebook Like button

 

Generating the Like Button Code

To generate Like button, go to Facebook developer website and find the header with Step 1 – Get Like Button Code. Under it are options that you need to fill up in order for Facebook to generate a code.

Below is the example of code generated:

<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_US/all.js#appId=161554643855159&xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<fb:like href="http://karlsheen.com/demo/facebook/fb_like.html" send="true" width="450" show_faces="true" font="arial"></fb:like>

 

Locales

Just replace the ‘en_US’ found in line 6 above with your choice.

Facebook locales are available at http://www.facebook.com/translations/FacebookLocales.xml. Just change the ‘en_US’ to whatever locale that you want.

'//connect.facebook.net/en_US/all.js';

It is found in line 6 of the code above.

The locales found in Facebook are in xml version. To see the parsed xml, visit http://karlsheen.com/demo/demoapp/languages.php.

 

How many Likes?
The total Likes will be found at the right side of the Like button. It explains that the page’s number of likes consist of the total number of the like, share, comment and inbox messaging of a URL.

 

Error
If the error below is encountered

We encounter the following error when sending your message. Requiring a public e-mail address. To send an e-mail address, first set-up your own <a href=”/messages/?setup” target=”_blank”>facebook.com e-mail address</a>”

It means that when sharing a page, it must be filled up with a Facebook registered user.

See the demo