Adding a Google+1 Button to your WordPress Site

Adding the Google+1 or Google Plus One button to your website is a really simple task, there’s a line of Javascript which calls in a Javascript file hosted by Google along with the button code itself, which in its simplest form is a short tag as shown below.

<g:plusone></g:plusone>

By default this pulls in the standard Google+1 button and when selected it will Plus One the page URL your currently located on. This isn’t always ideal though, for example on a blog you may have a loop which displays excerpts from multiple posts along with social media buttons, allowing users to easily share the article. Now if the Google+1 button only allows you to share the current URL, when a button is selected for one of the blog posts the URL it will be referencing will be the blog URL itself and not the posts URL. Google+1 has a simple work around for this, by customising the default tag to the following Google+1 gives you the ability to Plus One a specific URL instead of the current URL.

<g:plusone href="http://google.com"></g:plusone>

This can be customised even further to work within the Worpdpress loop rather than using a static URL, by tweaking the targeted URL to reference the posts permalink this can be made to automatically update the target URL within the loop. Below you can see this in practice and it’s literally a case of changing the targeted URL to use the WordPress permalink tag.

<g:plusone href="<?php the_permalink(); ?>></g:plusone>

Don’t forget to place this line of Javascript within your head tag.

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">