Popups
In this section, you can control the visibility of popups in the online store such as the Newsletter popup, Round popup, Cookies popup, and Age verification popup.
Last updated
In this section, you can control the visibility of popups in the online store such as the Newsletter popup, Round popup, Cookies popup, and Age verification popup.
Last updated
Activate the option to fix the position of the popups to the page width if the "Enable page width" option is ticked in Theme settings -> Layout.
By disabling the option, the popups will appear outside the predefined width of store pages:
The popup will appear on the Home page when landing a page.
Tick the "Enable" checkbox to use the newsletter subscription popup. It is placed on the left bottom corner of the screen.
*Subscribers will be automatically added to the customer list in Shopify admin. The complete information can be found in the article.
Activate the "Show popup in admin panel" to display the popup in the Theme Editor.
Use the "Delay" scale to control when the popup will occur after someone enters the store. The delay time can vary from 0 to 60 seconds.
On the "Cookies life" scale, set the time (in minutes) for when the popup will reappear on a page after the "X" button is pressed. You can adjust the time from 0 to 60 minutes. A default value of 0 minutes means the popup will be shown continuously.
The popup won’t appear for customers who logged their accounts if you activate the "Show to guests users only".
Tick the "Show on mobile" checkbox to display the popup on mobile.
Use the "Background" color picker to specify the popup's background color.
In the "Text" picker, set the color that will be applied to all the texts in the popup.
The "Border" item lets you change the default border color.
To change the text color inside the input field individually, use the "Input text" item.
The icon color can be specified in the corresponding color picker.
The color of the "X" button can be adjusted using the "Close button" item.
In the following examples, you can view how the popup might display on a desktop and mobile:
The popup works on all store pages.
This popup can advertise a product with a sale proposition, promotion, shipping information, and more.
Hit the "Enable" checkbox to start the round popup. It will appear above all other popups in the bottom corner of all store pages.
To view the popup in the Theme Editor, activate the "Show popup in admin panel" option.
Enter any promotional string into the "Text" field.
Use the "Link" source selector to redirect visitors to the relevant page when they press the popup.
The "Width" scale determines the popup size. Set the value from 200 to 350 pixels.
Specify the type of text appearance in the popup using the "Text placement" drop-down. Select the required text type from the provided list of options. These options help define whether text should be duplicated and are distinguished by spaces.
In the "Image" selector, choose the image from the library or upload a new one from your device. The image will be placed right in the center of the popup.
Use the "Position" picker to place the popup on the "Left" or "Right" side of the screen.
The "Rotation speed" scale helps you to adapt the popup turnover speed from 1 to 8.
Use the "Delay" scale to control when the popup will occur after someone enters the store. The delay time can vary from 0 to 60 seconds.
On the "Cookies life" scale, set the time (in minutes) for when the popup will reappear on a page after the "X" button is pressed. You can adjust the time from 0 to 60 minutes. A default value of 0 minutes means the popup will be shown continuously.
The popup won’t appear for customers who logged their accounts if you activate the "Show to guests users only".
Tick the "Show on mobile" checkbox to display the popup on mobile.
Change the colors of popup elements using the provided color pickers: "Background", "Text", "Border", and "Close button".
The examples of the popup on the desktop and mobile can be viewed below:
This popup can be displayed on each page of a store.
Activate the popup by pressing the "Enable" option.
Activate the "Show popup in admin panel" to display the popup in the Theme Editor.
To link the Privacy Policy button to the desired page, choose the destination in the "Link button URL" resource selector or paste an external link to the field.
Use the "Delay" scale to control when the popup will occur after someone enters the store. The delay time can vary from 0 to 60 seconds.
On the "Cookies life" scale, set the time (in minutes) for when the popup will reappear on a page after the "X" button is pressed. You can adjust the time from 0 to 60 minutes. A default value of 0 minutes means the popup will be shown continuously.
The popup won’t appear for customers who logged their accounts if you activate the "Show to guests users only".
Tick the "Show on mobile" checkbox to display the popup on mobile.
Use the "Background" color picker to specify the popup's background color.
In the "Text" picker, set the color that will be applied to the main text paragraph.
The "Policy button" item lets you change the color of the link button.
To change the text color and border of the confirmation button in the popup, use the "Accept button" item.
In the following examples, you can view how the cookie popup might display on a desktop and mobile:
Note! By confirming your age is above 18 years, the information is stored in cookies for a year. Subsequently, when a buyer revisits the store, the popup will not be displayed since the information retrieved from the cookies will be utilized.
To display the popup once a visitor enters the online store, activate the "Enable" option. The popup will be displayed on both desktop and mobile when triggering the option.
If you need to view the customizations applied to the button in the Theme Editor, activate the "Show popup in admin panel" checkbox.
Choose the destination in the "Link for an exit button" resource selector or paste an external link to the field in order to redirect visitors to the desired page by pressing the "Exit" button in the popup.
Use the "Delay" scale to control when the popup will occur after someone enters the store. The delay time can vary from 0 to 60 seconds.
On the "Cookies life" scale, set the time (in minutes) for when the popup will reappear on a page after the "X" button is pressed. You can adjust the time from 0 to 60 minutes. A default value of 0 minutes means the popup will be shown continuously.
The popup won’t appear for customers who logged their accounts if you activate the "Show to guests users only".
Use the "Background" color picker to specify the popup's background color.
In the "Text" picker, set the color that will be applied to the heading and main text paragraph.
Set the color in the "Border" color picker to highlight the popup.
To change the text color and border of the confirmation button in the popup, use the "Accept button" item.
The "Exit button" item lets you change the background color of the second button.
In the following examples, you can view how the cookie popup might display on a desktop and mobile:
Tip: The texts can be edited in your Shopify admin -> Edit default theme content -> Theme content.
Press the dotted [...] button in the top left corner to navigate to Theme content:
Then, choose the tab "General" and scroll down to the popup settings:
