Animation effects help capture visitor attention and make your campaigns more engaging. OptiMonk allows you to add animations to two key elements:
Overlay animations: Background effects behind your popup
Display animations: How your popup appears on screen
Teaser animations: Attention-grabbing effects for teaser elements
Getting Started
To add animation to your popups, take the following steps:
Log in to your OptiMonk account
Select ‘Campaigns’ on the left
Select a campaign you wish to edit or ‘Create a new campaign’
You can set up animations in the 'Campaign Editor'
Adding Overlay Animation
Overlay animations create visual effects on the background layer behind your popup.
Step 1: Access Overlay Settings
In the Campaign Editor, navigate to Display > Website overlay.
Step 2: Configure Animation
Under Overlay animation, select your preferred:
Type: Choose the animation style
Mode: Set the animation behavior
The animation preview appears immediately, allowing you to test different options in real-time.
Step 3: Set Page Display Rules (Optional)
Click Page to specify which pages should display the overlay animation.
Adding Display Animation
Display animations control how your popup appears when it's triggered.
Configure Transition Effect
In the Campaign Editor, navigate to Display > Transition. Choose your entry animation from the dropdown:
Zoom: Popup scales into view
Fade: Popup gradually appears
Select the effect that best matches your campaign style and brand aesthetic.
Adding Teaser Animation
Teaser animations help draw attention to smaller campaign elements like tabs, buttons, or sticky bars.
Step 1: Access Teaser Settings
In the Campaign Editor, select the Teaser page and locate the Animation option.
Step 2: Configure Attention Seeker
Click Attention seeker to open the animation dropdown. Here you can:
Select your preferred animation type
Set the attention seeker frequency (how often the animation repeats)
Step 3: Save Your Changes
Choose your desired animation and click Save to apply the effect.
That's it! If you have any further questions or need any help, please contact us at [email protected], and we would be happy to assist you!