Preview Test Variations in VWO

Overview

Before launching a test, it is important to verify that your variations are implemented correctly and behave as expected. Previewing your test variations lets you simulate how the experiment will appear to visitors and confirm that all changes, targeting conditions, and metrics are working properly. It also helps you identify potential issues before the campaign goes live, such as layout problems, broken elements, incorrect targeting conditions, or goals that are not triggering correctly.

In VWO, you can preview variations using:

• Live Preview
• Variation Screenshots
• VWO Visual Editor

Before You Begin

When previewing variations, note the following:

• Previewing variations is not available when the campaign is in the Draft state. Ensure the campaign configuration is complete before accessing preview options.
• Your browser must allow pop-ups for preview tabs to open correctly.
• Previewing a variation does not expose the test to real visitors. It only simulates how the experiment will behave during execution.

Preview a Test Variation Using Live Preview

The Live Preview option allows you to simulate how the campaign loads for visitors under different targeting conditions. It is useful for verifying campaign setup, testing segmentation logic, and ensuring that goals and metrics trigger correctly.

To preview test variations using Live Preview:

1. Open the test campaign from the Testing dashboard.
2. From the campaign navigation panel, go to Review > Live Preview.
   

3. In the Preview URL field, the campaign URL is automatically populated. If needed, you can enter a different page URL where the campaign is configured to run.

   Note: If your campaign runs on multiple pages, you can preview each page individually by entering its corresponding URL.
4. [Optional] Configure targeting behaviour:
   1. If your campaign includes pre-segmentation conditions, the preview respects those conditions by default. This happens because the Ignore campaign targeting conditions in previews option is enabled by default. This allows you to quickly validate variation changes without needing to match the campaign’s targeting rules.
   2. If you want to verify how the campaign behaves for the configured audience or trigger conditions, clear the Ignore campaign targeting conditions in previews checkbox. The preview will then load only when the defined segmentation and trigger conditions are satisfied.
   3. To review the targeting rules applied to the campaign, expand View targeting conditions.
5. Select what you want to preview:
   1. For A/B and Split URL tests, select a variation.
   2. For Multivariate tests, select a combination.
6. Click Preview in a new tab to open the variation preview.

A new browser tab loads the selected variation along with the Preview Mode Debugger, which displays information about the campaign execution.

Understand the Preview Mode Debugger

When you open a preview, a debugger panel appears in the lower corner of the page. This panel provides real-time information about campaign execution.

Use the debugger to verify:

• URL match conditions (whether the page matches the configured URL pattern)
• Targeting logic (whether visitor targeting conditions are satisfied)
• Variation application (whether variation changes are applied correctly)
• Metric tracking (whether campaign metrics are triggered)

Understand Various Debugger Options

The preview debugger provides several useful controls:

Icon	Command	Action
	Copy Preview Link	Copy a direct preview link to share with team members for validation across different browsers or devices. You can also use the QR code to open the preview on a mobile device quickly.
	Reposition the Debugger	Move the debugger panel to the left or right side of the screen for better visibility.
	Minimize the Debugger	Temporarily hide the debugger while interacting with the page.
	Close the Debugger	Close the debugger completely.

View Campaign Details in the Debugger

Click the campaign name in the debugger panel to view detailed information about the previewed variation. The information is divided between two tabs:

Logs

The Logs section displays real-time information such as:

• whether the current page matches the campaign URL pattern
• whether the targeting conditions are satisfied
• whether modified elements are applied successfully
• whether campaign metrics are triggered

This information helps you confirm that the experiment is functioning as expected.

Campaign Info

The Campaign Info section displays configuration details, including:

• Campaign type and status
• Heatmap activation status
• Traffic allocation across variations
• URL pattern used for targeting pages
• Cross-domain tracking status (if enabled)

Verify Campaign Metrics from the Debugger

You can also trigger a campaign metric during preview to confirm it is tracked correctly.

For accurate validation:

1. Click Clear all logs in the Logs section to remove existing logs.
2. Perform the action that should trigger the metric (for example, clicking a button or completing a form).
3. Check the Logs panel to verify that the metric is recorded.

Preview Variation Screenshots

VWO automatically generates screenshots of your variations based on the changes applied during experiment configuration. These screenshots allow you to review how each variation appears across different browsers visually.

To preview variation screenshots:

1. Open the campaign.
2. Navigate to Review > Variation Screenshots. All variation screenshots appear as thumbnails in this section.
   
3. To view a screenshot, hover over the thumbnail and click View Screenshot.

4. From the enlarged screenshot, you can view the variation screenshot in specific browsers. To do this, select the variation and the browser from their respective dropdowns, then click Go.
   Alternatively, you can also use the Select Browsers dropdown present in the top right corner of the Variation Screenshots section to load screenshots of your variations in different browsers.

   Note: If the screenshots are generated for the first time, they may take a few seconds to load, depending on server load.
5. Additionally, you can also group your variations based on the Browsers and Variations using the Group By screenshot settings present in the panel on the right.

Preview a Test Variation via the VWO Visual Editor

Previewing variations directly from the Visual Editor allows you to quickly validate changes while building the variation. This method is useful when you want to immediately check whether page modifications appear correctly.

For example, you can use this preview to confirm:

• layout adjustments
• element modifications
• styling changes
• text updates

To preview a variation directly via the Visual Editor:

1. Open the campaign from the Testing dashboard.
2. Navigate to Configuration > Variations.
3. Locate the variation you want to preview and click Launch Editor. This action opens the variation in the VWO Visual Editor.
   
4. In the Variations panel, click the three-dot menu (⋮) next to the variation.
5. Select Preview.
   
6. If unsaved changes exist, VWO prompts you to confirm that the changes will be auto-saved before previewing.
7. Click Preview to open the variation in a new tab.

Info:

• You can open only one preview per variation (or control version) at a time.
• The preview tab title includes the variation identifier, such as [v1], [v2], and so on. This identification helps distinguish multiple preview tabs when validating different variations.
• If you continue editing a variation and save new changes, the open preview tab automatically refreshes to reflect the latest updates.
• If the preview tab does not open, check that your browser allows pop-ups for the site. You can also install the VWO Plugin to preview variations more reliably across pages and environments. For more information, see How to Use the VWO Plugin.

Need more help?

For more information or further assistance, contact VWO Support.