Making a Simple Google +1 Plugin

Google recently releases its Plus One service, and, as usual, dozens of people immediately made WordPress plugins utilizing it. Google Traffic Pop by Tyler Quinn is an excellent example. In this tutorial, I’m going to demonstrate how to make a (very simple) Google +1 plugin for WordPress.

First, you need to create your plugin file (I named mine simple-google-plus-one.php) and place the necessary plugin header code inside it.

1
2
3
4
5
6
7
8
9

<?php
/*
Plugin Name: Simple Google +1 Button
Plugin URI: http://pippinsplugins.commaking-a-simple-google-1-plugin
Description: Adds a Google +1 Button to your posts and pages
Version: 1.0
Author: Pippin Williamson
Author URI: http://184.173.226.218/~pippin
*/

This will make your plugin available to WordPress. Next, we will write a quick function that will load the javascript for the button from Google.

1
2
3
4

function simple_google_plus_one_script() {
	wp_enqueue_script('plusone', 'https://apis.google.com/js/plusone.js');
}
add_action('init', 'simple_google_plus_one_script');

Note the add_action() hook at the bottom. This activates the function (and its contents) when WordPress loads.

And the last part is to write a function that will render the button HTML.

1
2
3
4
5
6
7

function simple_google_plus_one_button($content) {
	if(is_single()) {
		$content .= '<div class="google-plus-one" style="margin: 10px 0;"><g:plusone></g:plusone></div>';
	}
	return $content;
}
add_filter('the_content', 'simple_google_plus_one_button');

I’ve placed the code provided by Google inside of a DIV with a class and an inline style to provide it a little bit of a margin.

Now when you activate the plugin, you will see the Google +1 button rendered at the bottom of your post!

Download the complete plugin below.

Change Log

7-6-11: Adding is_single() conditional so that +1 button only shows up 
on single post pages.

Enjoy!