Horizontal Social share buttons below Blog Post Title

Social sharing widget is generally for sharing the content in various social sharing site. Generally we add this kinds of social sharing widget end of the blog post. But we can also add this sharing widget below every blog post title. I think this is the more useful for getting your post shared  by your readers. This widget is very simple but strong. I have used 3 major social sharing icons, such as Facebook share and send, Google Plus and Twitter. I hope this widget would help you to increase your content sharing by your current readers. Though you can use Addthis widget but Addthis widget is hosted on other server so it may take time to load. So this widget will be completely install in your blogger template. So it is very fast to load. I have simplified the installing system thus you can easily add this widget in to your blog. Hope you would like it. Please follow the instruction from below to get this widget.

Step 1 Log in to your Blogger account and Go to your Blogger Dashboard

Step 2 Click on -> Template -> Edit HTML

Step 3 Now Find this code <data:post.body/> by pressing  Ctrl + F 

Step 4 Paste the below code  Before/above <data:post.body/>

Note: You would get  code 3 or 4 times in your blogger template try with one by one until visible the widget.

<!-- Horizontal social buttons Start -->
<div class='horizontal-social-buttons'>
<!-- Facebook Like+Send www.bloggerspice.com-->
<div style='float:left;margin-right:10px;'>
<fb:like colorscheme='light' expr:href='data:post.url' font='' layout='button_count' send='true' show_faces='false'/>
</div>
<!-- Google +1 -->
<div style='float:left;margin-right:-15px'>
<g:plusone annotation='bubble' expr:href='data:post.url' size='medium'/>
</div>
<!-- Twitter www.bloggerspice.com -->
<div style='float:left;margin-right:-15px;'>
<a class='twitter-share-button' data-count='horizontal' data-lang='en' data-related='' data-via='' expr:data-text='data:post.title' expr:data-url='data:post.url' href='https://twitter.com/share'>Tweet</a>
</div>
</div>
<div style='clear: both;'/>
<!-- Horizontal social buttons End -->
<!-- Scripts Start -->
<b:if cond='data:post.isFirstPost'>
<!-- Facebook -->
<div id='fb-root'/>
<script>jQuery.noConflict();(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = &quot;http://connect.facebook.net/en_US/all.js#xfbml=1&quot;;
fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));
</script>
<!-- Twitter -->
<script>jQuery.noConflict();!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script>
<!-- Google Plus One www.bloggerspice.com -->
<script src='https://apis.google.com/js/plusone.js' type='text/javascript'/>
</b:if>
<!-- Scripts End -->

Step 5 Now hit the save button.

That's it. You have done. Now check any post to see the widget.