What is the Teaser, and what is it good for?
The Teaser is a complementary page for your campaign, which helps grab visitors’ attention before or after seeing your popup. If the teaser appears before the popup, it has a recommending and teasing function. If you choose the teaser to appear after the popup is closed, it serves as a reminder for your campaign.
Please follow these steps to edit the Teaser of your Campaign:
1. First, log in to your OptiMonk account at https://app.optimonk.com/login/en
2. Select the Campaigns menu on the left, then select the Campaign you want to edit or click New campaign on the right-hand side:
3. Select the Variant you want to edit:
4. You will arrive in the Campaign Editor. Select the Teaser page to edit it:
1) Page settings
Once you select the Teaser page, you will see the available settings on the left:
There are 3 main settings menu for the Teaser page: Step, Layout, and Add Element:
1a) Step: Under the Step menu, you can decide when to show the teaser: before the popup is displayed, when the popup is closed, or you can choose to enable both options. There is also a switch that can disable the Teaser in mobile view:
When is it going to show up?
If you enable the option ,,Before the popup is displayed", the teaser will show up 6 seconds after your webpage finished loading. If the visitor continues to explore your website and visit different pages, the teaser will continue to show up on your website for that visitor 1,5 seconds after each page finishes loading, based on the segmentation rules you have set for your Campaign.
1b) Layout: here you can see the design layout of your Campaign, and you can also see every Element that is on the Teaser page:
If you click on an Element, you can edit it further:
The available settings will show up on the left as usual:
To get back to the previous menu, click on the back arrow icon in the top left corner.
1c) Add Element: You can add new Elements to your Teaser page under Add Element menu:
There are currently 3 Elements that you can use for the Teaser page: Text, Image, and Floating image.
2) Teaser-specific settings
You can access the settings of the Teaser page under Layout:
The Teaser also has 3 settings menu: General, Style, and Advanced:
2a) General: You can set the Display settings, content alignment, the position, and the size of the Teaser under General:
2b) Style: Here, you can set up the background, the border, and the shadow options, or you can add some animations:
To set up an animation for the Teaser, look for the “Animations” menu, where you will find the “Attention seeker” drop-down:
You can even set up the attention seeker frequency.
Changing the background and the text
You can also change the background of the Teaser under the Style tab. You have the following options:
If you select an image as a background, you will see additional options:
You can also edit the text of the teaser by clicking on the text:
You can change the font style, font type, color, size, line height, and alignment.
As the text is on a Text Element, you will see additional settings on the left when you click on the text:
2c) Advanced: Under the Advanced menu of the Teaser settings, you can find the Spacing settings: Padding and Margin:
If you need any further help or have any questions, just let us know at email@example.com, and we would be happy to help :)