eFrog Digital Design |

Hello, lovely tadpoles!

Do you remember our post about adding Twitter Tweet and Facebook Like buttons to your blog? Well, today we have another of these.

Quick, what’s the latest, hottest buzz in social networking and recommendation on the web? That’s right, Google+, the social network. Now, what’s at the center of them circles? The +1 button, that’s what! The little button from the big G, that can propel your content up the search rankings, to get you, and your content, seen. In the words of Google themselves, “+1 buttons let people who love your content recommend it on Google search.”

This is really powerful stuff, folks… Perhaps a little explanation is in order. Say a reader, who we’ll call Nemo, +1′s a post on your blog, for example, about your Bonsai collection. It really was a great post. You wrote passionately about how your collection started, some details of your current prize-winners, what you learned, and you included some gorgeous photo’s. It totally deserved that +1.

Now, one of Nemo’s social contacts, who doesn’t know you, at all, uses a related search term, say “choosing first bonsai”. Because of the social linkage, and the smarts embedded in the search engine algorithms, the +1 recommendation will surface your post, in the results, because of Nemo’s thumbs-up. Of course, if enough folks keep recommending your content, pretty soon, Google is going to take notice, and start considering you a bit of an authority on Bonsai, and move your results up the page, even when someone with NO social connection to you searches for related terms. Ahh, we do so love the smell of SEO in the morning!

All makes sense? Right then, you really should have a +1 button on your blog posts, so let’s do that.

The good folks at Google have a nifty-fifty page that answers all your questions. There are a TON of advanced settings there, but luckily, the really simple default will suit most folks.

There are two parts. Add a line to reference the Javascript that does the magic, and add an instance of the button at the appropriate place on the post. The button will cleverly find the URL to recommend from the Document Object Model. (plain english: Like a tourist on a street corner, the button will look around and find out where it is, by looking at signs and stuff.)

We’ll use our famous Greyzed theme as an example, and we’ll have to edit two files, single.php and footer.php. Remember to back up before editing. (We have a great post on backing up your blog…) No tears, please. And use a plain text editor, like Notepad, or a proper PHP aware editor.

Let’s add the reference to the Javascript, at the end of the footer.php, just before the closing body tag. That means the page will load first (and keep your reader’s attention), before the script. Here’s what it will look like, with the line added:

Great, save that out as footer.php. Now, we’ll add an instance of the button to the actual post, and you’ll find that in single.php. The end of the post, just above the next-previous construct, makes the best sense, in this case. Here’s what it should look like:

Save that out as single.php, and we’re done. Open a post in your browser (you may have to hit refresh) and hey presto! Google +1 awesomeness!

All done.

Now go and create the content that will change the world, like we know you can!
Till next time… *froggyfoot-wave*