Show Mobile Navigation

Google Plus Followers Widget For Blogger (Customized)

Hemant Verma - 9:56 PM

In the some past days Google Officially Announce their Google Plus Follower Badge for Websites/Blogs etc like Facebook, Twitter etc. and this widget looks like a General Facebook Like box but in place of Facebook Like button, you will see a Follow button instead of Like button and it works very awesomely and give a feel of pro blog.
Therefore, connecting your blog with Google Plus is an ideal way of magnetizing more new readers, as well as building a strong relationship with your followers. For Example, when a person shared his post on Google+ then, it will send messages to all the followers about that latest post which will increase the viewership. For that reason Today, Google officially released yet another Google plus Perk: The follower gadget (only for BlogSpot enabled websites). Today in this article, we will learn more about the Google+ Follower Gadget and will also learn how to integrate it in our Blogger site.

Add Google Plus Followers Widget

  • Login to Blogger 
  • Fill the details in below generator.
  • Click on Generate Button
  • Copy that generated code.
  • Paste in HTML/JavaScript Widget OR paste that code where you want to show it.





If Any Problem Comes, Ask in Comments


53 comments:

  1. bro where is the post related to my request ?? plz do it ASAP ...

    ReplyDelete
  2. bro where is the post related to my request ?? plz do it ASAP ...

    ReplyDelete
  3. See my blog bro ...it has a problem ..that only the first post can be seen full length but at the rest READ MORE is written plz fix it ...
    My blog: www.androidcentre.tk
    Thanks in advance

    ReplyDelete
  4. See my blog bro ...it has a problem ..that only the first post can be seen full length but at the rest READ MORE is written plz fix it ...
    My blog: www.androidcentre.tk
    Thanks in advance

    ReplyDelete
  5. @Saumitra YadavFollow Steps---

    1. Go to Blogger Dashboard
    2. Click on DropDown Menu and select Template
    3. Backup your Template before making any changes to your blog
    4. Now Click on Edit HTML --> Proceed --> Expand Widget Templates
    5. Press Ctrl + F and search the code shown below.

    </head>

    6. Copy the code shown below and paste it Before/above </head>

    <script type='text/javascript'>
    //<![CDATA[
    function removeHtmlTag(a,b){if(a.indexOf("<")!=-1){var s=a.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length)}}a=s.join("")}b=(b<a.length-1)?b:a.length-2;while(a.charAt(b-1)!=' '&&a.indexOf(' ',b)!=-1)b++;a=a.substring(0,b-1);return a+'...'}function createSummaryAndThumb(a){var b=document.getElementById(a);var c="";var d=b.getElementsByTagName("img");var e=summary_noimg;if(d.length>=1){c='<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+d[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var f=c+'<div>'+removeHtmlTag(b.innerHTML,e)+'</div>';b.innerHTML=f}
    //]]>
    </script>
    <script type='text/javascript'>
    summary_noimg = 550;
    summary_img = 450;
    img_thumb_height = 150;
    img_thumb_width = 200;
    </script>

    7. Now find the code shown below

    <data:post.body/>

    8. Replace it with the code shown below.

    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <data:post.body/>
    <b:else/>
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
    <data:post.body/>
    <b:else/>
    <div expr:id='&quot;summary&quot; + data:post.id'>
    <data:post.body/>
    </div>
    <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
    <div style='clear: both;'/>
    <span class='rmlink' style='font-weight:bold;padding:6px;float:right;text-align:right;'><a expr:href='data:post.url' >Read more</a></span>
    </b:if>
    </b:if>

    9. Now save your template

    And You Are Done.

    ReplyDelete
  6. @Saumitra YadavYour always Most Welcome.

    If you like it then subscribe us for daily updates.


    Thanks & Regards,
    Hemant Verma

    ReplyDelete
  7. Is this template is available for free download ? Asking because I have already seen this template before on 2 blogs and now in yours and all the blog has different author. So is it is available for free ?

    ReplyDelete
  8. its still not working bro ... what to do ? You only see whats happening you are admin of my blog.. plz see to it ?

    ReplyDelete
  9. @Rounak BaralNo, be'coz I designed it myself and I don't know about others.
    Sorry.

    ReplyDelete
  10. @Saumitra YadavI'm not admin of your blog. I removed myself as a admin.

    ReplyDelete
  11. @Deep SinhaThanks for your appreciation.

    Keep Stay Tune With Us.
    Kindly Subscribe Us and Get Daily Updates Via Mail.

    ReplyDelete
  12. truly amazing hemant

    may i get this generator?

    ReplyDelete
  13. @Rajat GargSure but first u have to subscribe us and like our fan page on fb and after it write your e-mail id. then template will be mailed u.

    ReplyDelete
  14. @Rajat GargIf you want to create generators then you have to gain knowledge about javascript. and there is no trick to create generators. You only have to gain knowledge and learn javascript then you can create it.


    Thanks and Regards,
    Hemant Verma

    ReplyDelete
  15. @Rajat Garg Download it from here https://sites.google.com/site/templatedownloadzone/home/My%20Blogger%20Tools%20template%20by%20truebloggertricks.zip?attredirects=0&d=1

    ReplyDelete
  16. @Jigar Teoitayou have to subscribe us and like our fb fan page and write your id in comments and after approval i'll send u codes.

    and Thanks for your interest.

    ReplyDelete
  17. Nice post
    All the best working computer tricks http://www.infoexpo.in
    Explore the world of technology...

    www.InfoExpo.in

    ReplyDelete
  18. Bro i want a popular series like yours. Where can i get it?

    ReplyDelete
  19. @azad hussainFirst of Fall Thanks to like our content and for your comment. but I didn't understand which series you are saying?

    ReplyDelete
  20. @azad hussainLook at this post, this is different than our but it works same and like our expand widget.

    Add a Expand-Collapse Widget

    ReplyDelete
  21. Thanks For The Good Post, Really impressed by your blog.

    ReplyDelete
  22. @Rajat Gargdude I know and where you saw the clone of my templte, that is not same be'coz block quote and other many plugins designed by me. and if you don't want anything then don't waste your time.

    Be'coz we don't copy content like you.


    bye the way Thanks for your interest.

    ReplyDelete
  23. @Hemant Verma
    Look at this image http://3.bp.blogspot.com/-IiSPtX3zQd8/UNq8nVLSJgI/AAAAAAAAZTg/LGG1T55uyj8/s1600/dropdown.png and i want like this. Sidebar one is affecting content section. Can you share this?

    ReplyDelete
  24. @azad hussainYes I'll share this widget soon and I already noted your request bro, don't worry.

    Just Keep stay with us.

    ReplyDelete
  25. What an amazing widget! Thank you so much for this tutorial :)

    ReplyDelete
  26. @Hemant Verma
    Thnx bro please do it. I am waiting from long time...

    ReplyDelete
  27. can u tell me how to add that "If Any Problem Comes, Ask in Comments" effect

    ReplyDelete
  28. @Hari kesh Ya Sure Why not?


    Follow Below Steps.....!

    1.) Paste below Code before ]]></b:skin>

    .post h1 {
    background: #1F8399;
    font-family: Verdana;
    padding: 10px;
    color: #fff;
    font-size: 20px;
    -webkit-border-radius: 0px 10px 0px 10px;
    border-radius: 0px 10px 0px 10px;
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -ms-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
    }

    .post h1:hover {
    background: #454545;
    font-family: Verdana;
    color: #fff;
    text-shadow: 4px 4px 10px #f4fff2;
    filter: dropshadow(color=#f4fff2, offx=2, offy=2);
    border: 4px double #FFCFE2;
    -webkit-border-radius: 10px 0px 10px 0px;
    border-radius: 10px 0px 10px 0px;
    -webkit-box-shadow: 3px 3px 10px 1px #C72C6A;
    box-shadow: 3px 3px 10px 1px #1F8399;

    2.) Save your template.
    3.) Use below tag to use it in post.

    <h1>Write Your Text Here</h1>


    <i>Replace Write Your Text Here with Your own text
    </i>

    ReplyDelete
  29. Thanks, It works great!!

    ReplyDelete
  30. When some one searches for his vital thing, therefore he/she wishes to
    be available that in detail, thus that thing is maintained over here.
    Also see my webpage > ways to Make money online from home

    ReplyDelete
  31. I am actually thankful to the owner of this web site who has shared this fantastic post at
    at this time.
    my webpage > fast way to make money

    ReplyDelete
  32. What's up mates, its fantastic article on the topic of tutoringand entirely defined, keep it up all the time.
    Feel free to visit my weblog :: slot machine tips

    ReplyDelete
  33. Currently it looks like Drupal is the preferred blogging platform
    out there right now. (from what I've read) Is that what you're using on your blog?
    My web page :: ways to make money quick

    ReplyDelete
  34. @boluinxanYour Most Welcome Sir.

    Thanks & Regards,
    Hemant Verma

    ReplyDelete
  35. @Nikhil PhirkeYour Most Welcome Sir.

    Thanks & Regards,
    Hemant Verma

    ReplyDelete
  36. Would you be interested in exchanging links or maybe guest writing a blog article or
    vice-versa? My blog discusses a lot of the same subjects as yours and I think we
    could greatly benefit from each other. If you happen to be interested feel free to shoot me
    an email. I look forward to hearing from you! Superb blog by the
    way!
    fix CSS and html error

    ReplyDelete
  37. worked perfectly well and very easy:) Thanks!! But how do I format the code to insert a border and have a white background instead of transparent background?

    ReplyDelete
  38. Hello, first congratulations for your post!

    Recently I created a version of Google Plus +1 Box, like Facebook Like Box, you can configure and get the code here:http://bit.ly/gplusbox

    See you

    Igor Musardo http://musardos.com.br

    ReplyDelete
  39. thanks for your awesome google plus badge widget really great.

    ReplyDelete
  40. BRO!HOW CAN I ADD TWITTER, FACEBOOK AND DIGG HOUSE BUTTONS IN MY BLOG JUST LIKE YOU HAVE?PLEASE HELP!

    ReplyDelete
  41. @uzair iqbalWe will share it soon just only keep in touch, and subscribe our feeds and get updates direct in your email box

    ReplyDelete
  42. hey you copy this from the makingdifferent.
    copycat.................

    ReplyDelete
  43. thanks bro... i dont know how to say tahnks you very much for you..

    ReplyDelete


  44. Congratulation to Get Social Exposure, We are the world's leading supplier of SocialMedia Services.Buy FacebookLikes and Fans, Twitter Followers,
    Google Plus Ones, YouTube Views, Instagram Followers and Pinterest Followers.


    buy twitter followers
    buy youtube views
    buy google plus ones
    buy instagram followers

    ReplyDelete
  45. The main flaw with twitter is that for you reach many people, you need to have many followers.

    ReplyDelete

You may use these HTML tags and attributes: <a href="" title=""> </a> <b> </b><strong> </strong>

 



Make Your Blog Like a Pro
About | Contact | Affiliates | Privacy Policy | TOS