The Popup section shows a window over the page with your content, such as a newsletter signup or an offer. It can open on its own after some time, when a customer is about to leave, or after they scroll. It can also open from a link you place anywhere. In the editor sidebar, it is the Popup section under Overlays. Select it to open the popup in the preview. It never opens on its own inside the editor. Add a popup walks through setting one up.
The Checkmate style ships with Display timing set to Manual only, so its popup opens only from a link. The Lair and Fang styles open it after 20 seconds, once per visit.
In the Checkmate style, the popup opens in the bottom right corner with a photo, a heading, a short paragraph, an email signup field and social media icons.
Display timing
Setting
What it does
Display timing
Time on page opens the popup after a number of seconds. Exit intent opens it when the pointer leaves the browser window at the top, as when a customer moves to close the tab. Scroll depth opens it once the customer scrolls a set distance down the page. Manual only never opens it on its own, only from a link.
Seconds on page
From 0 to 60 seconds, default 30. Shows with Time on page.
Scroll depth
The distance from the top of the page, from 0 to 5,000 px, default 600. Shows with Scroll depth.
Time on page is the default for a new Popup section. Exit intent works only on screens 768 px wide and up with a mouse or trackpad.
Once a customer closes the popup, it stops opening on its own in that browser, on every page, until they clear their browser data. Signing up through any newsletter form in your store, in the popup or elsewhere, has the same effect. A link to the popup still opens it.
The popup never opens on its own on the password page, at checkout, or while the cart drawer is open.
Visibility
These settings decide where and for whom the popup opens on its own. They show when Display timing is anything but Manual only.
Setting
What it does
Repeat behavior
On each matching page (default) opens the popup again on each page the customer views, until they close it. Once per browser visit opens it at most once until the customer closes the browser tab.
Visitor type
New visitors only opens the popup only on the first page a customer views in your store in that browser. Returning visitors only opens it on every page after that first one. All visitors is the default.
URL targeting
URL contains opens the popup only when the page address contains the text in URL contains, such as /collections/sale. Query parameter equals opens it only when the address has the name in Parameter name with the value in Parameter value. All URLs is the default.
Page type
Home page, Product pages, Collection pages, Cart page, Search page, Blog / article pages or Static pages limits the popup to that kind of page. Static pages are the ones you create in Online Store > Pages. All pages (default) covers every page except the cart page. Select Cart page to open it there.
With Query parameter equals, utm_source and newsletter match an address that ends in ?utm_source=newsletter. If URL contains or Parameter name is empty, the popup does not open on its own.
With New visitors only and Time on page, the popup opens only if the customer stays on that first page for the seconds you set.
Layout
Setting
What it does
Popup position
Center (default) puts the popup in the middle of the screen, Right center against the right edge halfway down, and Bottom right in the bottom right corner. On screens narrower than 1000 px, the popup rises from the bottom of the screen at full width, whatever the position. A popup with only an image keeps its own width there.
Popup size
The popup's width when it has an image: Extra small 500 px, Medium 648 px, Large (default) 792 px and Extra large 940 px. Without an image, it is narrower.
Image position
Where the photo sits beside the content: Left (default), Right or Top. With Extra small, the photo always sits on top.
Popup handle
Popup handle, under Advanced, names the popup for links. With newsletter, a link to #Popup-newsletter opens it. A handle with spaces, such as Spring sale, becomes #Popup-spring-sale. Leave it empty and the theme makes a name from the section's ID.
In the editor, the popup shows its link at the top of its content with a copy button, so you can paste it into a button or a menu. Customers never see that line. Open a popup from a button or link shows where to paste it.
Blocks
The popup's photo comes from its Image block. Choose an image in that block to show it, in the place Image position sets. With no image, the popup shows only its content. A popup with an image and no other content shows the image alone.
To add content, click Add block in the Popup section. The blocks stack in the content column in their order in the sidebar.
The Popup section shows a window over the page with your content, such as a newsletter signup or an offer. It can open on its own after some time, when a customer is about to leave, or after they scroll. It can also open from a link you place anywhere. In the editor sidebar, it is the Popup section under Overlays. Select it to open the popup in the preview. It never opens on its own inside the editor. Add a popup walks through setting one up.
The Checkmate style ships with Display timing set to Manual only, so its popup opens only from a link. The Lair and Fang styles open it after 20 seconds, once per visit.
In the Checkmate style, the popup opens in the bottom right corner with a photo, a heading, a short paragraph, an email signup field and social media icons.
Display timing
Setting
What it does
Display timing
Time on page opens the popup after a number of seconds. Exit intent opens it when the pointer leaves the browser window at the top, as when a customer moves to close the tab. Scroll depth opens it once the customer scrolls a set distance down the page. Manual only never opens it on its own, only from a link.
Seconds on page
From 0 to 60 seconds, default 30. Shows with Time on page.
Scroll depth
The distance from the top of the page, from 0 to 5,000 px, default 600. Shows with Scroll depth.
Time on page is the default for a new Popup section. Exit intent works only on screens 768 px wide and up with a mouse or trackpad.
Once a customer closes the popup, it stops opening on its own in that browser, on every page, until they clear their browser data. Signing up through any newsletter form in your store, in the popup or elsewhere, has the same effect. A link to the popup still opens it.
The popup never opens on its own on the password page, at checkout, or while the cart drawer is open.
Visibility
These settings decide where and for whom the popup opens on its own. They show when Display timing is anything but Manual only.
Setting
What it does
Repeat behavior
On each matching page (default) opens the popup again on each page the customer views, until they close it. Once per browser visit opens it at most once until the customer closes the browser tab.
Visitor type
New visitors only opens the popup only on the first page a customer views in your store in that browser. Returning visitors only opens it on every page after that first one. All visitors is the default.
URL targeting
URL contains opens the popup only when the page address contains the text in URL contains, such as
/collections/sale. Query parameter equals opens it only when the address has the name in Parameter name with the value in Parameter value. All URLs is the default.Page type
Home page, Product pages, Collection pages, Cart page, Search page, Blog / article pages or Static pages limits the popup to that kind of page. Static pages are the ones you create in Online Store > Pages. All pages (default) covers every page except the cart page. Select Cart page to open it there.
With Query parameter equals,
utm_sourceandnewslettermatch an address that ends in?utm_source=newsletter. If URL contains or Parameter name is empty, the popup does not open on its own.With New visitors only and Time on page, the popup opens only if the customer stays on that first page for the seconds you set.
Layout
Setting
What it does
Popup position
Center (default) puts the popup in the middle of the screen, Right center against the right edge halfway down, and Bottom right in the bottom right corner. On screens narrower than 1000 px, the popup rises from the bottom of the screen at full width, whatever the position. A popup with only an image keeps its own width there.
Popup size
The popup's width when it has an image: Extra small 500 px, Medium 648 px, Large (default) 792 px and Extra large 940 px. Without an image, it is narrower.
Image position
Where the photo sits beside the content: Left (default), Right or Top. With Extra small, the photo always sits on top.
Popup handle
Popup handle, under Advanced, names the popup for links. With
newsletter, a link to#Popup-newsletteropens it. A handle with spaces, such asSpring sale, becomes#Popup-spring-sale. Leave it empty and the theme makes a name from the section's ID.In the editor, the popup shows its link at the top of its content with a copy button, so you can paste it into a button or a menu. Customers never see that line. Open a popup from a button or link shows where to paste it.
Blocks
The popup's photo comes from its Image block. Choose an image in that block to show it, in the place Image position sets. With no image, the popup shows only its content. A popup with an image and no other content shows the image alone.
To add content, click Add block in the Popup section. The blocks stack in the content column in their order in the sidebar.
Text block: headings and paragraphs.
Button block: a link styled as a button.
Newsletter form block: an email signup. Collect email signups explains where subscribers go.
Social links block: your social profile icons.
Custom liquid block: your own code.
Blocks from apps you have installed. Add an app to your store explains how.
A new Popup section comes with a heading, a newsletter form, a short paragraph and social links.
If the popup does not open when you expect it to, see My popup doesn't appear.