In web development and marketing, A/B testing or split testing is an experimental approach to web design (especially user experience design), which aims to identify changes to web pages that increase or maximize an outcome of interest (e.g., click-through rate for a banner advertisement). As the name implies, two versions (A and B) are compared, which are identical except for one variation that might impact a user’s behavior. Version A might be the currently used version, while Version B is modified in some respect. Significant improvements can be seen through testing elements like copy text, layouts, images and colors.

Google Content Experiments (integrated into Google Analytics) is a widely used tool for A/B testing. You can define up to five different pages and Content Experiments can track which page is working best to achieving your goal. Your goal can be to take the user to specific page to make a purchase, watch a video, keep the user active on a site for longer time or something else. Content Experiments helps us to quickly identify the most promising landing page among the set of pages, that can boost up the “conversion rate”. Also, once the threshold is reached Content Experiments will take all users to that most promising page (called winner page).

Recently for one of our clients I needed to integrate Content Experiments with Liferay. After some research and experimentation, I managed to get it to work and this blog post is a how-to guide on integrating Google Content Experiments (GCE) with Liferay.

Before starting with  GCE-LR Integration, make sure you have Google Analytics account setup. Below are high level steps that need to be performed.

  1. Create Pages.
    1. Lets say you are trying to sell a product and you have created three-four kinds of advertisements. You want to figure out which one works best. In A/B testing you would create variance pages. Each variance page would contain one advertisement.
    2. Second you will create an “original page”. This is not actually a page that end user would see. However the URL of “original page” is what will be used in emails, cross site links and other places. GCE will redirect user from “original page” to “variance page.”
    3. Create a “goal page.”  This is optional. The goal page can be the page where user actually makes a payment. If your goal is just to keep user active for longer time then you may not need GOAL page.
  2. Generate the Google Analytics tracking code from Google Analytics site and place the generated JavaScript code on the pages you created in step 1, including GOAL page.
  3. Create a new ‘experiment’. Specify the pages in the “Original page” and “Variation pages” URLs. You will need to add “strip=0” parameter at the end of URLs.
  4. Specify the goal and place the experiment script generated by google into the “Original” page.
  5. Google will verify that the javascript code is added correctly.
  6. Start the experiment in GCE so that it can redirect site visitors from original page to various variance pages.

Let’s look at in detail to each of the above steps. Here I have created an experiment where the GOAL is that the user visits the goal page.

STEP 1:

For an illustration I have created public pages as follows –

Example Original Page

Example-Original-Page

Variation page 1

Variation-page-1

Example Variation page 2

Example-Variation-page-2

Example Goal Page

Example-Goal-Page

Step 2:

The next thing we would do is to insert the tracking code snippet in the Liferay pages that are participating in this experiment. There are two approaches to insert the tracking code in the pages –

  1. Using Liferay Control Panel.
  2. Inserting code into Liferay Theme inside head tag.

Google recommends that we insert JavaScript inside HTML head tag and so that makes second approach more compliant with GCE.

Approach 1:

First one is through the control panel of liferay.

  • Select Pages>{Public/Private} Pages>{page-name}.
  • You will see the screen as shown below.
  • In the JavaScript section paste that tracking code generated by Google. Here Liferay will add <script type=”text/javascript”> and </script> tags at starting and ending of the content provided in the textarea respectively. Therefore adjust the provided javascript in the textboxes so that duplication of these tags can be avoided.

pages

Approach 2:

The second way to add the tracking code is by inserting it into the theme. Add the tracking code snippet just before the completing </head> tag(as suggested by Google) in the portal_normal.vm file in the theme. Apply that theme to all the pages (i.e. original, variation and goal page).

STEP 3:

Create an experiment in GCE. Make sure to put “strip=0” at the end of URLs. Set up goal page as GOAL.  See the screen shot below.

step3

STEP 4:

Set up GOAL with experiment.  The goal page has various parameters. You can also set a threshold here. Google will not decide a winner until that level of confidence is reached. A higher threshold can result in Analytics taking longer to declare a winner.

step4

Get the experiment  JavaScript code and add that to original page. You can add that either in theme or from control panel.  If you decide to add to theme, you will need to make sure that theme is applied to ONLY original page.

create_new_experiment

STEP 5:

Google will try to verify all URLs (see below screen shot). You may need to skip this validation if you added JavaScript from control panel.

step5

STEP 6:

Select “Run Experiment” to get started with the experiment. You can use the URL link of original page on your emails, site etc. Google will redirect user to variance pages. You can log in to GCE later on and see results.

step6
When the threshold is reached, GCE will redirect all the “original page” visitors to the winner page.  This would allow the site owner/admin to figure out which content works best for them and later on make the winner page the live page and remove other pages from the site.

Summary

Liferay excels as a horizontal portal and web content management system, and XTIVIA recommends Liferay as its preferred platform for building enterprise grade websites. More and more XTIVIA customers wish to use the A/B testing (aka “designed experiment”) approach to making marketing decisions. Google Content Experiments is one of the many tools available to conduct A/B testing – many of our customers prefer using it because of its integration with Google Analytics. I hope that this how-to guide comes in handy as you embark on a Liferay implementation that needs to leverage A/B testing.

Share This