Split Testing with WordPress Themes

As many of you know, we love conversion rate optimization and split testing at CategoryCode. We have a great set of tools that allows us to setup and track our A/B tests to constantly increase performance on our landing pages and marketing campaigns.

This past year we found a new tool, rather a WordPress plugin, that we have added to our tool set. The plugin is SES Split Testing Plugin. We found this plugin when we were required to run a split test on a WordPress website. Our client had a completely built website and we were making modifications to the design which we wanted test. We created a new template which contained a number of our changes such as revised header and navigation, and much more.

The SES Split Testing Plugin allowed us to run an A/B Split Test in combination with Google Analytics and Custom Segments!

How to Setup a Split Test with WordPress and SES

  1. Create 2 or more WordPress themes you’d like to test
  2. Install the Plugin
  3. Select themes you’d like to test in plugin settings
  4. Define custom segments in Google Analytics
  5. Track performance in Google Analytics
  6. Declare winner!

Note; You will need Google Analytics setup and installed on your WordPress website.

In Google Analytics you will need to setup the custom segments. Custom Segments are ways of categorizing and tracking website visitors. You will base them on a “User Defined Value”, the value will be the name of each theme folder. The SES Split Testing Plugin is very handy in that when a specific theme is being used it tags that visitor with the value of the theme name.

Once you have the segments configured in analytics it will start tracking data (may take a day to show). You can now view all of your Google Analytics data and see important stats such as Goal Completions and compare your themes.

Once your have collected ample amount of data, you can declare a winner, deactivate the plugin, then use the winning theme!

Update: Interested in more split testing tools? Look into Google Content Experiments.

» Looking to increase your ROI with Split Testing? Contact us today to find out how we can help!

CRO Tips Part 3: Don’t Be Afraid to Show a Related Face or Emotion Behind the Company

The Problem

I often see clients who have perfected their sales pitch when discussing it one-on-one. They can dazzle, impress and have you begging to buy their product. Their terrific sales people, but their expertise is lost online. Some may argue this may be the difference between sales and marketing, but I believe it’s a message being lost in translation across two mediums.

Check out our post on Face to Face Marketing.

It’s true, a conversation on a website is much more one sided than a conversation in person. When planning websites, clients will focus on developing their message, and sales points, but don’t take into consideration of showing the face behind their company. The one-on-one personal contact is lost. Sales points and persuasion mean nothing when I’m looking, at best, a smiling stock photo that people have seen 1000 times prior.

Finding a Solution

How do you combat this problem and display who you are to your audience? It’s difficult to create that connection online the same way you can in person. There are several in the box methods of using graphic design to cheaply integrate a human element, but they typically lack in performance.

  1. The first is by adding features such as twitter feeds, and requests to “like a company on facebook”, but users are usually bombarded with these messages on a daily basis that they’re often ignored.
  2. Second is posting staff photo or adding a message from the president to a site. This seems to be obvious solution, however users usually respond with “who’s the suit, and why should I care to read what he’s saying”.
  3. Third, I’ve seen an implementation of live chat features which can create an instant conversation, but once again relies on the user to be curious enough to ask questions.

A Great Example

The campaign created by DDB Canada for Knorr is a perfect example of how a company created a character that we can all appeal too. Watch the video below to learn about the campaign:

Although many small clients may not have the budgets for large campaigns as Knorr, it’s a perfect example of how they created an emotional connection, something unique rather than a simple “Like Us on Facebook” button.

From a graphic design standpoint, you may be thinking that these elements should be handled by a marketing department, and you may only have as much freedom as deciding which photos to use. But as creative types, don’t be afraid to push the envelope.

For small brick and mortar businesses, don’t be afraid to use that as a launching point. Simple ideas such as changing a call to action to “Let’s us buy you a coffee and talk about engagement” or “Talk to Richard about your indoor plumbing” might just open the door to dialogue in a 1 on 1 meeting. Taking advantage of videos may be a great way to introduce a client to your company and help establish credibility and trust.

How We’ve Achieved Success

At CategoryCode, we ran a similar test for and Edmonton-based real estate team – Robert F. McLeod Realty. Their existing landing page had no images of faces, or even who Robert McLeod was. To make matters worse, the images on the page were facing away from the users or headline.

Old robermcleod.ca website

The owner of the company – Robert McLeod, was the brand. We needed to showcase this, establish a connection with users, similar to the one he’d create in person.

With a few images and graphic design tweaks we were able to develop a new landing page that better showcased the company and most of all who Robert McLeod was.

CategoryCode Redesign of www.robermcleod.ca

The Result

The results were a grand slam for conversions. Without any copy changes, we were able to produce a 304% increase in quality leads.

If you are interested in learning more about what we did for the Robert F. McLeod Realty Team, please view our Case Study.

Tracking Google Website Optimizer Conversions Using AJAX Forms

We recently ran into an issue with tracking Google Website Optimizer Conversions when using a form that submits using AJAX with no page refresh. Typically you place Google Website Optimizer’s conversion code on your “Thank you” page but we needed a solution that worked when using AJAX.

We found the solution and we hope it provides you some help to!

The Issue – Tracking conversions using AJAX and no conversion page

If you have used Google Website Optimizer you are aware that you need a page that is the “Control Page” then you need a “Conversion Page”. Now we were doing Landing Page Optimization and we were testing out headlines on a lead form. However we processed the form with AJAX so upon successful submission the user was simply presented with a thank you message rather than being directed to a thank you page.

We were using AJAX to submit the form using the following process:

  • Javascript validates form upon submission
  • Posts to PHP file
  • PHP file returns if message was sent or not
  • If successful, display thank you message

Note: our process is more in depth but this is an overview.

Now this all happens with the user never leaving the page, never going to a stand-alone “Conversion Page” so we were left without the ability to track conversions for our test.

Typical GWO (Google Website Optimizer) Conversion Code

<script type="text/javascript">
      var _gaq = _gaq || [];
      _gaq.push(['gwo._setAccount', 'UA-XXXXXXXX-X']);
      _gaq.push(['gwo._trackPageview', '/XXXXXXXXXX/goal']);
      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
      })();
    </script>


Replace the X’s with the information from your tracking code.

The Solution

Now, we can make 2 calls from the javascript file to make this all work. In our script.js file we check the response from the php file, if it was successful we display the thank you message. Now you can also add the Conversion code as follows:

_gaq.push(['gwo._setAccount', 'UA-XXXXXXXX-X']);
_gaq.push(['gwo._trackPageview', '/XXXXXXXXXX/goal']);


Replace the X’s with the information from your tracking code.

Adding those 2 lines from the Conversion code is all that is needed. If you review the rest of the code, you will notice it is all included in the standard Google Analytics Tracking Code so you do not need to repeat it.

Once you add that to your javascript, upon successful submission it triggers the “__gaq.push” javascript and tracks the Goals in Google Website Optimizer. Tried, Tested and True!

CRO Tips Part 1: Don’t over clutter the area Above the Fold

Graphic designers often have a bad reputation when it comes to conversions. One of my favourite quotes to demonstrate this point is from Tim Ash. Tim claims one of the easiest ways to improve conversions is to “Shoot your graphic designer in the head”.

As a graphic designer, this quote is the reason I lock my door at night. But as a web marketer, I completely understand this frustration. Graphic designers tend to consider themselves as creative, and tend to go overboard to make their work standout, and reflect who their personality. Plus, it’s more entertaining than just “production work” .

As a result, I’ve created a list of graphic design rules for conversions that I will be featuring. I will be posting them one at a time to give you time to adjust your page, and test out these rules one at a time to get a result.

It’s important to remember that like every other graphic design rule, take it with a grain of salt. Websites are delicate, and although these rules may work for some elements, it may conflict with others or may mess what’s working on your page right now. Keep in mind that you should always split test any changes to your site and that you’re only limited by your imagination.

Part 1: Don’t over clutter the area Above the Fold

As a graphic designer, we all have horror stories of bad clients. My horror story has to deal with a stubborn client who wanted to keep “everything above the fold”.

This included:

  • A money-back guarantee
  • Free shipping notice
  • Headline
  • Unique sales proposition
  • Video
  • 5 selling points
  • Savings calculator
  • Contact form
  • Warranty information
  • Incentive to buy
  • Navigation bar
  • and a live chat button

Despite my attempts to rationalize with the client, the amount of information they wanted above the fold started a competition for eye traffic. Some users saw the savings calculator, while others saw the video, but none grasped all the elements, or the complete story of the company. Even worse, the headline had to be shrunk so small, that nobody saw the unique value proposition.

Consider your above the fold as a 5 second movie trailer to your company. On a good landing page, your above the fold should clearly answer three things within 5 seconds:

  1. “where am I”
  2. “what can I do here”
  3. and “why should I do it?”

2 of these points (where am I, and why should I do) can be answered within a strong headline that states the value proposition. For Example “With over 32,000 international moves a year, XYZ moving company is your destination for large scale moves. Who being XYZ moving, and why, because of their experience.

The 3rd third point (what can I do here) I typically place on a call to action above the fold, as it typically solves what you can do on the site, and typically sums up the metric of a conversion. “Click here to book your move” or “Click here to download your ebook” as an example.

Summary

The website nightmare I faced could have been easily fixed by establishing an eyepath that encouraged the user down the page, where the rest of the information could have been placed. Although having a promising product, sadly the company’s online sales were less than expected.

  1. Contact us today to see how we can help with your next project or to get a free quote.