jQuery Facebook Social Plugin

Add Facebook social buttons to your site with jQuery

How to add Facebook's social buttons and widgets with jQuery

By Gabriele Romanato

I've developed this jQuery plugin with the aim of helping people to easily add their favorite Facebook social buttons to their sites with jQuery. This plugin currently supports the 'Like' ,'Sharer', and 'Activity' buttons, but I think that in a not too distant future other buttons will be added.

This plugin works at best with jQuery 1.4 or higher, though it's fully backward-compatible. With the Facebook Social Plugin you need only few lines of code to embed your favorite Facebook buttons to your site without wasting time with searching the exact code snippet to copy and paste.

Syntax and Usage

      $(element).FacebookSocial(options);
      
      

This means that the social button will be attached to the selected element in the jQuery's chain.

Options

Option Value
url The URL of the web site or page that you're going to use. Defaults to the current page.
klass The CSS class to be attached to the button. Defaults to fb-social.
wrapper The HTML element wrapper used to contain your button. Defaults to <div id="fb-social-wrapper"/>.
type The type of button you want to insert. Options available are like, sharer and activity. Defaults to sharer.
text The textual content of the link used with the sharer button. Defaults to Facebook.
header Tells Facebook if an header must be included in your Activity button. Defaults to false.
colorscheme Tells Facebook what color scheme must be used in your Activity button. Defaults to light.
recommendations Tells Facebook if recommendations must be included in your Activity button. Defaults to false.
transparency Tells Facebook if the element's transparency must be honored in your Activity button. Defaults to false.

Demo

Live demo

Download

jquery.facebook.social.js