📢 Announcement popup

An Announcement Popup is a small message box that appears on your site to highlight important updates, offers, or news. It helps grab attention and keep visitors informed without disrupting their browsing.

To get started: Go to Create Window popup → Select Announcement Popup.

👉 First time creating a popup? Follow this quick step-by-step guide to learn how to create and publish your first popup.

1. Content

Add content blocks: Text, Subtext, Button, Footer, or Close Action.
You can click "Add field" to add more information to the popup. Some fields can be removed if unused.
Use the rich text editor to style text, insert links, or format with bold, size, etc.
Drag and drop the field to reorder.

💡 Tip: Please highlight the text you want to adjust and click the adjust action, eg bold, link, font size,...

2. Visual Image

Select an image to appear in the popup.
Adjust size (10–50% width), position (Left, Right, or Top).
Tick the checkbox "Show image on mobile (Top)" if you want to keep the image on mobile.
Click the trash icon to remove the image if not needed.

You can customize the background of your popup using one of the following styles:

3.1. Solid Fill

A single, solid color applied as the popup background.
Ideal for a clean, minimal design or when you want text and buttons to stand out clearly.

3.2. Gradient

A smooth blend between two or more colors.
Great for adding a modern, eye-catching look to your popup without using an image.

3.3. Image Fill

Allows you to upload a custom image as the popup background.
After uploading, choose how the image should appear within the popup:
- Tile image: The image will be displayed at its real/original size, and if it's smaller than the container, it will repeat (tile) both vertically and horizontally until the background is fully filled. → Useful for creating pattern-style backgrounds or decorative effects.
- Fit image: Automatically resizes the image to fit the container while maintaining aspect ratio. Recommended if your image contains important content (like text or product visuals) that should be fully visible.

Tip: Use high-resolution images for best display quality across all screen sizes.

You can enable a teaser to let users revisit your popup after it's closed or to softly prompt them to open it before it's triggered. This is especially useful for important announcements or discount campaigns that you want users to see or interact with multiple times.

Teaser Display Types

There are 3 teaser display options based on how and when you want the teaser to appear:

3. Show before displaying and after closed

Description: The teaser is displayed both before the popup is triggered and after it’s closed, giving users the ability to access the popup at any time.

When to use:
- For long-running campaigns or high-value messages like newsletter signups, exclusive discounts, or any popup where you want to maximize visibility.
- Ideal when you want to ensure the popup won’t be missed, even if the user ignores the initial trigger or closes it by accident.

You can also edit other settings:

Edit content & style: Customize the teaser’s text, color, and appearance to match your brand.
Close button: Choose whether to show or hide the teaser’s close button.
Device targeting & position:
- Enable teaser on desktop, mobile, or both.
- Adjust the teaser's position (e.g., bottom-left, bottom-right, etc.) on the screen.