Add Social Media Sharing Buttons Widget Below Post Titles

Social network sharing buttons on the blog how to add social buttons,facebook,twitter,google,horizantal,below,post title in bloggerincrease traffic .90% of my traffic comes through the social networks like Facebook,Twitter and other sites.Making the social share buttons below post titles increase the share of your post in different social networks.About 70% of blogger sites and other websites boost their traffic through social media networks.This post explains how to add the social sharing widget under the post titles which includes Facebook like button,Re-tweet button,Google+ button,Stumble upon button.So,you can add this widget button both for Wordpress and Blogger.So add this useful social sharing buttons to your blog.
Add social sharing media buttons widget below post titles
Part2-
How to add social sharing media buttons widget below post titles for blogger and wordpress ?
1.Go to Blogger->> Design->> Edit Html.
2.Back up your Template.
3.Expand Widget Templates.
4.Search for <data:post.body/>
5.Place the following code just above it.
<!--GOOGLE+1-TWEET-FACEBOOK-STUMBLE-STARTS-->

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style='padding:4px;'>
<table border='0'>
<tbody><tr>
<td>
<div style='margin-right:10px;'>
<a class='twitter-share-button' data-count='horizontal' data-via='mybloggertips' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
</div>
</td>
<td>
<div style='margin-right:10px;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=100&amp; action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; margin-left:0px; width:100px; height:20px;'/>
</div>
</td>
<td>
<div style='margin-right:10px;'>
<g:plusone expr:href='data:post.url' size='medium'/>
</div>
</td>
<td><div style='margin-right:10px;'>
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='button_count'/>
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>
</div>
</td>
<td>
<div style='margin-right:10px;'>
<script expr:src='&quot;http://www.stumbleupon.com/hostedbadge.php?s=1&amp;r=&quot; + data:post.url'/>
</div>
</td>
</tr>
</tbody></table></div>
</b:if>

<!--GOOGLE+1-TWEET-FACEBOOK-STUMBLE-STOPS-->
Part2-
If you already added Google+ button then avoid this below step (or) if not follow below steps.
1.Go to blogger.->> Design or Template->> Edit Html.
2.Back up your Template.
3.Search the code ]]></b:skin>
4.Paste the below code Before ]]></b:skin>

<script src='http://apis.google.com/js/plusone.js' type='text/javascript'> {lang: &#39;en-US&#39;} </script>
5.Save Template.

6 comments:

  1. It was very interesting for me to read that blog. Thanks the author for it. I like such topics and everything that is connected to them.
    website design

    ReplyDelete
  2. It was very interesting for me to read that blog. Thanks the author for it. I like such topics and everything that is connected to them.
    website design

    ReplyDelete
  3. Its the interesting post...I have a getting the exact information from your post...Keep Sharing valuable information....Am wait for your new post...thanks...Website Design Companies in Bangalore | Website Development COmpanies in Bangalore

    ReplyDelete

Please comment the message if you like post or any trouble