Best Social Sharing Tool Box With Share Post Count Below Every Blog Post

In this tutorial i will show you how to Add Cool Shareaholic Sharing Icon below every article in blogger and which also tell how many time post is share on Social Media or Social Sites.

Best Social Sharing Tool Box With Share Post Count Below Every Blog Post

Now i am going to tell how to Add this on your blog posts. If you have already adding Social Sharing Widget/Gadget on blogger then remove it and replace with this widget because it is very simple show able and also occupies less space comparatively to other sharing widgets. It is a tool tips with Hover Effect means when some one place mouse on these icons its rises and also shows the sharing number of posts on social websites.

WordPress Best | Easy Plugins Installation List For SEO And Make Professional Wesbite After Blogger
Add | Changes Labels Or Tags With CSS Button Beautiful Color With Hover Effect
Add 6 Best | Beautiful | Cool Looking Social Bookmarking Sharing Buttons Widget | Gadget On Blogger Blogspot

How To Add Shareaholic Sharing Icon on Blogger:

Follow my below tutorial and do same as my posts tell.

Go to Blogger.com.

Go to Template.

Click On Edit HTML.

Press Ctrl+F in HTML Body Box.

When search box is appear in right to corner then paste below code/tag in it and press enter.

]]></b:skin>

When you find this above code then copy below coding and paste it just above/before ]]></b:skin> tag.

div.shr-bookmarks{margin:20px 0 8px;clear:both !important;display:block !important}div.shr-bookmarks ul.shr-socials{width:100% !important;margin:0 !important;padding:0 !important;float:left !important}div.shr-bookmarks ul.shr-socials{background:transparent none !important;border:0 none !important;outline:0 none !important}div.shr-bookmarks ul.shr-socials li{display:inline !important;float:left !important;list-style-type:none !important;padding:0 !important;height:29px !important;width:60px !important;cursor:pointer !important;margin:3px 0 0 !important;background-color:transparent !important;border:0 none !important;outline:0 none !important;clear:none !important}div.shr-bookmarks ul.shr-socials li:before,div.shr-bookmarks ul.shr-socials li:after,div.shr-bookmarks ul.shr-socials li a:before,div.shr-bookmarks ul.shr-socials li a:after{content:'' !important;}div.shr-bookmarks ul.shr-socials a,div.shr-bookmarks ul.shr-socials a:hover{display:block !important;width:60px !important;height:29px !important;text-indent:-9999px !important;background-color:transparent !important;text-decoration:none !important;border:0 none !important}div.shr-bookmarks ul.shr-socials a:hover,div.shr-bookmarks ul.shr-socials li:hover{background-color:transparent !important;border:0 none !important;outline:0 none !important}.shareaholic-show-on-load{display: block !important;}div.shr-bookmarks div.shr-getshr{line-height:20px !important;padding-left:8px !important;float:left !important;}div.shr-bookmarks div.shr-getshr a{width:auto !important;font-size:10px !important; text-indent:0px !important;text-decoration:none !important;}div.shr-count{font:12px bold,arial !important;position: relative !important;}div.shr-count-outline{position: absolute !important;color: white !important;}div.shr-count-center{position: absolute !important;color: blue !important;}li.shr-2{background-position:-120px bottom !important}li.shr-2:hover{background-position:-120px top !important}li.shr-3{background-position:-180px bottom !important}li.shr-3:hover{background-position:-180px top !important}li.shr-5{background-position:-300px bottom !important}li.shr-5:hover{background-position:-300px top !important}li.shr-7{background-position:-420px bottom !important}li.shr-7:hover{background-position:-420px top !important}li.shr-10{background-position:-600px bottom !important}li.shr-10:hover{background-position:-600px top !important}li.shr-38{background-position:-2280px bottom !important}li.shr-38:hover{background-position:-2280px top !important}li.shr-40{background-position:-2400px bottom !important}li.shr-40:hover{background-position:-2400px top !important}li.shr-43{background-position:-2580px bottom !important}li.shr-43:hover{background-position:-2580px top !important}li.shr-52{background-position:-3120px bottom !important}li.shr-52:hover{background-position:-3120px top !important}li.shr-74{background-position:-4440px bottom !important}li.shr-74:hover{background-position:-4440px top !important}li.shr-88{background-position:-5280px bottom !important}li.shr-88:hover{background-position:-5280px top !important}li.shr-106{background-position:-6360px bottom !important}li.shr-106:hover{background-position:-6360px top !important}li.shr-201{background-position:-12060px bottom !important}li.shr-201:hover{background-position:-12060px top !important}li.shr-219{background-position:-13140px bottom !important}li.shr-219:hover{background-position:-13140px top !important}

Shareaholic

Shareaholic

Now find another code in your template for adding Social Icons on below post or Footer of your blogger blogspot.

<div class='post-footer'>

When you find this code line then copy below given code and paste below this above code.

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='shr_class shareaholic-show-on-load'> </div> <script type='text/javascript'> var SHRSB_Settings = {&quot;shr_class&quot;:{&quot;src&quot;:&quot;http://www.shareaholic.com/media/css/styles/sb&quot;,&quot;link&quot;:&quot;&quot;,&quot;service&quot;:&quot;5,7,2,38,3,219,43,52,201,88,74,10,106,45,40,210,78,39&quot;,&quot;apikey&quot;:&quot;6ffe2cbf142c45bd4cd03b01ec46b8658&quot;,&quot;localize&quot;:true,&quot;shortener&quot;:&quot;google&quot;,&quot;shortener_key&quot;:&quot;&quot;,&quot;designer_toolTips&quot;:true,&quot;twitter_template&quot;:&quot;Some fancy post title - http://goo.gl/dbqlx via @trickofblogging&quot;}}; </script> <script type='text/javascript'> (function() { var sb = document.createElement(&quot;script&quot;); sb.type = &quot;text/javascript&quot;;sb.async = true; sb.src = (&quot;https:&quot; == document.location.protocol ? &quot;https://dtym7iokkjlif.cloudfront.net&quot; : &quot;http://cdn.shareaholic.com&quot;) + &quot;/media/js/jquery.shareaholic-publishers-sb.min.js&quot;; var s = document.getElementsByTagName(&quot;script&quot;)[0]; s.parentNode.insertBefore(sb, s); })(); </script><a href='http://trickofblogging.blogspot.com/' target='_blank'>Social Bookmarking Gadget</a></b:if>

Replace Red Highlighted Color my twitter page with your Twitter page by replacing name.
Now Save your template.
Click on view blog.
And you have done.

If you feel any problem about this widget or other gadgets for adding in your blog then submit your comment and get a beautiful and helpful answer.

Related Articles:

How To Add | Put | Insert | Copyright Warning Message In Blogger Post To Prevent Content

Add | Put HTML Color Code Generator Tool To Your Blogger With Easy Tricks

Add Manually CSS Jqeury Drop Down Menu By Replace/Remove Pages On Blogger

Add | Put | Embed Three Or Four Column Footer Widget/Gadget In Blogger Blogspot

Add Facebook Like Box Widget/Gadget On Blogger By Facebook Developer Plugin

Add | Make About Us Page Widget | Gadget On Your Blog Footer Or Sidebar

Create | Make | Add | Set 404 Error Page In Blogger Blogspot Easily

Add | Put Best Style Subscribe Box Widget/Gadget For Blogger Sidebar

How I Can Write 100% Original Content For Blogger

This tutorial is tell you how you can write most better and content full blog post to increase traffic. When you want to write the blog post some tips are their which is very useful for you. When your going to write the post on your blog first think about the blog post title because it is very important for you when some going to search some keywords they cannot write single word but they write a two or three words together. Now when you write your post think which keywords are so common when you decide this and find the keywords then your 75% work is done.

Now when you make the title of your blog post which is more unique content.

Now Write 100% With These Tips:

When you make the title of your blog post then copy your title which you make and paste in the Google Search Engine. When you paste the click to search result if your blog post 75% same then remove your title and make new but if your title is 50% same then you can use it as your blog post title. Means if your post title is 10 word and 5 words which you search is same then you can use it in your blog post.
When you writing your post then make some headings and subheading also to highlight your content.
When you highlight your content with subheading then your blog post is also highlight in search results it is best tips to write original content.
When you writing the post then highlight some keywords to make your post beautiful.
When you writing the post then check your post is better for search results.
Your focus is totally on your keywords.

Some Tips For Good Content:

Write your post totally with your own mind if you are not clear about post which you want to write then you search on Google with your related post and pickup some ideas and then write with your own mind with some changes it is also considered in original content.


Related Posts:

Now You can Replace Old Style Templates in Blogger in new one
Live Traffic Counter Put In Your Blogger Blogspot
Add A Simple Drop Down Menu To Blogger Blog
You Should Make Internal Links And Backlinks and Increase in Blogger Blogspot
The Best Placement of Adsense On Your Blogger Blogspot