# Popup

## The Popup appearance

<figure><img src="https://2658914724-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTsBtmFQxtPZrKf7veaAQ%2Fuploads%2FswhW8qLsJXcYDCi48ucp%2FScreenshot_62.png?alt=media&#x26;token=31e29c77-473e-4426-a499-f87f4b63dbc4" alt=""><figcaption></figcaption></figure>

## Section settings

<figure><img src="https://2658914724-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTsBtmFQxtPZrKf7veaAQ%2Fuploads%2F3mGcuRJLLYzPmP1nceUK%2FScreenshot_63.png?alt=media&#x26;token=d2b0bde7-9ef5-4ea4-bba1-479a8a3ba526" alt=""><figcaption></figcaption></figure>

| Settings                      | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                     |
| ----------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Display mode**              | <ul><li><strong>Enable:</strong> If you enable it. The popup will enable in your store.</li><li><strong>Disable:</strong> If you disable it. The popup will be disabled in your store.</li><li><strong>Testing:</strong> Regardless of the relevant settings or dismissal, the 'Testing mode' popup appears, allowing you to review it at any time. When you're happy with the look, click the 'Enable' button.</li></ul>                                       |
| **Show on home page only**    | Allows for a popup only for the homepage.                                                                                                                                                                                                                                                                                                                                                                                                                       |
| **Show only for visitors**    | If a customer registers in your store. The customer will not be shown this popup. The popup will only be visible to visitors.                                                                                                                                                                                                                                                                                                                                   |
| **Delay time showing popup**  | You can specify when the popup should appear after your website has loaded. The time span is 2 to 60 seconds.                                                                                                                                                                                                                                                                                                                                                   |
| **"Don't show again" button** | When a customer will get the popup for the first time. If the customer will click on this button, the popup will not be displayed again for the specific customer.                                                                                                                                                                                                                                                                                              |
| **Show again after (days)**   | How long after clicking the **"Don't show again"** button will the customer see the popup again?                                                                                                                                                                                                                                                                                                                                                                |
| **Popup width**               | <ul><li><strong>Small:</strong> This is the smallest width of the popup. <strong>Desktop width</strong>: 500px, <strong>Mobile width</strong>: 100% with a 50px offset</li><li><strong>Medium (Default):</strong> If you disable it. The popup will be disabled in your store.</li><li><strong>Large:</strong> This is the highest width of the popup. <strong>Desktop width</strong>: 1000px, <strong>Mobile width</strong>: 100% with a 50px offset</li></ul> |
| **Content alignment**         | <p><strong>Left:</strong> Aligns the content to the left.<br><strong>Right:</strong> Aligns the content to the right.<br><strong>Center:</strong> Aligns the content to the center.</p>                                                                                                                                                                                                                                                                         |

## **Popup position Settings**

{% tabs %}
{% tab title="Center" %}

<figure><img src="https://2658914724-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTsBtmFQxtPZrKf7veaAQ%2Fuploads%2Fr04YrrhkftRhAISF3FCP%2FScreenshot_64.png?alt=media&#x26;token=0f07fbfe-2425-492a-b0f4-bd92cfef26f8" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Bottom right	" %}

<figure><img src="https://2658914724-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTsBtmFQxtPZrKf7veaAQ%2Fuploads%2FmWl0DpGJB0kYRF2MIjEt%2FScreenshot_67.png?alt=media&#x26;token=f884e3e7-5aaa-45fd-a765-7777a314d3cb" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Bottom left" %}

<figure><img src="https://2658914724-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTsBtmFQxtPZrKf7veaAQ%2Fuploads%2FqmsARzmLiUuHT6mUmfjv%2FScreenshot_68.png?alt=media&#x26;token=87ebb72d-aa01-4958-a3a3-9c00015dd489" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

## **Popup Image Settings**

| Settings                                   | Description                                                                                                                                                                       |
| ------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Desktop image                              | This is an image for the popup.                                                                                                                                                   |
| **Desktop image placement**                | <p><strong>Image left:</strong> You can show the image on the left side of the popup.<br><strong>Image right:</strong> You can show the image on the right side of the popup.</p> |
| **Show as full-width image in background** | You can show it as a full-width image in the background of the popup. By default, it’s disabled.                                                                                  |
| **Overlay opacity**                        | It works by selecting the show as a full-width image in the background. You can add overlay opacity.                                                                              |

## **Colors settings**

<figure><img src="https://2658914724-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTsBtmFQxtPZrKf7veaAQ%2Fuploads%2FuBlWi5fa1RMV9zT58OUX%2FScreenshot_65.png?alt=media&#x26;token=d169f3cd-103c-4cc8-badc-8f7c585f364f" alt=""><figcaption></figcaption></figure>

## Block settings

| Block name     | Settings                                                                                                                                                                                                                                                                                                                                                                 |
| -------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **Heading**    | <ol><li>You can add the heading</li><li>You can also change the heading size</li></ol>                                                                                                                                                                                                                                                                                   |
| **Text**       | You can add a description in the popup                                                                                                                                                                                                                                                                                                                                   |
| **Email form** | <ol><li>You can add an email form</li><li>You can add a label for the email</li><li>Make button full width: If you enable it, the subscribe button will be full width </li></ol><p></p>                                                                                                                                                                                  |
| **Button**     | <ol><li>You can add a button</li><li>You can change the button size, style, and link.</li></ol><p><img src="https://2658914724-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTsBtmFQxtPZrKf7veaAQ%2Fuploads%2FWA5w0WwZsR14g81Z7mU8%2FScreenshot_66.png?alt=media&#x26;token=14a2d1aa-ee51-4bf5-a004-e141658335d6" alt="" data-size="original"></p> |
