Create a Popup Modal

Guide to Creating a Popup Modal Option

1. How Does the Popup Modal Display?

The Popup Modal option displays as a clickable text or button on the product page. When customers click it, a popup window appears with detailed information — like size charts, personalization guides, care instructions, or policies — without cluttering the main product page.

This feature is purely informational and doesn't collect input from the customer.

Example on product page: “View Size Guide” → A popup opens showing a size chart.

2. How to Create a Popup Modal

Step 1: Add a New Option

Click Add Option > Popup Modal to begin creating your popup.



Step 2: Add Information to the Modal

Title on product page: This is the clickable text or button that opens the popup (e.g., “View Care Instructions” or “See Personalization Guide”).
Label on Pop-up: This appears at the top of the popup window.
Popup Content: Add your detailed content inside the editor. This can include text, images, tables, or even bullet points.

Step 3: Advanced Settings (If Needed)

Conditional Logic: Enable conditional logic if you want the Switch to show/hide only when a customer selects a specific option from another field. How to set up Conditional logic?
Help text: Add a short description to explain the purpose of the Pop-up moda. It can be displayed as Tooltips or Content (Below/Beside the option title, Below the option).

3. Real-World Applications of Popup Modal

Size charts
Frame or color guides
Personalization instructions
Shipping & return policies
Product care tips
Warranty or disclaimer info

4. Key Features of Popup Modal

Keeps product pages clean and focused
Allows rich content (images, tables, styled text)
Fully supports conditional visibility
Great for extra info that doesn’t need to be always visible
Improves UX by giving info only when the customer wants it

Updated on: 26/04/2025