Latest: Unlock ZTE Modems | Adsense Approval Tips | Wordpress Themes 2013 | Change A Blogger Template | Windows 7 Antivirus | Backlinks Generator |

Monday, 17 June 2013

Add A Fancy Share Buttons To Blogger And Wordpress

If you've checked every bottom of my blog posts you'll noticed a set of social sharing buttons just below the posts. This social sharing buttons doesn't only beautify your blog with a unique look, but it also gives the readers a freeware of sharing your posts to their various social networking sites such as facebook and twitter, which in-turn boost your traffic and fetched you with more targeted audience as well. Ever since i implemented this social sharing buttons to my blog, I've experienced a dramatic increase in my traffic.

add social share buttons to blogger and wordpress
In this tutorial am going to work you through the installation process of this social sharing buttons. So, just site back and relax while i provide you with all the necessary step by step guide to add this sharing buttons to your blog.

PREAMBLE:- This set of social sharing buttons is only for used on Blogger and Wordpress platforms at the time of writing this post. Hence, if you're blogging with any of this platforms (Blogger or Wordpress), then you'll definitely won't be missed out. All you have to do is to follow all the steps outlined below appropriately, in other to achieve the aim of reaching out to more targeted audience and gaining exposure as well. This social sharing buttons comprises of some top social networking and bookmarking site(s) including:
  • Facebook share button
  • Googl+1 share button
  • Tweet share button
  • Digg bookmarking share button
  • StumbleUpon bookmarking share button
  • Facebook like button.
social sharing buttons for wordpress and blogger

Now, base on the fact that this social sharing buttons is both for Blogger and Wordpress users, that's why we're going to make it more concise by dividing the tutorial into two sections, "Blogger and Wordpress".

Adding The Social Share Buttons To Blogger

1. Log in to Blogger account if you're not already logged in.
2. Go to Template => Edit HTML
3. Click => Format Template just above the template Editor.
4. Click anywhere inside the Template Editor and search for this code:-

</head>
 And just above/before </head> paste the following codes

<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script><script type="text/javascript">stLight.options({publisher: "ur-47c9cca-cf33-f245-f3f6-43ed7a58f34f"}); </script>
 5. Now search for this code:

<data:post.body/>
Wait! Note that if you're template has an Auto-Read-More installed, then you're likely to have more than one of these code "<data:post.body/>". So, you just have to test them one after the other until you get a satisfying result.

6. Copy the below code and paste it just below <data:post.body/> if you want the social sharing buttons to appear below posts. But if you want the social sharing buttons to appear above posts, i.e under posts Title, then you have to paste the below codes above <data:post.body/>.


<b:if cond='data:blog.pageType == &quot;item&quot;'><style>.blogstable-style-share-buttons{-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;border:1px solid #BBBBBB;background-color:#FFFFFF;-webkit-box-shadow: #B3B3B3 5px 5px 5px;-moz-box-shadow: #B3B3B3 5px 5px 5px;box-shadow: #B3B3B3 5px 5px 5px;padding: 5px;margin: 10px;}</style><p align='center' class='blogstable-style-share-buttons'><span class='st_facebook_hcount' displayText='Facebook'/><span class='st_plusone_hcount' displayText='Google +1'/><span class='st_twitter_hcount' displayText='Tweet'/><span class='st_pinterest_hcount' displayText='Pinterest'/><span class='st_digg_hcount' displayText='Digg'/><span class='st_stumbleupon_hcount' displayText='StumbleUpon'/><span class='st_fblike_hcount' displayText='Facebook Like'/></p></b:if>

Adding The Social Share Buttons To Wordpress

To install the social share button to your Wordpress theme simply follow the steps below. Note: You always need to backup your Wordpress theme if you're making a manual customization to your blog, in-case of error.
How To Install The Social Sharing Buttons To Wordpress Blog Without Plugin? Yes! it's quite possible. Just follow this simple steps:
Go to Settings => Posts Layout => Before The Content. Paste he bellow codes:

<style>.blogstable-style-share-buttons{-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;border:1px solid #BBBBBB;background-color:#FFFFFF;-webkit-box-shadow: #B3B3B3 5px 5px 5px;-moz-box-shadow: #B3B3B3 5px 5px 5px;box-shadow: #B3B3B3 5px 5px 5px;padding: 5px;margin: 10px;}</style><p align='center' class='blogstable-style-share-buttons'><span class='st_facebook_hcount' displayText='Facebook'/><span class='st_plusone_hcount' displayText='Google +1'/><span class='st_twitter_hcount' displayText='Tweet'/><span class='st_pinterest_hcount' displayText='Pinterest'/><span class='st_digg_hcount' displayText='Digg'/><span class='st_stumbleupon_hcount' displayText='StumbleUpon'/><span class='st_fblike_hcount' displayText='Facebook Like'/></p>
Now Save it, and you're all done!

Feedback!

These's all i have for now regarding this tutorials. You can as well share it to you're friends using the sharing buttons below. If you happen to face any challenges adding the social share buttons to your blog, kindly post your query via comments.

You don't want to miss any of our future updates? Please subscribe for our daily newsletter so as to get our latest update delivered directly to your email. Stay blessed, and do have a wonderful weeks ahead. Happy blogging pals...

Subscribe to Get Free Blogging Tips And Quality Tutorials Straight in Your Inbox.




11 comments :

  1. Social Share buttons are very necessary in our blog if we expect to get social shares. And this type of fancy and stylish social sharing widget can surely encourage our readers to share our content. Great job dear Victor!

    ReplyDelete
    Replies
    1. You're right bro Ankit Kumar. It's a necessity for Bloggers to add these awesome sharing buttons to their blogs, it could definitely make our posts go viral.

      Delete
  2. Wow Victor Bro nice collections of all popular social sharing buttons. We will soon implement this social sharing widget on our blogs to drive traffics from all these social sharing buttons. Thanks vicotors bro you have done a great job. keep updating your blog and keep post frequency.

    ReplyDelete
    Replies
    1. Thanks so much bro Hafeez for spending your precious time to leave such an inspiring comment. Stay tune for more update soon to be released.

      Delete
  3. We are unable to copy codes from here. plz fix it

    ReplyDelete
    Replies
    1. Oh, am sorry for that bro Sanjay. I'll try as much as possible to fix it up. Thanks for commenting.

      Delete
  4. nice work dude .... keeep it up

    ReplyDelete
  5. i have a query, im trying to show you my query by image

    chek out here


    http://s8.postimg.org/jo6ivsnid/123.png

    ReplyDelete
  6. great job victor,i was wondering for same,but now resolve my problem,m succeed to add plugin on my blog,Thanks

    ReplyDelete
  7. Did everything you recommended...no social share bar appears? Any suggestions?

    ReplyDelete

Copyright @ 2013 BlogStable.com | All Right Reserved | Designed By: Victor Noah| Privacy Policy | Sitemap || Powered By Blogger & NameCheap