All Collections
For Web
Build
Visual Editor
Creating your first Test Variation
Creating your first Test Variation
Updated over a week ago

To begin your first test click on the Variation (CTRL,CNV) and click “+”

The screen will refresh to display the page in visual editing mode. Moving your mouse around the page content will show “Crawling ants” lines within the page element under consideration along with some meta information (such as the type (e.g <div>, <img>) and any Custom IDs or classes that might be assigned.

Changing Content

Hover over the main headline “Plan for the Future Today”

Note how feedback is provided on the element. We can see the Headline is tagged as an <H2> tag and assigned a CSS class of .post-title

Tip – Don’t worry if you don’t know what an <H2> tag or anything about CSS, you don’t have too. It is possible to create test variations within the editor with little or no knowledge of HTML or CSS. As you use Webtrends Optimize you will become more confident and even learn what these things mean.

If you click on the headline, this will reveal the Element editor menu. The drop-down presents a number of options for changing the webpage element.

In this example, select “Edit or Insert Content” to open the dialog box.

Here you have the full functionality to modify the text itself or the attributes of the text

You can also change other elements of the block by selecting “Change Styles”

Here you can change the size, background colour or add a border. The colours can be modified using HEX or RGB. To change the size of the layout click on the “Layout” tab.

Here you can add margins, padding and float the block, again all without the need for HTML knowledge.

TIP – If you tick the box “Force Style Changes” box this will overrule any default styles within your website so be careful.

You can also insert content either before or after the highlighted block, hide it or trigger actions by making selections on the edit menu.

To keep track of your changes you can click on the “Elements Edited” on the top menu. Selecting each entry allows you to edit further or restore the changes to its original condition.

To save your changes, give it a memorable name in the box “Name” box on the top right and click “Save”. This will prompt you save using the original URL you selected or create a test across a different page by selecting the “+” sign and giving a new URL.

This could be tiresome when a lot of pages are in scope. For example, a test on the navigation would need to be sitewide. For a retail site, perhaps you want the variations to be applied to all your product pages, using the Children’s clothes page as a reference and the working URL. In addition, as new pages are introduced to the site, the test would need to be edited before being included.

Instead, it is better to use a REGULAR EXPRESSION (or RegEx) to define the character pattern the page needs to match to be included.

RegEX expressions are beyond the scope of this product help but there are useful guides and training tools on the web such as Lynda.com.

Regardless of approach, please be aware that the elements transformed need to exist consistently on pages in scope.

For now, switch the Test Address back to URL and click “Next”. On the next overlay, give the Project a name e.g “My WT Optimize Project” and click “Save Variation”.

Did this answer your question?