Split testing elements

Create segment

To create a segment, we must first access a campaign. This can be done by searching for the desired campaign in the Campaigns section.

Once inside the intended campaign, we will locate the “Create Segment” button on the middle-left of the screen in the Quick Actions section or we can do it in alternative way by clicking on “Create” green button on the middle-right side of the screen. Clicking it will open a dialog with two fields to fill in.

1. The first field is a text box where we’ll name the segment. Typically, the name includes details we find relevant such as the segment’s purpose, the pages it targets, the creation date, whether it’s intended for desktop, mobile, or both, etc. (e.g. “Demo — Confluence page — Split test — Desktop/Mobile — 280125”).
2. The second field is a dropdown menu where we’ll select the type of segment you are creating, which in this case is “Split Test Segment.”

After completing these steps, we click the “Create” button. A new tab will open, displaying our newly created segment.

Create templates

As mentioned at the beginning of this guide, splits differ in rules (triggers) and designs (templates). Now, we need to create two templates — one for each split — so we can begin building our split test segment.

This process is quite similar to creating a segment, but this time there is only one field to fill: the name.

Repeat this process once more, and we will have two new templates for your split test segment.

At this stage, both the new templates and the segment are disabled. To access them, simply switch from “Enabled” to “Disabled” in the top-left corner of the templates list.

Configuring template

Inside the template, we’ll find a visual editor where you can build the HTML and select or upload a CSS file to complete your design. On the left side of the editor, you’ll see a preview of how it will look. To build the HTML for each state (maximized, minimized, success), you’ll need to switch between the different states.

Before saving the template for the very first time, we need to select a conversion type, which defines the action end users can take within the segment. In this case, we will choose “Callback,” as our engagement will include a submit button for users to provide their information to be called back.

The second template will follow the same guidelines, with the exception that the content of the HTML will differ from the first one, if that’s desired.

The templates are now ready to be enabled for use in the segment. You can enable them directly within the template, next to its name, or from the templates list in the “Status” column. Alternatively, you can enable them in bulk on the templates list.

Configuring segment

Back in the segment, you’ll find another visual editor. Since the designs have already been created in the templates, simply scroll down and select the correct template from the dropdown menu. Once selected, the HTML, CSS, and conversion type will be imported automatically from the template. Next, switch to Split 2 tab and repeat the process.

This specific segment has a unique characteristic: it is a lead form, meaning it targets an element on the webpage instead of appearing as a pop-up. To set this up, you need to specify the target element. This works similarly to CSS selectors: use a ”.” before the name to target by class or a ”#” to target by ID.

Now we just need to set the activation hours — the timeframe during which we want the engagement to be active — and then configure the triggers.

To set the activation hours, navigate to the “Activation Hours” tab, click the “Add Activation Hours” button, choose the type of hours (in this case, recurring hours), select the desired days, and specify the time range.

For demonstration purposes, I’ll create two different activation hour sets: one for 24/7 availability and another for standard business hours. However, you can create as many sets as needed and switch between them as required.

Now it’s time to add the triggers. There are two types of triggers to configure: parent triggers, which apply to both splits, and child triggers, which are specific to each split.

First, we will configure a parent trigger to ensure this engagement is only visible to users with a specific testing cookie we use for segment testing. Next, we’ll add different child triggers for each split.

Once that’s done, I’ll enable the split test segment, using the same process we followed to enable the templates.

Live testing and final comments

As we observed, Split 1 appeared after 10 seconds on the page, while Split 2 appeared after 20 seconds. These triggers were used for demonstration purposes, but we have a wide variety of triggers available for use as needed.

That URL trigger was used for demonstration purposes. We have different ways how to match on URL’s.

The lead form was displayed from the beginning because Bmetric’s website includes a fallback form, which appears if the lead form engagement fails to load for any reason.