Beginner's Guide for WordPress - Start your WordPress Blog in minutes.
Choosing the Best
WordPress Hosting
How to Easily
Install WordPress
Recommended
WordPress Plugins
View all Guides

How to Add Google+ “Add to Circles” Badge in your WordPress Site

Last updated on by
Follow WPBeginner on YouTube
How to Add Google+ “Add to Circles” Badge in your WordPress Site

Recently, one of our users asked us how they can add the Google+ “Add to Circles” Badge in their WordPress site. In the past, we have shown you how to add the Google +1 Button your WordPress Posts. In this article, we will show you how to add the Google+ “Add to Circles” Badge in your WordPress site.

Preview of how a Google+ Badge looks like:

Google+ Add to Circles Badge

Before we begin, you should note that this is only for Google+ Pages not profiles. Example of Google+ Page. Example of Google+ Profile.

First thing you need to do is put the following code in your <head> section of your site which you can modify by editing the header.php file of your theme.

<link href="https://plus.google.com/{plusPageID}" rel="publisher" /><script type="text/javascript">
(function() 
{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>

Don’t forget to replace the {plusPageID} with your Google+ Page ID. Your Page ID is a 21-digit string at the end of the URL. For example if your page URL is: https://plus.google.com/101634180904808003404/ then the numbers in bold is your Page ID.

Once you have added the header code, then all you have to do is place the following code wherever you want the Google+ Add to Circles widget to show. Most users like to display this in their sidebar, so you can either modify your sidebar.php file, or simply add it in a text widget area.

<g:plus href="https://plus.google.com/{plusPageID}" size="badge"></g:plus>

For the Small badge, simply use this code:

<g:plus href="https://plus.google.com/101634180904808003404" size="smallbadge"></g:plus>

We hope that this article has helped you. If it did, then please consider adding WPBeginner in your Circle.


Editorial Staff at WPBeginner is a team of WordPress lovers led by Syed Balkhi. Page maintained by Syed Balkhi.

WPBeginner's Video Icon
Our HD-Quality tutorial videos for WordPress Beginners will teach you how to use WordPress to create and manage your own website in about an hour. Get started now »
  • GiorgiaB

    So…this tutorial is for WP free version?

    • http://www.wpbeginner.com/ WPBeginner Support

      Yes it is.

  • Carol Dunnigan

    Disregard my last comment! I hadn’t realized that you responded to me OTHER one. I thought I had hit ‘email when a reply’. Sorry again.

  • Carol Dunnigan

    Hey there! I take it you have to have the upgraded version of wp and not the free one to do this? Bummer. I had blogspot and am getting rid of my smugmug site to simplify things. I hate working with codes.

    I was able to put a fb badge in a widget. That’s not possible with g+? :(

  • Lee Sonneville

    Thank you for explaining this to me. Seriously, it took hours to figure out exactly where to put this code in WordPress, until I read this. Google just gives you the code, but don’t give any real instructions as to where to paste the code. I didn’t understand it had to go in two different places for it to work. Thanks!

  • Carol Dunnigan

    Getting frustrated searching the web on this one. I’m guessing that with the free version of WP this is not possible?

  • http://bkmacdaddy.com/ bkmacdaddy

    FYI, I’ve just finished a plugin for WordPress that enables you to add a Google+ badge just like this anywhere on your site using a widget, shortcode, or a template tag in your theme files. Yoou can download it here: http://wordpress.org/extend/plugins/google-page-badge/

    Hope it helps people out who don’t feel comfortable coding (in the way that is so wonderfully explained in this article).