How to create a Window Popup?

What is a Window Popup?

A Window Popup is a large, center-screen popup designed to grab attention and deliver key messages, promotions, or announcements. It is perfect for highlighting special updates or collecting emails in a visually impactful way.

🛠️ Steps to Create a Window Popup

Step 1: Open the Window Popup navigation

• From the app’s dashboard, go to the Window Popups module and click Create window popup.

Step 2: Choose a Popup Type

• Select the type of popup you want to create. Click Select to proceed to the editor.

  • Announcement Popup: for simple messages or promotions.

  • Email Signup Popup: to collect customer emails.

Step 3: Configure Popup Settings

Once you enter the popup editor, you’ll see a max modal setting:

You can use the Top Bar to rename, activate your campaign, change the preview mode or undo or redo the edit

Then you can start editing with the left Sidebar:

3.1 Components:

Click any part of the popup (text, button, image, background...) to open quick-edit settings. You can edit the content and the design in one place quickly

• Add and customize elements like Title, Subtext, CTA Button, Footer, or Close Button.

• Use the rich text editor to apply styles (bold, links, font size, etc.).

• Drag & drop fields to rearrange their order.

• Remove unused fields with the trash icon.

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

3.2 Styles:

Customize the look and layout of your popup.

• Layout

  • Max width: Set the maximum width of the popup.

  • Height: By default, the popup uses auto height based on content. To set a fixed height, choose the “Custom” option.

  • Element gap: Adjust the spacing between elements (text, subtext, button, etc.).

  • Padding: Add inner spacing around the popup content.

• Border style

  • Border radius: Round the corners of your popup.

  • Border style: Select the border style (solid, dashed, dotted...).

• Close button & overlay

  • Close button: Customize the look of the close button or choose to hide it.

  • Overlay: Adjust the backdrop opacity and choose whether users can click outside the popup to dismiss it.

• Custom CSS

  • Add your own CSS for advanced styling if needed.

3.3 Schedule & Trigger: Define when and how the popup appears to visitors.

→ See full guide

3.4 Targeting: Control who sees the popup based on customer group, device, page, etc.

→ See full guide

3.5 Translations: Create multilingual versions of your popup content.

→ See full guide

3.6 Integration: (for Email Signup campaigns) Connect to Shopify Customers to sync new subscribers.

→ See full guide

Step 4: Preview the Popup

Use the Preview Panel to see how the popup will appear on different devices. This ensures optimal display across desktop and mobile.

Step 5: Publish the Popup

Click Save to publish your popup. Make sure the status is Active

Your popup will appear in the campaign list. You can manage, edit, or delete your banner anytime from here.

Note: If the popup does not appear on your storefront, please check if the app is properly embedded in your theme. Go to Shopify Admin → Online Store → Themes → Customize → App Embeds → Enable TA Banner & Popup. Or contact our support for help.

🎁 Want to remove branding? Contact our team to remove the "Powered by" line — free of charge if the popup is working on your store.

➤ Learn how to configure components for each popup type:

💬 If you have any related questions, please contact us via Live chat or [email protected] for further assistance.