Managing Multiple Elements as a Single Variable in Visiopt

Overview

This Standard Operating Procedure (SOP) provides detailed instructions on how to select and rotate multiple elements on a page as a single variable in Visiopt. This advanced feature is particularly useful for testing scenarios involving multiple call-to-action buttons or relocating elements on a page.

Step-by-Step Instructions

Step 1: Select Multiple Elements
 

1. Select Elements

·   Visiopt allows you to select more than one element on a page and rotate them as a single variable.

2. Use Case Example

·   For instance, if you have multiple call-to-action buttons on a sales page and want to test a new button, you can select all the buttons and treat them as a single variable, avoiding the need to rotate each button individually.

Step 2: Test Different Locations for a Variable

1. Relocate Elements

·   If you want to test moving a variable from one location to another on the page, this option allows you to do so.

Step 3: Demonstrate by Moving a Button

1. Highlight and Select Button

·   Highlight the button, right-click, and select it. Name the button and click "Save."

2. Create a New Version

·   Click the plus button to create a new version. Name it appropriately (e.g., "remove button").

3. Edit HTML

·   Click the HTML button, select all the button code, copy it, delete it, and then click "Save."

Step 4: Create New Location for the Button
 

1. Activate New Feature

·   Notice the two plus marks. Click it to activate the feature, which allows you to make another selection to be part of this test variable.

2. Move Button to New Section

·   Click OK, then choose the new section where you want to move the button.

3. Select and Name Variable

·   Select the new location as a variable, name it, and click the HTML button.

Step 5: Ensure Proper Placement
 

1. Proper Wrapper

·   When moving an element on a page, ensure it is placed in the proper wrapper or div section for it to display correctly.

2. Paste Button Code

·   Paste the button code inside the appropriate wrapper (e.g., "Visi rapper rapper") and click "Save."

Step 6: Verify Changes
 

1. Observe Variable Rotation

·   When the variable rotates, the button will be removed from the original location and displayed in the new location.

2. Get Creative

·   Experiment with additional ways to use this advanced option for more robust testing scenarios.

Conclusion

By following these steps, users can effectively manage multiple elements as a single variable within Visiopt. This advanced feature enhances testing flexibility, allowing for comprehensive and creative test setups.