How To Add Google+ Follower Gadget in WordPress Blog

Advertisements
Yesterday, Google introduced yet another Google+ perk, the Google+ Follower widget for Blogger Platform. The main idea behind this new gadget is to build a strong relationship between views and the Blog owners so they can easily interact either via Google+ Stream on the blog. This is the reason why this widget is highly appreciated by all the bloggers community because it has the spark that a perfect widget demands. On the other hand, WordPress users were a bit disappointed because this widget can only be applied to Blogger Enabled websites. However, now WordPress Users can cheer with joy because today in this article, we will share a simplest technique that How to Add Google+ Follower Gadget in WordPress Enabled Websites.

How To Add Google+ Follower Gadget in WordPress.

Before, we continue towards our Tutorial I would like to clear one thing that there is no rocket science behind this gadget. It is built with modest HTML and JavaScript coding which is design by Google’s Developers, we have just derived the coding and made it compatible for WordPress. Follow the Following instructions in order to add this gadget in WordPress. (Remember: the following tutorial can also be applied on Blogger or any other Platform because it’s a modest JavaScript coding).

  • First Login to your WordPress Admin Panel (i.e. www.mybloggerlab.com/wp-admin). 
  • Then Select >> Appearance >> Widgets >>TEXT (Arbitrary text or HTML).
  • Now In the HTML box Paste the following HTML and CSS Coding. Remember: Don’t forget to replace Google+ Profile URL i.e. https://plus.google.com/106374439082237286396. People can use either Profile or Page URLS according to their desire needs.
<div class="g-plus" data-action="followers" data-height="300" data-href="https://plus.google.com/106374439082237286396" data-source="blogger:blog:followers" data-width="320">
</div>
<script type="text/javascript">
      (function() {
        window.___gcfg = {'lang': 'en'};
        var po = document.createElement('script');
        po.type = 'text/javascript';
        po.async = true;
        po.src = 'https://apis.google.com/js/plusone.js';
        var s = document.getElementsByTagName('script')[0];
        s.parentNode.insertBefore(po, s);
      })();
    </script>

All Done: After pasting the coding just Press the “Save” button”. Is that easier? Indeed it was. Now go ahead and check your website. We’re pretty sure it wouldn’t let your site look yucky. 

If anyone wants to adjust the Widget of this gadget, then just replace "320" according to the desire needs. As per for Height, replace "300". Remember: Don't use PX (pixel) with the width and height otherwise it wouldn't work.

From the Editor’s Desk:

Now neither WordPress nor any other Platform users can complain that they cannot use this Follower widget on their website. However, this gadget is still extremely new, so it wouldn’t look that elegant, but in the near future we would share some highly customized Google+ Follower widget. What are your thoughts? Does this widget deserve a five star ranking? Give your precious reviews and views via commenting till then take a lot care of your health Peace, Blessings and Happy Googling. 
Advertisements

The Editorial Team of MyBloggerLab consists of a group of Professional Blogger geeks Led by Syed Faizan Ali (Founder of MyBloggerLab).

Comment With:
OR
Choose Wisely!

13 comments

December 3, 2012 at 3:20 AM

nice thanks for sharing dear :)

InfoTech Pakistan

December 3, 2012 at 12:44 PM

Great post .....thanks for this information

All Blogging Tools

December 7, 2012 at 5:18 AM

Thank yo so much for this! I have been looking for ways to do this ever since my GFC followers disappeared. I have also linked to your post in my own blog-post about it.

Editorial Team MOD
December 7, 2012 at 5:55 AM

Oh, We are glad that you liked out Tutorial. Thanks for being so generous and giving a Link Back. Hope to See you again. Peace

February 20, 2013 at 11:06 AM

Does this work only on wordpress.org?
I tried on my wordpress.com blog and it came out looking like code on my page.
I went back and looked at the widget and it looks like it's pulling out some of the code, like the script portion.

Editorial Team MOD
February 20, 2013 at 11:29 AM

Yeah, it should work because its just a simple piece of Coding!

February 20, 2013 at 3:10 PM

I pasted in the code exactly as you said. I replaced the google+ profile portion just like you said. I saved it.
When I open it back up it looks different. Wordpress.com appears to be removing some of the code.

Your idea is brilliant. I'd love to have it on my blog.

If you or someone figures this out please google+ me.

April 19, 2013 at 4:34 AM

I just added this to my site and it worked great! Thanks so much for this info. I also sent out a blog about it and shared it in G+

Question: Can I add a G+ comments box to my website also?

June 19, 2013 at 7:51 PM

The same thing is happening to me as well. I pasted the code in the text widget and changed the Google+ url to my own. Am I doing something wrong?

I'd love to have this widget on my blog. Please help if you can.

September 23, 2013 at 11:40 AM

Thank you so much!

April 9, 2014 at 1:28 AM

Thank you..!! your trick really works...!!

April 9, 2014 at 1:57 AM
January 10, 2015 at 11:19 PM

Nope, does not work.
What did you mean by 'replace Google + url'?
I just copy-pasted the given HTML into Text Widget. But it did not work.

Post a Comment

We’re eager to see your comment. However, Please Keep in mind that all comments are moderated manually by our human reviewers according to our comment policy, and all the links are nofollow. Using Keywords in the name field area is forbidden. Let’s enjoy a personal and evocative conversation.

Helping You to do Cool Things With Blogger Since 2012™.

© Copyright 2012 - 2016. MBL Networks, All Rights are Strictly Reserved.