How To Add Google + Page Badge To Your Blog

Now that you’ve created a
 Google + page for your blog,
 grow your audience by adding
a badge onto the blog. The badge
lets users add your Google+ page to
 their circles without leaving your blog,

similar to Facebook’s Like Box, but better. Google+ badge will not only promote your blog on Google+ (social network), but will help it rank in Google search results as well.

Below are some more reasons why you would want to put up Google+ badge on your blog:

• It gives users more personal recommendations around the web, by connecting +1’s for your blog with +1’s on your Google+ page.
• It may qualify your page for Google+ Direct Connect, which helps users find your Google+ page and lets them add it to their circles directly from within Google Search.
• If you’re on Google Friend Connect, now is a good time to start bringing your GFC followers to your Google+ page because Google are retiring GFC (for all non-Blogger sites) on March 1, 2012.

I) Adding Google+ badge

• Adding to Blogger
  1. Go to Design > Page Elements.
  2. Click Add A Gadget and select HTML/Javascript gadget.
  3. Copy the code below and paste it inside the content box. 
     
     view sourceprint?

     01	<!-- Google +1 script -->

     02	<script type="text/javascript">

     03	(function() {

     04	var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;

     05	po.src = 'https://apis.google.com/js/plusone.js';

     06	var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);

     07

     })();

     08

     </script>

     09	<!-- Link blog to Google+ page -->

     10	<a style='display: block; height: 0;' href="PUT YOUR G+ PAGE URL HERE" rel="publisher">&nbsp;</a>

     11	<!-- Google +1 Page badge -->

     12	<g:plus href="PUT YOUR G+ PAGE URL HERE" size="badge"></g:plus>

  • Omit the Google +1 script (line 1 to 8) if you already have a Google+1 button on your your blog.
  • Replace PUT YOUR G+ PAGE URL HERE with the URL of your Google+ page.
    To get the page URL: Login to Google+ > Switch to your page via the dropdown menu on top left corner of your screen right under your profile name > Get the URL from your browser’s address bar.
• Adding to WordPress
  1. Go to Dashboard > Appearance > Widgets > Available Widgets.
  2. Drag Text widget into a sidebar.
  3. Paste in the code.
  4. Save.

II) Customizing

Currently you can only customize the size of the badge,  by setting the size attribute on the badge tag in line 12.

Size	Badge	Size attribute
Big		badge
Small		smallbadge

Note: If your Google + page name is short enough, the “We’re on” phrase in front of the red G+ button will be replaced by  “[PageName] on”.

Enjoy!