How to Use Google Web Optimizer in Joomla

Or….. “How to double your website revenue for free”

Let’s assume you have a website that is somehow generating
an income. It might be a shopping cart, it might be email signs ups for an
ebook. Your site will have competitors (enter your keywords in a Google search
to see who they are). How can you be more competitive in that market and have a
more successful site?

The answer: increase your conversion rate.

Jakob Nielsen put this pretty well with his formula for
website success
.

B = V x C x L

Where

  • B = amount of business done by the site
  • V = unique visitors coming to the site
  • C = conversion rate (the percentage of
    visitors who become customers); note that the concept of conversion
    applies not only to ecommerce sites, but to any site where there is
    something you want users to do
  • L = loyalty rate (the degree to which
    customers return to conduct repeat business)

Now, the strategy most webmasters probably think of when
trying to increase "sales" is to go out and get more traffic. But in
many cases, this probably isn’t the best strategy. You can get the same
effect
by doubling your conversion as you can doubling your traffic, and
here is the best part…

Doubling your conversion could be surprisingly easy!

How to Increase your Conversion rate

By testing

That is more or less all there is too it. Site visitors can
respond in very unexpected ways to seemingly small things on a page. The text
of a headline, even the font color of that headline. Tiny changes can be
directly attributed to small gains or losses in your conversion rate.

So how do you know what to change?

You don’t.

Most of the time, the adjustments are not that obvious. Yes,
there are best practices from experts, but often something that is
insignificant to you can make a difference. Sometimes even, counter intuitive.
For example, I recently had a landing page that had a conversion step. When I
took the benefits off it resulted in more conversions/sales. Go
figure.

The only way to increase conversion is thus to exhaustively test
lots of combinations and tweaks to see what works.

Traditionally, this sort of testing has been very expensive
involving complex scripts. More recently however, Google has launched a service
(bundled with adwords) that allows you to test conversion page variations. This
kind of testing is sometimes known as split testing.

The concept is that each site visitor is presented with a variation of a page. A cookie is given so that visitor will always see that variation. The variations themselves are randomly assigned to visitors as they arrive at the site. A conversion is then counted by tracking which of these visitors reach a second page. Statistical trends can then be analyzed of which variations lead to the most conversions.

How to do Split Testing with Joomla

If you are building your site on a small budget, the chances
are you might be using an open source CMS like Joomla. Sometimes integrating a
dynamic CMS into an optimization tool can be difficult. With Joomla, its not
too hard as its possible to run most Javascript Google snippets in Joomla
articles. It’s these snippets that enable the optimization.

Get a Google Adwords Account

If you have the aforementioned ecommerce site, you should
already be using adwords. If you are not, stop reading this now and go and get
one and get more traffic for your site.

Create your Joomla Pages

To measure a conversion you need the visitor to move from
one page to another. This could be your home page and the success page of your
shopping cart. In this example, I am going to use two uncategorized articles,
one is being used as my home page, and the other as a "success page".

Note: I frequently advocate using a single uncategorized article for your home page rather than using Joomla’s Front Page manager.

Turn off Your Editor

We will need to be embedding Javascript into the articles. Very often, editors used in Joomla will strip out critical code syntax. You can either turn off the editor in the global config, or for your current user, or use this trick to Edit HTML in a Joomla Module or Article. You could also upgrade to a commercial editor like WYSIWYGPro that allows you to edit the source on the fly without stripping code. Figure 1 shows the user edit screen and where to turn off the editor.


Figure 1
Turning off the WYSIWYG editor for the administrator

Create a Website Optimizer Experiment

Now that we have our pages ready, we need to set up the experiment. Log into Google Adwords and click on the Website Optimizer link. As an example we are going to set up a "multivariate" experiment.


Figure 2
Selecting the Multivariate Experiment

The Web Optimizer tool then leads us through 5 steps. First is to identify the experiment pages.


Figure 3 – Step 1 of optimizer

We then give our experiment a name and Demeter in our testing pages. Remember, in my example, I am testing the home page so I can just enter the root of the site.


Figure 4 – Identifying test pages

We then get a page that explains the type of testing we are doing.


Figure 5 – Google explains the testing

The last part of planning the experiment is to select how the code will be inserted. The first choice provides a link with instructions. We will be doing it ourselves, so we select "You will install and validate the JavaScript tags".


Figure 6 – Choosing to install the tags ourselves

The next stage is a critical one. We get 4 snippets of code we need to paste into various parts of our testing pages.


Figure 7 – The 4 code blocks to embed in the Joomla articles

The first two, three all go into the page that will be varied (in our case the home page). They are:

  • The control script – top of the article
  • The page sections – in the content of the article as needed
  • The tracking script – at the end of the article

An example is shown in figure 8.


Figure 8 – Inserting the code snippets in the test article

Now we need to insert the last snippet, the conversion script into the success page, shown here in figure 9. Remember this goes into a different article, the one we decided was our success page. If you have a shopping cart, this won’t be an article, but will be somewhere in the extension you are using.


Figure 9 – Inserting the conversion code on the success page

After inserting and saving these code blocks, we need to check they are all present and correct. Click the validate button at the bottom of the web optimizer page.


Figure 10 – Validate button in optimizer

If you are using the current version of Joomla, you will get an error at this point. Joomla 1.5 will interpret some code as a path and break. To get the Google code to work properly, you need to patch one of your files.


Figure 11 – Validation errors


Figure 12 – Validation errors

Thanks go out to Anthony Ferrara for tracking down and fixing the issue here!


http://joomlacode.org/gf/project/joomla … m_id=11844

Here is the patch file associated with the fix.

http://joomlacode.org/gf/download/track … _fix.patch

This patch should probably be included in Joomla around 1.5.5 or 1.5.6.

Now all our code is validating, we click continue and cerate our page sections to test. Note that you can have as many page sections as you want, with as many variations. For clarity sake, I am only testing one variation!

To do this click on the link "Add a new variation".


Figure 13 – Adding a variation

Give your variation a name so you can tell what it is in your reports.


Figure 14 – Name the variation

Then edit the HTML in some way that creates the variation. Note in this example, I put the Google script tags outside the <h3> tag so if I wanted I could vary the heading style as well as the words.


Figure 15 – Editing the variation

Click save (and work through the variations if you have more) and then you can launch the experiment.


Figure 16 – Review and launch

Google will now collect the data and see which variation converts the best.


Figure 17 – Experiment launched

Google Web Optimizer Tricks and Tips

There are probably as many testing strategies as there are tests. One technique I have found useful is to first test very broad variations. Say we have a headline, a call to action, some features and an image. I would put variation blocks around the headline, the features and the image and have them either on or off. This makes 8 (if my math is right) variations. Once I had done this initial coarse test, I’d start playing with the specifics of the blocks themselves.

I hope this has been a helpful introduction to doing split testing with Google web optimizer on Joomla sites. I’d love to hear from anyone who implements it on their site and what results/gains in conversion you get!