Saturday, 3 September 2011

Guide to Install Google Plus 1 to WordPress and Thesis Theme

0 comments
 
Google finally released their new Google Plus 1 Button for Webmasters.

For WordPress users (better for Thesis owners) the process of setting up Google Plus 1 is fairly simple.

Let me show you…


What should you expect?


I just finished installing Google’s +1 button on several of my blogs. But what should you expect?

First, expect the script to increase the load time of your site by at least 1 second. I did a test ontools.pingdom.com and found the load time of my blogs increased by 1-1.5 seconds because of the request to Google each time the button needs to be displayed.

Aside from the load speed issue, all is well. Read on…



How does Google Plus 1 impact SEO?


Google Plus 1 will make it easier for you to find content your friends recommend. It will also give you one more tool in the toolbox for helping spread your content online. Since it is rather easy to setup, the overall impact on SEO is very beneficial. SEO as we know it is changing and this is Google’s reaction to Facebook’s like button.

According to a statement from Matt Cutts from Google:
“The primary benefit is that search gets better. It gets better in the user interface immediately, and we’ll look at it as a potential signal to improve search quality as well. I find social search extremely useful, especially with the recent updates. This change continues the evolution of social search, and it’s a natural progression to improve the search experience.”

Add Google Plus 1 to Thesis Theme


Thesis makes the process of adding Google +1 buttons  super easy.

1. Go here and customize your button. You can choose the size as well as other advanced options.

2. After customizing your button, copy and paste the JavaScript code (reference below) into your Thesis theme. To do this, we need to open Thesis options and paste the code into Stats Software/Scripts.

Thesis>Site Options>Stat and Tracking Scripts. This will place the code before the closing </body> tag.

1
2
<!-- Place this tag in your head or just before your close body tag -->
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>

3. Once the script is installed, copy the button code you customized (there are several sizes and variations to choose) and paste it where you want the code to display.

For me, I have several buttons placed after the byline of each post or page. In Thesis open hooks you could place this code there then style it in CSS.

Here is my sample code:

Update* issues with the button not displaying properly on the blog home page can be resolved by using the updated code. You MUST include the php get_permalink to display accurate + counts.

<li><g:plusone size="medium" href="<?php echo get_permalink($postid); ?>"></g:plusone></li>

Paste this in the “After Headline” Hook

1
2
3
4
5
<div class="social_byline">
<ul>
<li><g:plusone size="medium" href="<?php echo get_permalink($postid); ?>"></g:plusone></li>
</ul>
</div>

note* you could add more <li> items to display other buttons like Twitter and Facebook Buttons.

Then use this CSS to style it:

1
2
3
4
5
6
7
8
9
10
11
.social_byline {
height: 20px;
padding: 5px 0 5px 0;
margin-top: 10px;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}
.social_byline li {
float:left;
list-style: none;
}

Add Google Plus 1 to DiggDigg Plugin


If you are a user of the popular DiggDigg plugin, you might want to add it to your existing button selection. This is an excellent tutorial and article that will help you with this. Add to DiggDigg plugin

Google Plus 1 WordPress Plugin


If you don’t have Thesis or don’t feel like editing your theme files, you can use a plugin. This is one of the highest rated WordPress plugins that integrates Google Plus 1. You can download it here.

Google Plus 1 a URL with Advanced Options


Use the Advanced options for Google Plus 1. Add URL to +1 http://www.google.com/webmasters/+1/button/index.html

What this will do is Plus 1 a specific URL. You could place this in the sidebar of your blog and have users +1 your root domain/url.

Signup for the Google +1 Experiment (serps)


Be sure to join the Google Plus 1 experiment here so that you can test out the +1 functionality in Google’s serps. This will allow you to see what your friends are recommending so that Google can custom tailor the results based on friend recommendations. You will also see the Google Plus one icon next to each set of search results.

Leave a Reply

Related Posts Plugin for WordPress, Blogger...