Adding a Stylish Share Button to Your Blogger Blog

Do you like the default share button in your blogger blog? I thought so! There is a slick share this button for blogger that is really beautiful and I am 100 percent sure that you’re going to like it. see the share image below

Stylish share button

This stylish share button will increase the flow of sharing on your blog. Let’s not talk much but let the tutorial do it stuff.

HOW TO ADD A STYLISH SHARE BUTTON TO BLOGGER BLOG

Must Read: ADDING CATEGORIES TO YOUR BLOGGER BLOG

Go to your blogger blog dashboard >>> Click Template >>> Click Edit HTML >>> tick the “Expand Widget Template”.

Have you done that? Ok! Let’s continue with the tutorial.

Now search for the below code

</head>

Note: To make the search easy, simultaneously press the ctrl + f key to bring out a search box below your browser.

Right above the code, paste the below code

<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>

<script type="text/javascript">stLight.options({publisher:"wp.182641c0-be35-4714-a18a-19677c040e70"}); </script>

Have you done it? Congratulations you have just completed the first half of the tutorial, now let’s move on to the second part of the tutorial.

Are you still in your “Edit HTML”? If you’re still there, search for the below code

<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Have you seen it? Now right below it paste the below code

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<style>

.babanature-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='babanature-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>

Save your code and check your blog, voila! How beautiful is it? Real beautiful right! This share button widget fits all blogger templates and also beautifies any blog.

Must Read: ADDING RELATED POST WIDGET WITH THUMBNAIL TO YOUR BLOGGER BLOG

Are you stuck somewhere or you’re still having trouble implementing the code? Then use the comment box below to state your problem and i’ll assist you in solving the problem the best way i could. Do you have any comments or thoughts that you would like to throw? Please do by using the comment box below. Remember that your comments and thought are highly appreciated and welcomed.

Do you like this post? Then why not like us, share us and recommend us with friend. Do not forget to subscribe to our feed for your latest post updates on the go.

Don't Miss Any Post Again. Subscribe To Our Feed And Be Updated

Enter your email address below:

Powered by OnenaijaBlog