Articles on: PLAYER AND VIDEO
This article is also available in:

How to Utilize A/B Testing to Boost Your Sales Video

How to Utilize A/B Testing to Boost Your Sales Video



In this guide, we'll cover:

Understanding A/B Testing and How It Works
Setting Up Your A/B Test
Tracking Sales from Your A/B Test

1. What is A/B Testing and How Does it Work?



A/B testing is a great way to check how well 2 or more Sales Videos (VSLs) are performing!

When you start an A/B test, you get a single code that works for all the videos you want to test. These videos will appear alternately on your webpage, and the A/B test will give you specific metrics. This helps you keep an eye on the play rate and viewer retention for each video, letting you figure out which one is giving you the best results.

2. Setting Up Your Test



Click on the "A/B Test" tab, then hit "New Test," and pick the videos you want to test.



By default, traffic goes evenly to each video, but you can change the percentage if you like. After that, just hit "Create A/B Test."



Once you've done that, copy the test code and paste it into your page builder. You only need one code for all your videos, no matter how many you have.



That's all! Now you can monitor the results of your A/B test, and the data will be displayed on your dashboard.

We'll share the play rate, engagement, and button click metrics with you!

To determine the winner of the test, just adjust the traffic and allocate 100% of it to the chosen video!

3. Measuring Sales from Your A/B Test



To check your sales, you've got two options:

3.1 Using the VTurb Action Button


For sales tracking, include a parameter in your checkout that shows which VSL the sale came from. This parameter needs to work with your checkout platform.

For example, let's say you're using the utm_content parameter. If you're using VTurb action buttons in your videos, just add the right parameter in each video's button. So, in Video A, your link could be mycheckout.com?utm_content=VSLA, and in Video B, it might be mycheckout.com?utm_content=VSLB.

🚨 Note: If there's already a utm_content parameter in the browser's URL (from ads), it'll be replaced by the parameter you put in the button. Other parameters in the URL stay the same.

3.2 Using HTML Buttons or Your Page Builder


If you've got HTML buttons or other hidden elements on your page, use the script below. It lets you set the exact delay for your buttons and elements based on which VSL is being shown in the A/B test. Plus, for buttons, it passes the tracking parameter you want for each VSL to the checkout!

Here's how to use the script:

Add the "hide" class to the elements where you want this to work.
Copy the code below and paste it with your player script.
Decide when in the video you want the elements to appear.
If you want, change the utm_content parameter to something else you prefer (and that works with your checkout platform, of course).

If you're running an A/B test with 2 videos, use the script below:

<style>

  .hide {
    display: none;
  }
</style>

<script type="text/javascript">
  document.addEventListener("DOMContentLoaded", function () {
    /* DO NOT ALTER THE TIME BELOW */
    var SECONDS_TO_DISPLAY = 12;
    var CLASS_TO_DISPLAY = ".hide";

    var attempts = 0;
    var elsHiddenList = [];
    var elsDisplayed = false;
    var elsHidden = document.querySelectorAll(CLASS_TO_DISPLAY);
    var alreadyDisplayedKey = `alreadyElsDisplayed${SECONDS_TO_DISPLAY}`;
    try {
      alreadyElsDisplayed = localStorage.getItem(alreadyDisplayedKey);
    } catch (e) {
      console.warn('Failed to read data from localStorage: ', e);
    }

    setTimeout(function () {
      elsHiddenList = Array.prototype.slice.call(elsHidden);
    }, 0);

    var showHiddenElements = function () {
      console.log(smartplayer.instances);
      elsDisplayed = true;
      elsHiddenList.forEach((e) => (e.style.display = "block"));
      try {
        localStorage.setItem(alreadyDisplayedKey, true);
      } catch (e) {
        console.warn('Failed to save data in localStorage: ', e);
      }
    };

    var startWatchVideoProgress = function () {
      if (
        typeof smartplayer === "undefined" ||
        !(smartplayer.instances && smartplayer.instances.length)
      ) {
        if (attempts >= 10) return;
        attempts += 1;
        return setTimeout(function () {
          startWatchVideoProgress();
        }, 1000);
      }

      smartplayer.instances[0].on("timeupdate", () => {
        if (
          smartplayer.instances[0].analytics.player.options.id ==
          /* PLACE THE ID OF YOUR PLAYER A BETWEEN THE '' AND SET THE VALUE TO 10, 
             SETTING THE TIME WHEN THE SECTIONS SHOULD APPEAR */
          "62f7b142a90dbc000a0e8f45"
        ) {
          SECONDS_TO_DISPLAY = 10;
        }

        if (
          smartplayer.instances[0].analytics.player.options.id ==
          /* PLACE THE ID OF YOUR PLAYER B BETWEEN THE '' AND SET THE VALUE TO 20, 
             SETTING THE TIME WHEN THE SECTIONS SHOULD APPEAR */
          "6286b08c06aa090009247143"
        ) {
          SECONDS_TO_DISPLAY = 20;
        }

        /* IF THERE ARE MORE VIDEOS TO ADD DELAY, PASTE THE LINE BELOW */

        if (elsDisplayed || smartplayer.instances[0].smartAutoPlay) return;
        if (smartplayer.instances[0].video.currentTime < SECONDS_TO_DISPLAY)
          return;
        showHiddenElements();
      });
    };

    if (alreadyElsDisplayed === "true") {
      setTimeout(function () {
        showHiddenElements();
      }, 100);
    } else {
      startWatchVideoProgress();
    }
  });
</script>


If your A/B test involves more than 2 videos, you'll need to insert the following code with your video information into the previous script:

if (smartplayer.instances[0].analytics.player.options.id == "VIDEO_ID") {
    SECONDS_TO_DISPLAY = "DELAY_TIME_IN_SECONDS";
}


Just find the part with the comment /* IF YOU HAVE MORE VIDEOS TO ADD DELAY, PASTE THE CODE BELOW */, and paste the code in the next line. Then, simply set the delay, and everything will be up and running!




Learn more at:
How to Set Up Delay Script + A/B Test Parameters

Updated on: 11/30/2023

Was this article helpful?

Share your feedback

Cancel

Thank you!