331A96E0-3037-43FC-8D93-543B900B11C9

😍 Loving this theme? Download

Please enter at least 3 characters.

Add Custom Social Media Share Buttons to Blogger Posts

Social Media Buttons allow readers to share content with ease. Grab our premium customized social media buttons for free and add them in blogger post.
Add Custom Social Media Share Buttons to Blogger Posts
Responsive Social Media Share Buttons for Blogger
Social Media Platforms (sites) play a major role in overall success of our content because SEO takes time to drive targeted traffic from search engines.

Not to mention, social signals (how many times your content has been shared on different social media sites) has an impact on your overall SEO in many ways.

So I am not going to write an essay on Social Media strategy but, today I am going to share another version of Custom Horizontal Social Media Share Buttons for Blogger along with total shares count. You can add these buttons below the post titles or in footer to increase the social shares of your well written content.

These social media buttons are made purely with the help of HTML and CSS so they don't affect the Page load time speed at all.
Even by removing the Official Social Media Share Buttons from your blog, you can decrease your page load time by half of the total time.

Features:-
1) Fully Responsive Design
2) Made with Pure CSS and HTML
3) Shares Counter
4) Integration of FontAwesome Icons
5) 5 Social Media Share Buttons Included
6) Super Easy to Install (Copy and Paste)


Responsiveness: Check out the below Screenshot which shows the Responsiveness of these social media share buttons on different screen resolutions in one go.

Note: New version available  - Super Light Weight Social Sharing buttons 

Important Update and read Carefully:-
I use Free hosting provided by OpenShift.com for hosting PHP scripts which are liable to get the shares count of all the social media sites. There is monthly bandwidth limit and shares count script will stop working if limit is crossed.

You can upload these PHP scripts yourself if you have premium hosting or else you can use OpenShift.com to get free hosting. Free hosting is enough for one blog.

If you can't manage it yourself then you can hire me. I'll upload these scripts for you and make it working without any issue.

Get PHP Scripts Here = https://github.com/abeMedia/shareCount

How to Add Custom Social Media Buttons to Blogger Posts

Step 1) As usual, login to your blogger account > Select your blog > go to Template section > click on Edit HTML and let the Template Editor load. Do not forget to save template backup before altering anything, be safe.

Step 2) As you know that we are using FontAwesome icons for it so you need to install them in your blog first otherwise icons would not appear. So find out this opening <head> tag (click inside template editor and press Ctrl+F on windows or Cmd+F on Mac to open up a search box inside template editor) and just below that, paste the FontAwesome icons link given below (only if you're already not using them on your blog, avoid adding same codes twice).

<link href='http://netdna.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.css' rel='stylesheet'/>

You also need to add Google JavaScript Libraries link to make the shares count API work. So add the link given below if you're already not using (rare case, please check before adding).

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>


Step 3) So now you need to add the CSS code to your template so just find out this closing </head> tag and just before this tag, paste the whole CSS code given below as it is.

CSS code:-
<b:if cond='data:blog.pageType == &quot;item&quot;'> <style type='text/css'>
/*------------------------------------------------------------
Horizontal Social Media Share Buttons for Blogger
Designed by:: http://TwistBlogg.com
Shares Count Code by:: http://donreach.com/social-share-count
issued under GNU GPL Licence
Icons:: FontAwesome
******** Do Not Remove These Credits ********
------------------------------------------------------------*/

.tbn_horizontal_sharebar {
    position: relative;
    background: none;
    z-index: 2;
    width: 100%;
    padding: 10px 0;
    display: inline-block;
    font-family: sans-serif;
    margin: 5px 0px;
    border-top: 1px dotted rgba(0, 0, 0, 0.05);
    border-bottom: 1px dotted rgba(0, 0, 0, 0.05);
}

.tbn_horizontal_sharebar .Share_buttons {
    display: block;
}

.tbn_horizontal_sharebar .Share_buttons .wrap {
    text-align: center;
    margin: 0 auto;
    display: inline-block;
    min-width: 41px;
}

.tbn_horizontal_sharebar .Share_buttons .wrap1 {
    display: inline-block;
    width: 31px;
    float: left;
}

.tbn_horizontal_sharebar .Share_buttons ul {
    margin: 0;
    padding: 0;
}

.tbn_horizontal_sharebar .Share_buttons ul li a,
.tbn_horizontal_sharebar .Share_buttons ul li a:hover {
    color: #FFF !important;
    cursor: pointer;
    line-height: 25px;
    height: 100%;
    display: block;
    text-decoration: none;
}

.tbn_horizontal_sharebar .Share_buttons ul li {
    list-style: none;
    list-style-type: none;
    padding: 0;
    margin: 1px;
    float: left;
    width: 16%;
    max-width: 115px;
    display: inline-block;
    font-size: 13px;
    overflow: hidden;
    text-align: left;
    height: 25px;
    line-height: 25px;
    color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.04);
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.tbn_horizontal_sharebar .Share_buttons ul li .fa {
    color: #fff;
    font-size: 17px;
    font-weight: normal;
    font-family: FontAwesome;
    display: inline-block;
    text-align: center;
    padding: 0;
    height: 25px;
    line-height: inherit;
    width: 30px;
    background-color: rgba(0, 0, 0, 0.1);
    border-right: 1px solid rgba(0, 0, 0, 0.05);
}


/*--Facebook---*/ 

.tbn_horizontal_sharebar .Share_buttons .btn_fb {
    background: #3a579a;
}

.tbn_horizontal_sharebar .Share_buttons .btn_fb:hover {
    background: #314a83;
}


/*--Tweeter---*/

.tbn_horizontal_sharebar .Share_buttons .btn_twtr {
    background: #00abf0;
}

.tbn_horizontal_sharebar .Share_buttons .btn_twtr:hover {
    background: #0092cc;
}


/*--Google Plus---*/

.tbn_horizontal_sharebar .Share_buttons .btn_gplus {
    background: #df4a32;
}

.tbn_horizontal_sharebar .Share_buttons .btn_gplus:hover {
    background: #be3f2b;
}


/*--Pinterest---*/

.tbn_horizontal_sharebar .Share_buttons .btn_pntrst {
    background: #cd1c1f;
}

.tbn_horizontal_sharebar .Share_buttons .btn_pntrst:hover {
    background: #ae181a;
}


/*--linkedin---*/

.tbn_horizontal_sharebar .Share_buttons .btn_linkdin {
    background: #2554BF;
}

.tbn_horizontal_sharebar .Share_buttons .btn_linkdin:hover {
    background: #224EB4;
}


/*---Total Share----*/

.tbn_horizontal_sharebar .Share_buttons .share.h6 {
    font-size: 10px;
    font-weight: bold;
    text-shadow: none!important;
    text-decoration: none;
    text-align: center;
    color: #000000;
    border-top: 3px solid #FFF600 !important;
    border-bottom: 0;
    padding: 0px !important;
    padding-top: 5px!important;
    margin: 0 !important;
    line-height: 8px;
    border-radius: 75% 0;
}

.tbn_horizontal_sharebar .Share_buttons .share {
    border: none;
    margin: 0px 5px 0px 1px;
    overflow: visible !important;
    width: 95px !important;
}

.tbn_horizontal_sharebar .Share_buttons .share .count.h4 {
    font-size: 18px;
    font-weight: bold;
    text-shadow: none;
    text-decoration: none;
    font-family: sans-serif;
    text-align: center;
    color: #FF0000;
    line-height: 15px;
    margin-top: 0px;
    margin: -4px 0px 2px 0;
    min-height: 15px;
    padding: 0px;
    border: none;
}

.tbn_horizontal_sharebar .Share_buttons .btn_fb .share-btn,
.tbn_horizontal_sharebar .Share_buttons .btn_twtr .share-btn,
.tbn_horizontal_sharebar .Share_buttons .btn_gplus .share-btn,
.tbn_horizontal_sharebar .Share_buttons .btn_pntrst .share-btn,
.tbn_horizontal_sharebar .Share_buttons .btn_linkdin .share-btn {
    position: relative;
    color: #C3C3C3;
    display: inline-block;
    text-align: center;
    font-weight: bold;
    font-size: 11px;
    float: right;
    min-width: 12px;
    font-family: sans-serif;
    padding: 0px 5px;
    background-color: rgba(0, 0, 0, 0.28);
    border-radius: 0px 0px 0px 15px;
}

@media only screen and (max-width: 979px) {
    .tbn_horizontal_sharebar .Share_buttons .btn_linkdin {
        width: 34px;
    }
    .tbn_horizontal_sharebar .Share_buttons .btn_fb .share-btn,
    .tbn_horizontal_sharebar .Share_buttons .btn_twtr .share-btn,
    .tbn_horizontal_sharebar .Share_buttons .btn_linkdin .share-btn,
    .tbn_horizontal_sharebar .Share_buttons .btn_gplus .share-btn,
    .tbn_horizontal_sharebar .Share_buttons .btn_pntrst .share-btn {
        display: none !important;
    }
}

@media only screen and (max-width:768px) {
    .tbn_horizontal_sharebar .Share_buttons ul li a,
    .tbn_horizontal_sharebar .Share_buttons ul li a:hover {
        color: #FFF !important;
        cursor: pointer;
        line-height: 25px;
        font-size: 11px;
        height: 100%;
        display: block;
        text-decoration: none;
    }
    .tbn_horizontal_sharebar .Share_buttons .wrap {
        min-width: 34px;
    }
    .tbn_horizontal_sharebar .Share_buttons .btn_linkdin,
    .tbn_horizontal_sharebar .Share_buttons .btn_pntrst {
        width: 30px;
    }
    .tbn_horizontal_sharebar .Share_buttons ul li {
        margin: 1px 3px;
    }
    @media only screen and (max-width:479px) {
        .tbn_horizontal_sharebar .Share_buttons .share {
            border: none;
            margin: 0px 5px 0px 1px;
            overflow: visible!important;
            width: 80px!important;
        }
        .tbn_horizontal_sharebar .Share_buttons ul li {
            width: 25px !important;
            margin: 2px;
            border-radius: 50px;
            border: 2px solid rgba(0, 0, 0, 0.14);
        }
        .tbn_horizontal_sharebar .Share_buttons .wrap {
            display: none !important;
        }
        .tbn_horizontal_sharebar .Share_buttons ul li .fa {
            width: 25px !important;
        }
    }
    </style> </b:if>

Now you are done with adding CSS part so moving on to next step.

Step 4)  Now you need to add the HTML part to your template. Below I am going to provide both the ways to add these buttons either below posts titles or in the post footer so please carefully read the steps and follow accordingly (needs not to mention, I am always there to help your out if anything goes wrong).

Add Social Media Buttons Below Post Titles
Find out this HTML code line <div class='post-header-line-1'/> in your template and just below that, paste the whole HTML part as it is. You may find the above code line twice so in that case, just paste the code after the second appearance of the above code line.

Add Social Media Buttons to Post Footer
Find out this HTML code line <div class='post-footer'> and just below that code line, paste the whole HTML code as it is.
If you did not find the above code line then try finding <div class='post-footer-line post-footer-line-1'> and paste the HTML just below it. Again if the code line appears more than one time then paste the HTML after second appearance.

Important Note:- If you're using my previous Floating Social Media Share Buttons Bar For Blogger then please it is my humble request not to use the same JavaScript code of Shares Count API.
Just delete the JavaScript API code and only use the HTML part because the previous JavaScript code will work fine with it. If you did not get it then please let me know.
JavaScript Code is highlighted in red color text.

HTML code:-
<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
        <script type='text/javascript'>
            //<![CDATA[
            $(document).ready(function() {
                var shareUrl = $("link[rel=canonical]").attr("href");
                $.getJSON('https://count.donreach.com/?url=' + encodeURIComponent(shareUrl) + "&callback=?", function(data) {
                    shares = data.shares;
                    $(".count").each(function(index, el) {
                        service = $(el).parents(".share-btn").attr("data-service");
                        count = shares[service];
                        if (count > 1000) {
                            count = (count / 1000).toFixed(1);
                            if (count > 1000) count = (count / 1000).toFixed(1) + "M";
                            else count = count + "k";
                        }
                        $(el).html(count);
                    });
                });
            });
            //]]>
        </script>
        <div class='tbn_horizontal_sharebar'>
            <div class='Share_buttons'>
                <ul>
                    <li class='share'>
                        <div class='share-btn' data-service='total'>
                            <div class='count h4'></div>
                            <div class='share h6'>SHARES</div>
                        </div>
                    </li>
                    <li class='btn_fb'>
                        <a expr:href='&quot;   http://www.facebook.com/share.php?v=4&amp;   src=bm&amp;   u=&quot; + data:post.url + &quot;   &amp;   t=&quot; + data:post.title' onclick='window.open(this.href,&quot;   sharer&quot;   ,&quot;   toolbar=0,status=0,width=626,height=436&quot;   );   return false;' rel='nofollow'>
                            <div class="wrap1"><i class="fa fa-facebook"></i> </div>
                            <div class="wrap">Share</div>
                            <div class='share-btn' data-service='facebook'>
                                <div class='count' /></div>
                        </a>
                    </li>
                    <li class='btn_twtr'>
                        <a expr:href='&quot;https://twitter.com/intent/tweet?url=&quot; + data:blog.url + &quot;&amp;text=&quot; + data:post.title + &quot; via @TwistBlogg - &quot;' onclick='window.open(this.href,&quot;   sharer&quot;   ,&quot;   toolbar=0,status=0,width=626,height=436&quot;   );   return false;' rel='nofollow'>
                            <div class="wrap1"><i class='fa fa-twitter'></i></div>
                            <div class="wrap">Tweet</div>
                            <div class='share-btn' data-service='twitter'>
                                <div class='count' /></div>
                        </a>
                    </li>
                    <li class='btn_gplus'>
                        <a expr:href='&quot;http://plus.google.com/share?url=&quot; + data:blog.url' onclick='javascript:window.open(this.href,&quot;   &quot;   ,&quot;   menubar=no,toolbar=no,resizbutton_le=yes,scrollbars=yes,height=600,width=600&quot;   );   return false;   ' rel='nofollow'>
                            <div class="wrap1"><i class='fa fa-google-plus'></i></div>
                            <div class="wrap">Share</div>
                            <div class='share-btn' data-service='google'>
                                <div class='count' /></div>
                        </a>
                    </li>
                    <li class='btn_pntrst'>
                        <a data-pin-config='beside' expr:href='&quot;   http://pinterest.com/pin/create/button/?url=&quot; + data:post.url + &quot;   &amp;media=&quot; + data:blog.postImageUrl + &quot;&amp;description=&quot; + data:post.title' onclick='window.open(this.href,&quot;   sharer&quot;   ,&quot;   toolbar=0,status=0,width=626,height=500&quot;   );   return false;' rel='nofollow'>
                            <div class="wrap1"><i class='fa fa-pinterest'></i></div>
                            <div class="wrap">Pin</div>
                            <div class='share-btn' data-service='pinterest'>
                                <div class='count' /></div>
                        </a>
                    </li>
                    <li class='btn_linkdin'>
                        <a expr:href='&quot;   http://www.linkedin.com/shareArticle?mini=true&amp;   url=&quot; + data:post.url + &quot;   &amp;   title=&quot; + data:post.title + &quot;   &amp;   summary=&amp;   source=&quot;   ' onclick='window.open(this.href,&quot;   sharer&quot;   ,&quot;   toolbar=0,status=0,width=626,height=500&quot;   );   return false;' rel='nofollow'>
                            <div class="wrap1"><i class='fa fa-linkedin'></i></div>
                            <div class="wrap">Share</div>
                            <div class='share-btn' data-service='linkedin'>
                                <div class='count' /></div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </b:if>
</b:if>

Editing Part:- All you need to edit in the above HTML part is my twitter username  @TwistBlogg so just replace it with your own Twitter username and you're good to go. Now just save your template code and visit any of your blog post to see it live.

If it did not appear on your blog even after following all the steps correctly then please let me know, I'll personally help you out for sure.

Also please let me know your feedback on the design and responsiveness. Does it work correctly? Appearing same as on this blog? Your feedback will help me to make it better if there are any bugs.

So this is all in this article and I hope you guys have liked it. If you liked it then surely your buddies would also like it if they using blogger platform. Let them know by sharing it on at least one social site you actively use. :)

Thanks and stay blessed!

Share this post

Explore more articles by Satbir

111 comments

Please leave comments related to the content. All comments are highly moderated and visible upon approval.

Comment Shortcodes

  • To insert an image, add [img]image_link[/img]
  • To insert a block of code, add [pre]parsed_code[/pre]
  • To insert a link, add [link=your_link]link_text[/link]
  • To insert a quote, add [quote]quote_text[/quote]
  • To insert a code, add [code]parsed_code[/code]
  1. nice work, but mine only displays in mobile view, and doesn't in desktop view http://kokowap24.blogger.com
  2. i want to add whatsApp share icon in my blog.
    plz guide me
  3. I wish this custom buttons has stumbleupon, that is what I am searching for.
    mazinoweb.com
  4. not working on my blog http://www.godsple.com/
  5. thank for aewsome article. Please take a lokk my site http://www.molympiad.ml/2017/07/junior-balkan-mathematical-olympiad-2017-solutions.html

    I follow you instruction step-by-step, but I do not know why it does not show the number of SHAREs, please help me to fix this issue. Thank you in advance!.
  6. Hmm, nevermind, i think i got it. Great.
  7. 1) i did not understand the php part. I went to github, downloaded the script, but now what? Even if i host it on my own, where i have to put the url on my blogger's template?

    2) Probably it is because of the above, but the total share count isn't working.

    3) Facebook sometimes is pick, and tends to work more if you share your post outside of your blog, by browsing the Facebook website itself.

    4) Twitter isn't displaying any share number (it isn't working on your site, also).

    5) Overall it's a nice piece of code and i glad i visited your page. I am still using, but i hope i can fix these issues. Thks..
  8. always making since it work for my second blog tanks man

    https://kraftscomics.blogspot.com.ng/2017/07/emergency-run.html
    check it out
  9. I can't see it on my blog what i do now.
    happydeepvali.blogspot.in/
  10. I am using Hindi blog and writes in Hindi, i want to check with you if i will change the FontAwesome will it be change my entire blog language from Hindi to ?????. please confirm ?
  11. Thanks, it's showing on my blog. Cool designs by the way.
    But can't it be shown in mobile view?
  12. Not showing on my blog sir
  13. I love this your comment box, please do share..
  14. Your contact form ain't functioning please..
  15. I have added it successfully in my blogger template. But the posts counts not functioning. website url- www.achieversrule.com
  16. Thanks so much. I am highly grateful to you.
  17. yes it is working. after trying many time, just I got success by the help of this post. read this post start to end and do all the changes and put all the codes which is provided in this post. it is really working in my blog. thank to owner of this blog. you may see but remember that share bottom will display in mobile version blog. http://jobsuttoran.blogspot.com
  18. hello,please i have done eveerything but non is showing on my blog...
    here is the blog http://www.goodiestechs.tk/
  19. I followed all steps but my blog is not showing share buttons. Can you help please?
  20. Counter is not working :( please help me...
  21. Its working very fine..Thanks a lot
    ENtLOaded.COm
  22. Working :D
  23. Hello friend! Facebook button not working, google plus only
  24. please I follow all the step still yet it doesn't appear on my site [naijatopstory.com]please help me review it and tell me what's the problem
  25. Hey,
    On my Blogger site the counts are not showing. Let me know about this please.
  26. I didn't make any error placing the codes in, I'm sure.

    Please do update the script as soon as possible.
  27. please can you help me place it on my blogger site because i have been trying and failing please.ebanndi@gmail.com reply me if yes plese thanks
  28. Boss, I have tried this code but i m facing problem can u help me email id isha10chopra12@gmail.com website: www.technotechmedia.com
  29. That is awesome design, thanks :D
  30. well done
  31. Bro please check my blog counter is not working please check and tell me how to solve
    Techwithloud.com
  32. Hi Satbir,

    It's awesome bro, it's really looks professional :)
  33. Very Nice Work Boss I Love your Post Because i Got Email Subscribtion Box From yoru Web Site and It work Awooo Some Please Chk This Out.........
    http://sharekaropk.com
  34. Wow, simply awesome. My only problem is the counter doesn't work, but I don't care, the rest is beautiful. Thank you so much!
    http://www.culturewitness.com
  35. Thanks, buddy! You and your work at this blog are way beyond awesomeness. Keep being rad, awesome and stay blessed! X
  36. thanks a lot! it works perfectly!
    1. I mean.. I have 2 problems :D first: the count doesn't count.. and second: when I share an article, the post on Facebook looks ok, but the post's description is from another article...

      Thanks,

      Sorin.
  37. mine is not working....
  38. Thanks a lot for this post. But, the share count is NOT WORKING. Can you suggest some remedy? Would be of great help.
    www.simplifyinnguniverse.blogspot.com
  39. the best so far.. i just added it to my blog. its awesome! thanks bro
  40. Please,who will help me change the default share buttons on my blogspot blog to an awesome one?my whatsapp no is +2349021019015
    1. nwanne, i fit help you do am oo :) +2349098456212
  41. Wow, I am just excited. My blogs are now sparkling. Thank you very much Admin.
  42. i just use this on my blog bu then remove after few minutes because the count system ain't working at all
  43. Hello !! Satbir bhai
    Posts ko half kese show kerna hai....
  44. not work for me
  45. 1. Facebook Share Button Not working...

    2. Count Not Working

    Cheak My Blog Trickspur.in
  46. Hello!!
    I tried following every step correctly but it doesnt work for me..
    Am I supposed to disable the "Show Share Buttons" in the Layout or not? well i tried both but still not working
  47. By the way, nice tutotial
  48. how to i host the counter please explain
  49. were do i paste the counter code blogger
  50. i am replying you from far away Nigeria, West Africa. all i can say is THANK YOU, IT WORKED ! i write at www.writeshub.com. you can go check it out, it worked, thanks.
  51. hey mate, great tutorial but since we are not hot on php and all that, would you just share how to do the php thing at openshift.com ???

    Because without that, this whole tutorial is incomplete!

    Hope to hear from you soon..... :)
    1. Arshad Amin,
      I am too cool on that :)
      Right now there is little problem occurred in FB and Linkedin buttons and I have to update the codes. I don't know when will i get the time. You can search for it about how to host the PHP codes on OpenShift. You'll find the tutorials on Youtube or on Stackoverflol.

      regards!
  52. THanks bro awesome article
    keep blogging
  53. Bro, i have added that on
    http://www.trippyfeeds.com/2016/02/10-things-you-should-know-about-salman.html
    working fine on desktop, without share counter. it is not showing means icons are not showing in mobile view. help me i am waiting for you. you can also reach me at jaat.vikas.gwl@gmail.com
  54. hi satbir, thank you very much for this tutorial. it works in my blog. but unfortunately, i am unable to show the total count. i am really lost, how do i upload the php script? how do i use openshift. i need your help to show the total count in my blog. please tell me how to deal with total count. my blog at teknografis.com. and my email is harismustofa99@gmail.com. please let me know exactly how to make the total count appear. thanks
  55. counter is not working.......
    and
    can we add it below post title as well as in footer...
  56. Hey bro please check my blog this share buttons can't work in my blog please check and tell me how to fix this and i added this buttons in below post title and also already added in post footer but can't work in both
    www.Techwithloud.com
    1. Hello Pawar,
      You probably have posted the codes in wrong place. They must be working on mobile template.
  57. :) Good work - brother
  58. Thanks for the code bro!

    The total share count used to work fine, but now it is not showing properly.

    Could you pls check for me?

    My blog post: http://www.vittienganh.com/2013/03/unit-1-home-life-cuoc-song-gia-inh-a.html
  59. hi, i can't see any number in share count in my blog, help me pls? Tks buddy
    My blog: http://ivvnblog.blogspot.com
  60. Hi, this is a beautiful share button and I use in my web. But it doesn't work. The number of share doesn't appear. How to fix it? Thank you.

    Can I send email you my website address?
  61. Dear Admin, this horizontal share button works in my site(www.chemenggtips.blogspot.com) just for Facebook, Twitter, Google+ and Pinterest shares but not for LinkedIn share. When I want to share on LinkedIn with this share button, LinkedIn notify me "There was an unexpected problem that prevented us from completing your request.". It should also be mentioned that I can share on LinkedIn with another share button. So what's the problem? Thanks in advance.
  62. thanks sir.
  63. Total share count didn't work at my blog. Where i should put php code. Help me.
  64. Not working....
  65. not working on my blogger i want it on page header .......same widget which is on u r post footer
  66. not working on my website
  67. http://sharecount.twistblogger.com
    https://count.donreach.com/
    http://share-count.appspot.com/

    counter is not working please help me
    1. Muhammad :: I already explained in my article that I was using a free hosting but now users are so much that it exceeds the limit of free hosting within an hour.

      You can upload those scripts yourself free on OpenShift.com or any other paid hosting provider.
  68. Hi Patial, Ive just followed your step by step process to implement this on my blog www.mozentre.com but to no avail. its not appearing. I'm seriously frustrated. Help me out please.
    1. Okolie:: Just checked your template and there is no code added. I guess you might have added it into mobile template. Please read the instructions carefully. Paste the HTML code after the second appearance of footer-line-3 if this is the case.

      Regards!
  69. I'm back again man. I read your articles always, as a matter of fact you are my first point of call for any blogger issues. I even used your sidebar subscription on my page but recently removed it temporarily. Please, I still have the issue of share buttons appearing only on web view. Please help out....Thanks a million, you are the best. www.millerszone.com
  70. Thanks Bro. but it is not showing on my blog as well... any help?
  71. thanks a million!!!!its finally up...pls one more thing, i need it to show in mobile view as most of my visitors prefer mobile view...pls help out. www.millerszone.com
  72. Lovely but not showing on my blog after applicatio. Please help
  73. Hello Satbir Patel,

    Great tutorial. I have implemented a lot of things on to my blog.
    I am having problem with this share. Share buttons are successfully showing at the footer of the post but not on the header of the post. Can you please help me to point out where i went wrong.
  74. Hi satbir, it is not working for me. i follow all steps carefully but it is not showing social share buttons in my blog anywhere... i am using simple grid blogger template, Please help me...
  75. Hi, thanks for your very helpful post! If I want the circular buttons but not the square ones, how do I do that?

    Thanks in advance !
    -max
  76. Thanks again! You are my blogger saviour! :)
    Greetings from Greece!
  77. This Blog is a wonder home to learn many things which i must planning to read all post in this blog....code worked for me

    www.igistright.com
  78. Man, these are simply the best buttons I could find on the internet!
    I just added: border-radius: 3px;
    I just haven't seen the share count?
    Blog: https://maridochef.blogspot.com
  79. Man, these are simply the best buttons I could find on the internet!
  80. Great post ...thanks for sharing ...it work for me
  81. It worked for me, but it shows 11.8k (6.2k for twitter + 3.1k for LinkedIn) Shares for every post. Please look what I have done wrong.
    Thanks in advance

    http://www.rechargians.com/
    1. Shafi Khan :: Hello Buddy,
      I checked your blog and visited the very first article. It is showing the shares as you stated above but when i check manually then there are around 4 shares of that article. I really cant figure out by inspecting elements and i need to check your template code. But Right now am too busy that I could not even update my blog for around 20 days now.

      Please try to remove the codes and do a fresh installation again following all the steps carefully.

      If still not find your way then you can send me your template code on email by using contact form. But I don't really know when will I be able to do check that.

      Regards!
    2. Quick Fix that may work - I found that you are using two different versions of Google JavaScript libraries link on your blog. Please try to remove the old version 1.3.2 and then see if it works for you. Please let me know the results!
    3. I removed the older version and now there are no counts at all. I Will try to solve the issue and if get resolved I will let you know otherwise sending you the template code will be the last option.
      And Forgot to say,
      Thanks, for your quick reply I really appreciate that.
  82. For wordpress? :D
    1. Cheitto :: For Blogger, ONLY :D
      There are countless plugins available for WordPress!
  83. this is my blog Link
    http://www.geekbeing.tk
    1. Hello SID :: After visiting your blog, I inspected the elements but I could not find any code for these icons on your template. You must have removed it. I need to see it live to know why are not they appearing.

      Email me using contact form but you'll get my help after few days. I am little busy these days!

      Regards!
  84. hey bro i followed all steps carefully but can't show share buttons in my blogger please fix this problem
  85. okay, I think I can wait till you are through with the stuff you are working on, but I hope it won't be long. thanks. Please message me when you are through. thanks.
  86. Modester :: Hi, I just checked your blog. You're using a template by PBT.

    Problem one - You added my codes into existing share box designed by developer and that is the first reason those buttons are not appearing correctly.

    Second problem - FontAwesome icons are not working on your blog using HTML plus developer has put own global settings for these icons and they are preventing my icons box from appearing like as on my blog.

    I am a lot of busy with other stuff (designing a template too) and I can only help you after a week or so if you really need it.

    Regards
    1. Hey bro. This widget is not working anymore. Same like your count share above. Any recommendation?
  87. But pls the share count are not appearing, what do i do pls?
  88. Thanks bro, it worked!
  89. hii satbir
    i have a problem ??
    i paste above code step by step as you mentioned but its working on mobile view and not working on computer view :(
    please what can i do???
    check mobile view http://www.latestpicsms.com/2015/08/bollywood-movie-famous-romantic-dialogues.html?m=1
  90. hi, i've addedd your bar to my blog, but i can't see any number in share count in my blog, can you help me? many thanks
    1. Michele :: Hello buddy, So the shares count are not appearing right..? I'll surely help you but please share your blog address or else just use contact form and send me an email. I'll help you add these social buttons personally.

      Regards!
  91. Hello friend, this is amazing really amazing but could you tell me if can I put these buttons at the start of the post. Below the title. Greetings from Mexico.
    1. Sebastian War :: Hello Buddy, I have explained it in the Step 4 about adding these buttons below the Post Title and Footer So please read it carefully and let me know if it worked work you or not.

      Regards!
  92. Again great deeds by you dude !!! Keep it up !!!
    1. Invictus Haxor :: Thanks buddy :)
  93. Hi Satbir,

    You always amaze me with your weekly tutorials. I'm loving all the share buttons you've shared so far. They're all no less than WordPress Plugins.

    Great Job!

    Rohan.
    1. Rohan :: That is all just because of the appreciation and support of my best buddies like you which always pushes me to something more. :)

      Thanks a lot..!!
  94. Awesome article bro. Thanks a lot for sharing. :)
    1. Niladri :: Thanks a lot for your appreciation and welcome to my blog :)
Post a Comment