> For the complete documentation index, see [llms.txt](https://mpithemes.gitbook.io/unicorn-shopify-theme/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://mpithemes.gitbook.io/unicorn-shopify-theme/theme-settings/popups.md).

# Popups

## Newsletter popup

{% hint style="info" %}
The pop-up appears on the Home page when landing on a page.\ <mark style="color:orange;">**Note!**</mark> Subscribers are automatically added to the customer list in the Shopify admin after filling in the form. Complete information can be found in the [<mark style="color:blue;">article</mark>](https://help.shopify.com/en/manual/customers/manage-customers).
{% endhint %}

**Enable**\
Use the option to show the newsletter subscription pop-up. It is placed in the bottom left corner of the screen. All the related settings appear after activating the option:

**Show in editor**\
Activate to display the pop-up in the Theme Editor.

**Show on mobile**\
Activates the pop-up on mobile.

**Delay**\
Use the scale to control when the pop-up will occur after someone enters the store. The delay time can vary from 0 to 60 seconds.

**Cookie duration**\
Set the time (in minutes) for how long the pop-up remains hidden after the "X" button is pressed. Adjust a value between 0 and 60 minutes. A default value of 0 minutes indicates the pop-up reappears immediately after it is closed.

**Show to guests only**\
The pop-up won’t appear to customers who logged into their accounts if the option is enabled.

**Background**\
Use the color picker to specify the pop-up's background color.

**Text**\
Set the pop-up text color.

**Border**\
Lets you change the default border color.

**Input text**\
Use the item to change the text color in the input field individually,

**Icon**\
Specify the icon color in the provided color picker.

**Close button**\
The color of the "X" button can be adjusted using the item.

In the following examples, you can view how the pop-up might display on a desktop and mobile:

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

<figure><img src="/files/sPaWncOH7CLKRAFuoiDW" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Mobile" %}

<figure><img src="/files/FGCAltw00EZkcohE8O7b" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

***

## Round popup

{% hint style="info" %}
The pop-up works on all store pages.\
Advertises a product with a sales proposition, promotion, shipping information, and more.
{% endhint %}

**Enable**\
Starts the round popup. It appears above all other pop-ups in the bottom corner of all store pages. This option activates the list of related settings.

**Show in editor**\
Enables the pop-up display in the Theme Editor.

**Show on mobile**\
Activates the pop-up on mobile.

**Text**\
Type any promotional string using the current field.

**Link**\
Use the source selector to redirect visitors to the relevant page when they press the pop-up.

**Width**\
Determine the pop-up size on the scale. Set the value from 150 to 350 pixels.

**Text repeat pattern**\
Specify the type of text appearance in the pop-up using the drop-down. Select the required text type from the provided list of options. These options determine whether text should be duplicated and are distinguished by spaces.

**Image**\
Choose an image from the library or upload a new one from your device. The image is placed directly in the center of the pop-up.

**Position**\
Use the picker to place the pop-up on the "Left" or "Right" side of the screen.

**Rotation speed**\
The scale adjusts the pop-up turnover speed from 1 to 8.

**Delay**\
Use the slider to adjust the delay before the pop-up appears after the user enters a store. The delay can vary from 0 to 60 seconds.

**Cookie duration**\
Set the time (in minutes) for how long the pop-up remains hidden after the "X" button is pressed. Adjust a value between 0 and 60 minutes. A default value of 0 minutes indicates the pop-up reappears immediately after it is closed.

**Show to guests only**\
The pop-up won’t appear to customers who logged into their accounts if the option is enabled.

Change the colors of popup elements using the provided color pickers: **"Background"**, **"Text"**, **"Border"**, and **"Close button"**.

Examples of the pop-up on the desktop and mobile can be viewed below:

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

<figure><img src="/files/uYCyv1FJmNQSiNptmvfB" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Mobile" %}

<figure><img src="/files/P7CuOAU4TJozur1DVgNe" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

***

## Cookies popup

{% hint style="info" %}
This pop-up can be displayed on each page of a store.
{% endhint %}

**Enable**\
Activates the pop-up. View the list of related settings after enabling the option.

**Show in editor**\
Enables the pop-up display in the Theme Editor.

**Show on mobile**\
Activates the pop-up on mobile.

**Button link URL**\
To link the Privacy Policy button to the desired page, choose the destination in the source selector or paste an external link into the field.

**Delay**\
Use the slider to adjust the delay before the pop-up appears after the user enters a store. The delay can vary from 0 to 60 seconds.

**Cookie duration**\
Set the time (in minutes) for how long the pop-up remains hidden after the "X" button is pressed. Adjust a value between 0 and 31 days. A default value of 0 indicates the pop-up reappears immediately after it is closed.

**Show to guests only**\
The pop-up won’t appear to customers who logged into their accounts if the option is enabled.

**Background**\
Use the color picker to specify the pop-up's background color.

**Text**\
Specify the color of the main text paragraph.

**Policy button**\
Lets you change the color of the link button.

**Accept button**\
To change the text and border colors of the confirmation button, use the setting.

In the following examples, you can view how the cookies pop-up might display on a desktop and mobile:

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

<figure><img src="/files/OaL7zF7oDuiwKXsdj5uu" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Mobile" %}

<figure><img src="/files/P44Zs6PMYPpUoVacWd8E" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

***

## Age verification popup

**Enable**\
Turn on this option to show the popup when visitors enter your store. The popup is displayed on all devices. Additional settings will appear after the option is enabled.

**Show in editor**\
Enables the pop-up display in the Theme Editor.

**Link for an exit button**\
Choose the destination in the source selector or paste an external link into the field. After pressing the "Exit" button, visitors will be redirected to the specified page.

**Delay**\
Use the slider to adjust the delay before the pop-up appears after the user enters a store. The delay can vary from 0 to 60 seconds.

{% hint style="warning" %}
**Note!** Once a customer confirms their age, the popup remembers their choice by storing it in a browser cookie, preventing it from appearing again during the specified period.
{% endhint %}

**Cookie duration**\
Set the time (in minutes) for how long the pop-up remains hidden after the "X" button is pressed. Adjust a value between 0 and 99 days. A default value of 0 indicates the pop-up reappears immediately after it is closed.

**Show to guests only**\
The pop-up won’t appear to customers who logged into their accounts if the option is enabled.

**Background**\
Use the color picker to specify the pop-up's background color.

**Text**\
Specify the color of the heading and main text paragraph.

**Border**\
Highlights the pop-up with the applied color.

**Accept button**\
To change the text and border colors of the confirmation button, use the setting.

**Exit button**\
The item lets you change the background color of the second button.

In the following examples, you can view how the age verification pop-up might display on a desktop and mobile:

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

<figure><img src="/files/qY5Ogx79A4qWkzFhNHWE" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Mobile" %}

<figure><img src="/files/XCb8eNeAlJR1j0fJv4tv" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

***

### Edit text in the pop-ups

{% hint style="success" %}
**Tip:** The text can be edited in your *Shopify admin -> Edit default theme content -> Theme content*.
{% endhint %}

* Press the dotted \[...] button in the top right corner of the settings panel to navigate to Theme content:

<figure><img src="/files/ZnVtjEuXeAhgI6RJ519B" alt=""><figcaption></figcaption></figure>

* Then, choose the **"General"** tab and scroll down to the pop-up settings:

<figure><img src="/files/ixWsLi8QgM94GRFtXIVF" alt=""><figcaption></figcaption></figure>