जनवरी 10, 2012

How to add facebook social plugin to your blogpost in 2 steps

For a change, here are two simple steps to add facebook like, send and comment box to your blogpost. Yup, you'll get separate one for each post.

Let's begin

1. edit your template in HTML and

above <head>, paste -
<div id='fb-root'/>
<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 = &quot;//connect.facebook.net/en_US/all.js#xfbml=1&quot;;
  fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script>
<script src='http://code.jquery.com/jquery-latest.js'/>

2. expand widget and search <data:post.body/>, just below that, paste these lines -
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<fb:like expr:href='data:post.url' send='true' show_faces='true' width='450'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='500'/>

It's done. Say thanks, view your blog and keep posting.