Testing Variables Not Present on a Page in Visiopt

Overview

This Standard Operating Procedure (SOP) provides detailed instructions on how to test a variable that isn't currently present on a page using Visiopt. This guide will help users add and test new elements such as testimonials, videos, images, headlines, or trust symbols by incorporating an empty div into the page's HTML code.

Step-by-Step Instructions

Step 1: Identify the Desired Location
 

1. Determine the Spot

·   Identify the specific spot on your page where you want to test a new variable that doesn't currently exist.

2. Examples of Variables

·   The variable could be extra testimonials, a video, an image, an additional headline, or trust symbols.

Step 2: Insert an Empty Div
 

1. Open the Source Code

·   Open the source code of the page where you want to add the new variable.

2. Add the Empty Div (1:02)

·   Insert the following code at the desired location:

<div style="min-height: 2px;"></div>

·   This code creates an empty div with a minimum height of 2 pixels.

Step 3: Copy and Paste the Empty Div
 

1. Copy the Div Code

·   Highlight and copy the empty div code to the clipboard.

2. Insert into Editor

·   Open the editor in Visiopt and paste the empty div code into the desired location within your page's HTML.

Step 4: Select and Name the Variable
 

1. Highlight the Empty Div

·   In the Visiopt editor, highlight the small empty container created by the div.

2. Select the Variable

·   Click on the empty container to select it as a variable.

3. Name the Variable

·   Name the variable something descriptive, such as "empty div," and click "Save."

Step 5: Create a New Version

1. Create a New Version

·   Click the plus button to create a new version of the selected variable.

2. Name the New Version

·   Name the new version appropriately, such as "div with new content."

Step 6: Add New Content
 

1. Edit HTML

·   Click the HTML button to open the code editor.

2. Locate the Empty Div

·   Find the div code you added earlier.

3. Insert New Content

·   Remove the line break within the div and type in the new content. This could be text, an image, a video, or any other required element.

4. Save the Changes

·   Click "Save" to store the new content within the div.

Step 7: Verify the Changes
 

1. Check the New Content

·   Verify that the new content appears in the designated spot on the page.

2. Control and Test Versions

·   Compare the control version (without the new content) and the test version (with the new content) to ensure the changes are correctly implemented.

Important Note

1. Impact on Page

·   Adding empty divs to your page does not affect the appearance, design, code integrity, or loading speed of the page.

Conclusion

By following these steps, users can effectively test variables that are not originally present on a page within Visiopt. This method allows for flexible and comprehensive testing of new elements, enhancing the overall experimentation process.