Step 2 – Create the variant content
Once you click on Add experiment, the experiment editor opens with the selected layout displayed and the Variant tab selected. This means that you can begin making your desired changes right away.
You can create up to five variants for your experiment, but in order to keep this experiment simple we shall just create one variant which adds some red text highlighting that this product is offered with free postage and packing.
In order to add the offer to the layout, we must edit an element. In this case, we select the <div> element that contains the price. This opens the Element Configuration panel.
We want to edit the text displayed, so select Edit from the menu displayed. From here you can edit the text displayed in the element using the HTML editor, text editor, style editor, or class editor, or a combination of these.
For this experiment we shall add the following code directly after the price in the HTML editor:
<p style="color:red">SPECIAL OFFER: Free P&P with this product.</p>This code displays “Free P&P with this product” in red text directly below the price of the product.
Once we have made the desired changes, click on the Save button to save the changes to the variant.
The Element Configuration panel closes displaying the variant page with a green border highlighting any elements that have been changed for the variant with a number indicating how many changes have been made.