9 Facebook Social Plugins For Blogs

Facebook social plugins are widely used online today. The most famous is the "like" button which is used by millions of webmasters to promote their sites. How many of these social plugins do you use on your blog? I'll try to provide brief information about these great tools that might help you to achieve your online endeavors.

Activity Feed

The activity plugin displays the most important activity going on at your blog. Whether somebody has liked a post, commented on the Facebook comment box or shared the post with their friends on Facebook. If a user is logged into Facebook, the plugin will be personalized to highlight content from their friends.

I would only recommend this plugin if you believe there is enough activity going on at your blog other wise it wont leave a good impression at the visitors.

Comments

Comments plugin lets users to comment on your blog. A great feature of this social plugin is that when ever someone comments on your blog and leaves the "Post to Facebook" check box ticked, the comment appears on his Facebook activity feed with a link back to your blog and thus making increasing more links towards your blog.

Also this comment box is extremely user friendly and is quite simple to understand. 

Facepile

The Facepile plugin shows the profile pictures of all the people who have liked your blog or have signed up for it. You just need to enter your blog URL and your plugin would be ready to go. This again helps only if your blog have enough likes and followers.

Like Box

The Likebox plugin lets users to like your Facebook page from your website or blog. There is no need to visit the the page its self. Also, the box shows activity feed of your page at Facebook and makes it really easy for  the users to like your blog. Though there is a option to turn of the activity feeds and even the thumbnails. Its quite customizable.

Like Button

Like button works somewhat like the "like box" but have a different purpose to serve. Its a more handy button and can be added to places like post headers and footers. Its just allows to like your respective post or your blog as a whole. Today, Facebook likes have become one of the determinants of your online success. Its a must to have plugin.

Live Stream

Live stream plugin lets users to share comments and activity in real time on your blog. Live Stream works best when you are running a real-time event, like live streaming video for concerts, speeches, or web chats.

Login Button

The Facebook Login button lets users login in your blog as the name suggest and in addition to this the users can see his friends pictures who are already part of your blog. The button can be customized in a way that you can set the number of rows for the pictures to be displayed.

Recommendation

This plugin features all the recommendations your blog has earned. Whether a particular post or the blog as a whole, the plugin would show that content as recommended by so and so.

Send Button

The Send Button allows users to easily send content to their friends. People will have the option to send your URL in a message to their Facebook friends, to the group wall of one of their Facebook groups, and as an email to any email address. Though Facebook like button has a "Send" button too now so there is no as such need of this button.

Which one to choose?

Facebook social plugins are really one of the best out there as part of social tools available online. Its not necessary that you should use all of them to get online success. Instead work out your needs and then choose which ones you want. The most famous are Facebook like button / box, comments.

We would like to know which of  these social plugins you use on your blog.

Thanks

Read More

Putting a Facebook like, send or share button on your web and blog

Putting a Facebook "like", "send" or "share" button on your blog

There is an official Facebook button that your readers can use to share your blog, your current post, or any website, on their own Facebook account.  This article describes how to get the code from Facebook and install it into Blogger - but most of the information applies to other blogging tools (Wordpress, TypePad, etc) and many other web-site tools also. 


Background

Previously I've described the different ways that you can link your blog and the social-networking sites.

Facebook badges can be used to send your blog's readers to your personal Facebook profile, or to your page.  These are an example of the"follow me" approach.

But often blog authors want to give their readers a tool to share the blog that they are reading on their own (ie the readers own) Facebook account - that is to use the "Look what s/he said" approach.

Your readers could just copy-and-paste a hyperlink to your page into their own Facebook account, but it's clunky, and means that they have to start up Facebook themselves. 

Various people have written 3rd-party widgets to put a Facebook icon on your blog, set up so that when a reader clicks it the current page it is automatically shared on the reader's Facebook account.  Some even count how many times the button has been clicked.

But I really don't like, or trust, 3rd party gadgets:

• There's no guarantee that they don't have nasty side effects on your blog.  
• Some of them ask you to type your Facebook id and password onto a page owned by a 3rd party.   They promise that the won't do nasty things with the data - and some of them mean it.  But you just don't know who to trust.  
• If Facebook change how they do things, there's no guarantee that 3rd party tools will also be changed:  you could easily be left with a button that doesn't work any more.

I'm not saying that all the 3rd party gadgets are bad:  I've used some on my sites with no ill-effects.   But I've never been happy about it. And the day that I used the AddThis button on a newspaper website to share an article to my personal travel-blog, I had a mini panic-attack 1/2 an hour later when I realised that I'd just given my email and AdSense password to a third-party.


One approach - Blogger's social-sharing buttons:

Google have now introduced social-media buttons which can be shown at the bottom of each post.   They only work on blogs with Designer Templates (ref Types of Blogger Templates)

They're an improvement on the 3rd party gadgets, but I still don't like the way they look, and the lack of options to customize them, so I usually have them turned off.


A better approach - Facebook's official gadgets:

The Share Button: 

The first "look what s/he said" option that Facebook offered was the Share  button, officially called the the Post To Profile gadget.

This let you customise a few features, and also had a preview function

You can still see this gadget on many web-pages.   But you cannot get the code for this from Facebook any more:  they now recommend using the social plugins (more about them below) instead.

The Share button still works though, and can be added to your site using this code:

<b:if cond='data:blog.pageType != "static_page"'>

<div style='float:left;padding:3px 3px 3px 3px;'>
<a expr:share_url='data:post.url' 

href='http://www.facebook.com/sharer.php' 

name='fb_share' 

type='box_count'>

Share

</a>

<script 

src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' 

type='text/javascript'>

</script>
</div>

</b:if>

(I've spaced the code out a bit so it can be understoond more easily - the extra line-breaks can be removed when you use it.) 

You can configure the code by changing the value of type:  other options are

• button_count   (shows a counter beside a smaller button)
• button (shows a smaller button, still with the word "share"
• icon (shows the small "f" only)

See Sharing from your blog to the Social Networking Sites for more information about where to put the code, including general and post-specific options. 

Notice that because the code above includes   expr:share_url='data:post.url'   you need to put it in a post-specific place in your blog.   Another option would be to replace data:post.url  with the URL for your blog, and put the code into a gadget etc.

Be aware that sometime in the future, the Share button may stop working, because Facebook stop supporting it.   I don't expect that to happen soon though, because it's now installed on so many web-sites worldwide.

The Like and Send buttons:
Facebook's official gadgets for saying "look what s/he said" are now the Like and Send buttons.

Officially, you can get the code for them on the Developers > Social Plugins > Core concepts page:  don't be put off because the page is labelled "develoeprs" - it really is quite simple to install the buttons into your blog. 

However the last few times I tried to get the code from Facebook, it's refused to give it to me, saying:

"The href entered is not recognized as a valid URL.".

So this is the code I got from them before, modified to be used in a post-specific place - see below - and to not use the width that was suggested:

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/><fb:like action='like' colorscheme='light' expr:href='data:post.url' font='' layout='button_count' send='false' show_faces='false'/>

This picture shows the options that were available when I got that code:

It's fairly easy to look at these options, and work out changes you might like to make, eg

like action='recommend' colorscheme='dark' font=''Arial layout='box_count' send='true' show_faces='true'

When you have chosen the options you want:

• Click the Get Code button at the bottom of the page, 
• Copy the code that is provided, and 
• Install it into your blog (see below for more info about this).

Sharing a Post vs Sharing the whole blog: 

If you put a a Like, Send or Share button into your own blog as a gadget, then what is shared is your whole blog, not the particular Post that is being read, for example   

http://blogger-hints-and-tips.blogspot.com   (this blog)

instead of

http://blogger-hints-and-tips.blogspot.com/2010/04/tools-for-linking-blogger-and-social.html  (a post)

If this is what you want your readers to do, then just put your blog's URL into the "URL to Like" field (or the expr-statement if you're using the Share button code), and add the code as a gadget.

But if you want your readers to share individual posts, then you need the Facebook-button to appear with EVERY post, in either the post-header or post footer  This is a little harder than adding it as a gadget.  To get the code to use for the Like/Send buttons

1. Put some dummy text into the URL to share field
2. Get the code
3. Replace the dummy text with instructions to use the URL of the current post, ie change it from

<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=173511999379139&xfbml=1"></script><fb:likehref="DUMMY-TEXT" send="false" width="450" show_faces="true" font=""></fb:like>

to

<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=173511999379139&xfbml=1"></script><fb:like

expr:share_url='data:post.url' send="false" width="450" show_faces="true" font=""></fb:like>

The way to add the code to your blog is described fully in Putting Share this on XXX buttons into your blog (it's done the same way, no matter what social network's share button you are adding).


What your readers see

When a reader clicks your Facebook button, they'll be asked to log in to Facebook (unless they're already logged in).

Once they're logged in, then:

If they used the Like button:
The "like" is recorded on their wall, and they are shown a small message in your site, giving then the opportunity to un-do the like, or to add a comment which is also shown on their wall along with the like.

If they used the Send button:
They are shown a small pop-up window where they can type in names (from their existing Facebook friends) or email addresses.  A message about the item is send to the selected people using either Facebook Messages or regular email for people who aren't on Facebook.

If they used the Share button:

They see a window where they can enter a message, and see the link and description that they're going to be sharing.

The link is either the page that they were viewing when they clicked the button, or another URL (if you chose the Custom URL option when you were setting up the gadget).  The description is an advertisement for Blogger.  However both of these these can be changed if your reader clicks on them.

Lastly there's a captcha window, where they have to enter some security test.

Read More