A/B Testing with Google Optimize and Google Tag-Manger

Introduction

In this article we will explain how you can do A/B testing with your slider to optimize your conversion rate. We build on the Google Tag Manager and will use Google Optimize to set up and evaluate the A/B Testing. You will also need a Google Analytics account, because Google Optimize requires this. You can read about the integration of the Tag-Manager and Google-Analytics in our article Integrate Google Tag Manager and Analytics.

Voraussetzungen

  • Google Tag-Manager-Account
  • Google Analytics Account
  • Google Optimize Account
  • 2 websites + embedded sliders

Create first A/B test

We will set up a redirection test for our A/B test. This means that we will take as a target page for our A/B test an empty page, in which nothing else is included, except the Google Tag Manager and the Google Optimize code. Then we will make sure that in 50% of the cases a user is redirected to the A variant (https://slidevision.io/demo) and in the other 50% to the B variant (https://slidevision.io/demo-b).

Click on “Start now”.

Now we give our test a name “A/B Test Demo-Slider” and select the initial page (editor page) where our script for the redirection will be located. We also specify that we want to create a “Forwarding Test”.

Click Create.

Configure A/B test variants

In the following view, click on “Add variant” and configure the A variant.

https://slidevision.io/demo ist die URL zur A-Variante

Now click on Add variant again and configure the B variant.

https://slidevision.io/demo-b ist die URL zur B-Variante

In the last step ,we still have to set up the distribution. Our entry page (editor page) should get 0 percent of the test traffic, because it redirects to the A and B variants. Accordingly, we set the distribution to user-defined percentages.

Link Google Optimize with Google Analytics

In order for us to be able to define the goals for our A/B test in a later step, Google Optimize must be linked to Google Analytics. Click on “Link with Analytics”.

In the following dialog select the Analytics Property you want to link (the same one that is used for your website) and confirm with “Link”.

After this step you will be shown different instructions on how to connect.

The following dialog shows you the code to include (note “GTM-XXXX” variable) and provides links to articles that describe the different types in detail. We will focus on the Tag Manager in this article.

Connect Google Optimize to the Tag Manager

Since we use the Google Tag Manager as described in the introduction, we will describe the connection in this step. Log in to the Tag Manager and create a new tag.

Select as Tag Type the predefined Google Optimize tag. Choose your Optimize Container-ID (from the snippet in the previous step) Select as Analytics Settings your Google Analytics ID (As described in the article mentioned in the introduction, we have saved the Analytics settings in the variable “{{Google Analytics Settings}}”). At Tag triggering options choose “Once per page”. Give your tag a name and click on Save. We explicitly do not create a trigger here, the triggering of the Optimize tag will be done in the next step.

Now open the existing Google Analytics tag and check if the options for tag triggering is set to “Once per page”. Now click on the area Tag order

Now set for Trigger one day before the Google Analytics – Universal Analytics is triggered the previously created Google Optimize tag. This step is necessary because Google Optimize redirects to the A or B variant and we do not want to count the page view of the first page (editor page).

Create initial page (editor page)

Now we create the script that implements the forwarding. To achieve the highest performance and to initiate the forwarding as fast as possible, we put the code into a simple html file, which you have to upload to your server. The code is simply the snippet you use to integrate the tag manager into your site. The code looks like this (be sure to replace “GTM-XXXXXX” with your Tag-Manager ID) <!DOCTYPE html> <html> <head> <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-XXXXXX');</script> </head> <body></body> </html>

Set test objectives

In addition to significant and quantitative data, a technically reasonable A/B test includes hypotheses. These hypotheses we have to measure so we set the goals. Apart from the jumps and the length of stay, the most important key figure in performance marketing is conversion. Define a specific target page for this, e.g. /confirmation page/. You can set this in the feature form submission (“load hidden frame”).

Start test and evaluate

Now you can start the test =)

And after a while evaluate the results.

War dieser Artikel hilfreich? 1 Star2 Stars3 Stars4 Stars5 Stars (6 Bewertungen, Ø 4.50 von 5)
Loading...