How To Add Facebook Social Buttons For Blogger

Q: I want to have the standard Facebook social media button for Blogger blog. I do have a blog about blogging, how will I add this button on my blog?

A: Facebook is one of the most popular social networking sites in the whole world today. Everybody has an account of this; Young, old, teenager, baby, business and even pets. Most of Facebook users are non-bloggers. Most of them use Facebook as a medium to connect to their friends all over the world. But bloggers take advantage of this amazing website by adding social buttons for their Blogger blogs. These social buttons for Blogger blogs are one of the traffic pullers to their blog. With the help of these social buttons for Blogger blogs, bloggers gain exposure to their blog when someone uses it.

Blogs with media topic benefits more of the gadget. Just like what I said, most Facebook users are not bloggers. Most of the people who share a post to their Facebook page are non-bloggers. Most of them are just internet surfers who search something interesting that they can share to their friends on Facebook. That’s why non-blogging topic has the advantage to this.

Most of the blog topics that benefit on this gadget are movies, television programs, radio programs, podcasts, sports and more.

Below are the steps on adding the standard gadget for Facebook:
Log-in to your blogger account and go to template then Edit HTML then Proceed.
Click on the “Expand widget templates”
Search this code using CTRL+F on your keyboard. <data:post.body/>
After or before the code, paste the code:

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=35&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:35px;'/>
</b:if>

Then finally, save the template.

If done correctly, the widget should appear like this:

If you want to use a widget with like and count button in box, do the same step except for adding the long code above. Instead, add this:

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=box_count&amp;show_faces=false&amp;width=55&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=65&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:55px; height:65px;'/>
</b:if>

If done correctly, a widget should appear like this on the post:

That’s it. With these social buttons for Blogger blog, you’re ready to skyrocket your blog traffic with shares of your friends in Facebook. Just a warning, if you’re not so good in editing html on your blog it is recommended that you back up your blog first before editing it. You don’t want any hassles on designing your blog, do you?

Share this Facebook social buttons for Blogger blogs to your blogger friends and start gaining shares from them. If you do like this social buttons for Blogger, you might want to share it to your Facebook friends. Go ahead and reward me with your shares!