Tuesday, 4 June 2013

Tagged under: ,

Add Social Sharing Buttons Below Every Post in Blogger

Social Sharing buttons gadget to blogger post
Blogging Becomes more interesting if readers share your contents and posts on different social sharing website. Social media website play a vital role in blogging careers. It boost the blog post rank well in search engine without using any social services we wont get a good traffics from social networks sites. A good website or blog will be considered only if it get massive traffics from social medias & search engine. You might have seen alot of Pro Bloggers which they have still focuses on sharing their posts on social media websites. In short we will just only say that being an ethics blogger we should always publish our post on different social media site through social sharing buttons widget. So in today post we will learn how to add social sharing buttons widget below post title in blogger blog.

Social Sharing Buttons Widget Helps To Boost your Blog Traffics

We totally agree with the above title what does it say. Social sharing buttons widget really a magical way which can boost blog traffics. It make a multiple way to get massive traffics from search engine as well as from social media network. As in the above para we have been discussed that even pro bloggers they also published theirs post on every social media networks. Because they do not want to have traffics only from search engine.
They also love to communicate with readers, friends by sharing blog posts with them. In this way we also get a good chance to have a voice with blog friends if they facing some problem in the posts. one things should also be remembered a post which published on social media networks site also get a good result in search engine. That post becomes lover for every search engine. So by using such gadget in blog we can easily share our post with friends in very less in time.

How This Gadget Is Being Prepared ?

Actually this gadget is consist of several social sharing buttons. It consis of facebook, google plus, twiter and stumbleUpon. This gadget is prepared very neatly there is no bugs inside the code. We are analyzing the gadget or widget before sharing it with our loyal readers.
This gadget is totally created in HTML. & javascript. Html played for it designing layout and javascript work there as scripting the gadget functions. It has smooth layout and awesome designing.A very think slick sticky shape gadget which also bring beauty in blogger blog.

Feature Of Using Social Sharing Buttons Below Every Post in Blogger

There are numberless advantage by using this gadget blogger blog. following are being discussed here. Please take a look onto the list mentioned below.
  • Share the post with single click:
  • Time saver and easy way to share the post:
  • Consist of facebook, google plus, twiter, stumbleupon:
  • Sticky layout designing & beautiful views:
  • Attracting visitors & giving likes up:
  • Light gadget never increase page loading time:

How to Add social Sharing Buttons Widget Below Post Title in Blogger

This very simple process just follow our steps mentioned given below: We will add to parts of the gadget inside blogger template. So be careful while making any changes.
  • Step 1:
  • Go to blogger Dashboard:
  • Go to template editor & find </head> tag:
  • Page the below given code before </head> tag:

<script src='http://apis.google.com/js/plusone.js' type='text/javascript'/>


  • Step 2:
  • Again go to template editor:
  • Find these code inside the template:
  • Past the below code after  <data:post.body/>  or in some blogger template it look like this  <p><data:post.body/></p> 
  • If you are confused just see the screenshots given below:

  • add social sharing buttons to blogger post
  • add social sharing buttons to blogger post
  • add social sharing buttons to blogger post
  • After click on var'post' code then scroll slowly you will find of on these code <data:post.body/>  or <p><data:post.body/></p> and just past the below code


 

<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='ProBlogerTricks' 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>

Make These Changes

  1. Replace the yellow color name with your own twiter name:
  2. You also increase border width by giving value to table border in above code:
  3. You almost done:


Final Words

Friends we have hard effort to bring this nice tutorial about how to add social sharing buttons widget below every post in blogger blog. We have discussed here with detail. Hope you guys will not facing any problem. If you are getting any issue then feel free to ask in the comments area. Thanks & Happy Blogging!

32 comments:

  1. Great work bro! You're doing awesome job!
    One thing I want to know that how PBT has got a large number of email subscribers? That's really amazing bro. I hope you'll share your ideas about it in upcoming post. Thanks

    ReplyDelete
    Replies
    1. This trick one day i will share with you. But as for now i will just only say that you can purchase readers also. lets how ?. for example you give your blog url to MBT or any other popular blog to place my links for 1 months or two month with advance payments. So when they replace theirs own subscription links and placing our links there for some period of time which have estimated with payments. Now after completing the duration they will resend your link and now you have thousands of readers that you got from thats blog. Now whenever you publish your post this time your own blog message will go to all of your readers. I hope you you understand. wish you all the best.

      Delete
  2. @ Hafeez Khan
    It's a very unique trick bro but do you think those subscribers will be beneficial for us? When they get updates in their email, there are major chances that they unsubscribe us. What you think??

    ReplyDelete
    Replies
    1. We will just say that it becomes beneficial & this is in your hands it depends upon you if you work hard as much as more the second blog doing which you have placed your url. Then i think you will never refuses. They will like your posts, visiting also & have good readership & in this way now you have massive traffics by doing this mini tricks. Hope you got it.

      Delete
  3. Nice Post HAfeez Bro.
    As in upper reply, But if we purchase readers then will it good for us or it will harm us. As i have heard that google soesn't like websites that are purchasing traffic and readers. Share your own views on it.

    ReplyDelete
    Replies
    1. Sameer we are not talking about that purchasing readers which you mean thats. this is a simple tricks by which we can have thousands of readers in short duration of time. You will be understand just read the above to answer attentively given to Yaqoob & Ankit.

      Delete
  4. Nice bro Hafeez bro
    but this is not working on my blog i follow your instructions but nothing happen
    i don't see sharing buttons every post in my blog ?

    ReplyDelete
    Replies
    1. We have checked it on several template it 100% working just try once again. or backup your template and send it on hafeez.khan8000@gmail.com we will customize it for you. thanks.

      Delete
  5. Nice Post Bro Thanks This Widget Will Rely Help To Increase Your Followers

    ReplyDelete
    Replies
    1. Thanks buddy for your appreciation. You are right it will boost your social media friends and readers. thanks for being in touch with us.

      Delete
  6. Very Nice post! I have visited your Blog first time and glad I like it! :) Looks like there are lots of bloggers now a days sharing some useful information. Thank You so much.

    ReplyDelete
    Replies
    1. Thank you so much Saqib for landed here for the first. I hope you will become a loyal reader of PBT in feature. thanks bro feel its your home and feel free to ask. Bundle of thanks. See you soon here.

      Delete
  7. Hafiz Bhai it's very truly unique trick. But I want that this widget show below the title of the post. And any body scroll down to this post then the widget has become as fixed and want to show this end point of that post. How is it possible ...
    way to blogging

    ReplyDelete
    Replies
    1. Dont Mind Bro i did,not catch your words completely what do you exactly want to say.
      But as for know i will tell you if you want to show this gadget below post title then you can easily put it. but you will have to decrease it width and length. Thats is only. want to show below post title then in my template it will be done like this way.

      'post-body entry-content'

      after it past the gadget code. hope you will see the gadget in below post title.

      Delete
  8. @Hafeez Khan
    if there is a another way except HTML Trics?
    such as Gadget code.or any other simple method...

    ReplyDelete
    Replies
    1. What html tricks can you tell me clearly what are you talking about.

      Delete
  9. oooo i understand nothing to say. nice tricks.
    my site
    http://smarsia.blogspot.com/

    ReplyDelete
  10. Very Good Article Thanks @Hafeez

    ReplyDelete
  11. hello..i really like your Share This Article with your Friends widget below each post..can you please share how to implement this on my blog http://www.webcodeexpert.com

    ReplyDelete
  12. In My Template This Code Is Three Times Where To Place Above Code this is my blog reply fast http://www.latestgames2.blogspot.com/

    ReplyDelete
  13. Thanks it works after a hard work of 1 hour. Thanks again :)

    But I couldn't remove the default shearing button. :(

    My Blog

    ReplyDelete
  14. Nice work bro! your'e doing great job

    ReplyDelete
  15. Bro,by default blogger is providing social share widget na?
    www.appinstall.blogspot.com

    ReplyDelete
  16. Nice Post Bro!
    I have one question, for my blog that i had seen a widget that popup/appears at the right bottom of page when we scroll/reach at the bottom of the post! That widget may be for email subscription, facebook like etc. something like one wikihow uses at the end of the post.
    Do you have code of that widget?

    ReplyDelete
  17. Nice post.
    Where is the demo?
    Thanks

    ReplyDelete
  18. How can i get social sharing buttons above the blogger posts but below the post title.

    ReplyDelete
  19. Nice work brother. thanks.......

    ReplyDelete
  20. Nice Work man. I am Using this on My Blog SalmanKhanbeing.
    Thanks for Sharing this.

    ReplyDelete
  21. Thanks But this is Like old Please Share something new

    ReplyDelete
  22. I follow your instruction but it doesn't work my template is different so how can I do it?

    ReplyDelete

About ProBloggerTricks

Founded in 2013, Pro Blogger Tricks is the ultimate resource for bloggers and marketers. Looking for ways to make money online? Need blogging tips, SEO tips and other business and marketing related content? Probably, the best source of information about monetizing a blog ....Read More

Copyrights @ 2014, Pro Blogger Tricks - Designed By Templateism