Saturday, November 10, 2012

How to add cool and stylish share buttons to blogger

Social Networking icons

Social Networking has taken the world by a storm and has proved to be one of the best ways to get traffic to your website.I will now share with you a few tips on how you can add the share buttons(In the picture shown below)below your blog title or below each of your blog posts.


Share buttons


To add the above sharing buttons all your need to do is go to 

Blogger dashboard---->Template---->Edit HTML---->Proceed---->Expand Widget Template

On this screen you will see HTML coding of your blog.Press CTRL+F key on your keyboard and a search box will open up.

Once you see a search box open up search for </head> and input the code that i have mentioned below just above </head> tag.

<script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/> <script type='text/javascript'>stLight.options({publisher: &quot;ur-f88c393a-e367-4cd6-bc3a-a7f5d95f4287&quot;}); </script>

Once you have completed the step above search for <data:post.body/> and paste the code mentioned below above it(If you need your sharing buttons to show below the title of your post) or below it(If you need to see the sharing buttons below each blog post)

<p align='center'>
<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_fblike_hcount' displayText='Facebook Like'/> <span class='st_pinterest_hcount' displayText='Pinterest'/> <span class='st_digg_hcount' displayText='Digg'/> <span class='st_stumbleupon_hcount' displayText='StumbleUpon'/> </p>

Once you have completed the above steps based on your choice you will be able to see the sharing buttons either below or above your blog posts.

Note:In case if you have more than one <data:post.body/> in your template try following the above steps on each one of them and one of them should definitely work for you.

No comments:

Post a Comment