Info Pop-Up
PRO
Component
Info Pop-Up is highly flexible and adapts easily to different needs and scenarios.
Intro
Info Pop-Up is highly flexible and adapts easily to different needs and scenarios.
With a single display, it behaves like a simple privacy popup that appears once and then stays out of the way. When set to show multiple times, it works as a repeating banner for ongoing messages or important updates. With auto-close enabled, it becomes a dynamic alert, ideal for ads, promotions, or quick time-based notices.
Audio, YouTube, and self-hosted video elements placed inside the Pop-Up are fully supported and will automatically stop playback when the popup is closed.
Options:
Control how the popup is displayed while designing and testing.
You can toggle visibility separately for the editor and browser preview. This helps you work without affecting the final published experience.
ⓘ Cookies Control & Key URL Link
Duration
Define how long the popup stays remembered after being closed.
This determines when it will appear again for returning users.
Useful for compliance notices or repeated messaging.
✓ Features: Expiry Days: Number input controlling cookie duration
Cookie Name
Assign a unique identifier to track user interaction.
Each popup should use its own name to avoid conflicts.
Ensures independent behavior across multiple popups.
URL Key
Display the popup only on specific key. → EXPLORE
Filter visibility based on parts of the page URL / key. Ideal for targeted campaigns or contextual messaging. You can have multiple pop-ups on the same page that open only if the url contains the key.
Sample: www.site.com/?promo25 or www.site.com/?promo50
✓ Features: URL Keyword: Text match inside page URL
Shows
Control how many times the popup appears before being hidden.
You can create one-time notices or repeated reminders.
Useful for balancing visibility without annoying users.
✓ Features: Max Shows: Slider for display count
ⓘ Pop-Up behavior
Appear After
Delay the popup appearance after the page loads.
Helps avoid interrupting the initial user experience.
Works with all enabled opening triggers below.
Shows on Scroll
Trigger the popup to ID target. →EXPLORE
. Requires an ID in the page as a reference point.
✓ Features: Enable: Toggle scroll trigger
Target Div ID: Target element identifier
Close on Scroll
Automatically close the popup when the user scrolls.
Keeps the interface clean after interaction begins.
The scroll also mutes audio and video contained in the popup
✓ Features: Enable: Toggle scroll close.
Scroll Threshold: Distance in pixel before closing
Close on Countdown
✓ General Setting
Automatically close after a timer.
Can display visual progress indicators.
Bar Countdown
Progress Bar
Thickness: Line size
Line: Line color
Background: Bar background color
Opacity: Background transparency
Min Width: Minimum size
Position: Layout mode
Align → / ←: Horizontal positioning
Rotate: Rotation angle
Margin: Outer spacing
Padding: Inner spacing
Radius: Corner rounding
Box Shadow: Shadow effect
Number Countdown
You can compose sentences with the counter in the middle
Example: 'Closing in' 23 ‘sec' or 'Flash sale ends in' 23 'seconds'
✓ countdown text
Text Before: Prefix text
Text After: Suffix text
Transition: Text change animation
Theme Font: Font selection
Text Style: Typography size
Spacing: Letter spacing
Style: Font weight/style
Number: Text color
Background: Text background color
Opacity: Background transparency
Min Width: Minimum size
Position: Layout mode
Align → / ←: Horizontal positioning
Rotate: Rotation angle
Margin & Padding
Radius: Corner rounding
Box Shadow: Shadow effect
Entry animation
Control how the popup appears. →EXPLORE DEMO
Choose from multiple motion styles.
CSS Animations: Fade, Fade Slow, Fade Smooth, Fade Zoom In, Fade Zoom Out, Slide Up, Slide Up Full, Slide Down, Slide Down Full, Slide Left, Slide Left Full, Slide Right, Slide Right Full, Tilt Left, Tilt Right, Tilt Down, Tilt Up, Open Flap Bottom, Open Flap Top, Open Flap Right, Open Flap Left, Pulse In, Pulse Out, Tada, Bounce, Flip Drop BR, Flip Drop BL, Flip Drop TR, Flip Drop TL
ⓘ Triggers
Close Icon
Add a manual close control. Position it inside the popup.
The button also mutes audio and video contained in the popup.
✓ Features:
Enable: Toggle icon
Buttons
Add a manual close control.
Position it inside the popup.
✓ Features:
Enable: Toggle icon
Margin: Position spacing
✓ Extra Option: Add a trigger to any element
Apply link rules:
Link: # + Name: @click.prevent + Value: acceptCookies()
read more...
Add a link to your privacy or target page.
✓ Features:
Enable link
Text: Link label
Link to page: URL target
Theme Font: Font selection
Text Style: Typography size
Spacing: Letter spacing
Style: Font style
Text: Color
Margin
ⓘ Layout
Layout
Control popup width and horizontal spacing.
Defines overall structure.
✓ Features: Max Width & →|← inset spacing & Z-index
Spacing
Adjust alignment and internal spacing.
Pop-Up Alignment: controls positioning on screen.
✓ Features: Margin & Padding
ⓘ Banner Style
Effects
Apply box shadow and transparency.
Background
Customize background appearance.
Supports color and blur effects.
✓ Features:
Color: Background color
Opacity: Transparency
Blur: Background blur
Borders
Define border appearance. Useful for separation and styling.
✓ Features:
Color: Border color
Opacity: Transparency
Width: Border thickness
Radius: Corner roundin
Shine
Add animated highlight effect.
Used for attention and emphasis.
✓ Features:
Enable: Toggle effect
Static in Editor: Preview mode
Position: Horizontal placement
Size: Width of shine
Skew: Angle distortion
Animation: Movement type
Direction: Gradient direction
Color: Highlight color & Opacity
Blending: 16 Blend mode effects
Page Overlay
Control background layer behind popup.
Adds focus and visual separation.
✓ Features:
Enable: Toggle overlay
Click to Close: Close on click
Color: Overlay color
Opacity: Transparency
Fade: Animation selection
Blur: Background blur
Vignetting: Enable radial shading with opacity.
Fade: Vignetting 4 animation
ⓘ Dropzone setting
Dropzone
Manage content container behavior. Controls scrolling and size.
✓ Features:
Max Height: Height limit for long text with scrollbar
Overflow: Scroll behavior
Box Shadow: Shadow effect
ⓘ Exit Pop-Up
Exit Animation
Adds a smooth fade-out effect when the popup closes. Control the transition speed with the selector.
✓ Features: 3 Speeds
ⓘ Media in Pop-Up
Exit Media
Stops active media on close. Useful for videos/audio and multiple popups on the same page
✓ Features:
Local → stops media only in the current popup
Global → stops media in all active media on the page
ⓘ Info
Component Info
Guidelines for correct usage & behavioral notes.
⚠️ When used as a privacy policy banner: Info Pop-Up Pro is designed for static sites. CMS-driven or dynamic websites requiring legal compliance tracking need a dedicated cookie consent solution.
