> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help-option.ymqapp.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Pop-up Modal

1. [Option](/ymq-options-v2/option)
2. [Static Option Type](/ymq-options-v2/option/static-option-type)

# Pop-up Modal

📌 The Pop-up Modal allows you to display content in a pop-up window on the page. It can be used to show important information, instructions, or additional options without navigating away, improving the overall user experience.

---

**🔧 Basic Settings**

* **Name** – Change the display name shown to customers.
* **Column width** - Option represents a percentage of the overall width, e.g., 100%, 50%.
* **Conditional Logic** – Show/hide this field based on other option selections.

---

**💡 Advanced Settings**

1

⚡ **Trigger Settings**

* Trigger image
* Image size
* Trigger text
* Trigger text color

![](https://storage.crisp.chat/users/helpdesk/website/-/f/1/6/1/f161184389b6180/a9534d26-0d35-4797-85ce-36556f_rvkvid.jpg)

2

🎬 **Click action**

* Open popup window
* Open external link

3

📍 **Position**

Choose where the pop-up modal appears. By default, it displays directly, **but you can also position it relative to any element, either before or after that element.**

* Default
* Show next to app option name
* Show next to variant name
* Before a HTML element
* After a HTML element
* At the start of a HTML element
* At the end of a HTML element

**Examples:** To create a **size chart pop-up** for all Shopify variants named **Size**, you can set **Position** to Show **next to variant name**. This way, the modal only needs to be created once and will appear for every size variant automatically, without repeating the setup.

![](https://storage.crisp.chat/users/helpdesk/website/-/8/c/a/c/8cac788888672000/7669b126-a9b1-4981-ac7c-dce94b_7vkz5d.jpg)

4

↔️ **Modal Width**

Set the width of the pop-up window to control how much space it occupies on the screen.

5

💬 **Title in pop-up**

Enter a title to display at the top of the pop-up, helping customers understand the content or purpose of the modal.