The Variant Designer consists of three parts:
Content
Variant name: give the variant a name
Content:
Product set: allow a product set to appear in the content
Product(s) from event: let the product from the event appear in the content
Product amount : the number of products
Insert method: replace or indicate the position of the new content with respect to the selected element with the query selector
URL to personlize: the url which will be personalized
Query selector: the selected element which will be replaced or will serve as a beacon for the new content
Display
In the display settings you can compose your own design. Important to know:
The dots can be used to change the order of the elements
The eye can be used to hide an item
With the square you can change the spacing
By clicking on Add header, you can add an extra HTML block
With Preview url you can enter a preview url on which you can view the overlay
Additional options
Layout: the display of the content
Frequency cap: the interval at which the content is displayed
CSS: box for adding CSS
JavaScript: box for adding JavaScript
After saving a variant, you get to Personalization Settings