Pop-up

Last updated on Sep 09, 2026

Pop-up

The Pop-up is a dialog that opens over the page: a newsletter signup, a promotion, an announcement. You fill it with the same content blocks you use anywhere else, choose what makes it open, and set how often it may reopen for the same visitor. A shopper closes it with the close button or the Escape key.

Add the section

The Pop-up lives in the Overlays group, which sits at the bottom of the section list on every page. The theme does not ship one, so you add it.

  1. In the theme editor, expand Overlays at the bottom of the sidebar.
  2. Click Add section inside the group and choose Pop-up (under Promotional).
  3. Select the section in the sidebar. The dialog opens in the preview so you can style it, and closes again when you select something else.

A store can have one Pop-up. It arrives with an Accent text heading and an Email signup block, ready to use as a newsletter signup. Swap or extend those with your own blocks: the Pop-up accepts the standard content blocks (text, image, buttons, and so on). See Content blocks reference. The Email signup block is the same one the footer uses: see Footer.

Trigger

These settings decide when the pop-up opens and for whom.

  • Open pop-up: what triggers it. Load opens it when the page loads. Scroll opens it once the shopper scrolls far enough down the page. Delay opens it after a timer. It starts on Scroll.
  • Delay: the wait in seconds before the pop-up opens, from 0 to 30. Shown when Open pop-up is Delay or Load.
  • Scroll trigger point: how far down the page the shopper must scroll before the pop-up opens, from 10 to 90 percent. Shown when Open pop-up is Scroll.
  • Show pop-up: how often the pop-up may open again for the same visitor, from Once every hour to Once per year. It starts on Once every 30 days. Once a visitor has seen it, it stays away until the chosen period passes.
  • Show only on home page: limits the pop-up to the home page. On by default. Turn it off to let it open on any page.
  • Hide for logged-in customers: keeps the pop-up away from shoppers with a customer account who are signed in. On by default.

Appearance

  • Size: the dialog width, Small or Medium.
  • Color scheme: the colors for the dialog surface and its content.

The section also uses the standard Padding controls, including separate mobile paddings. See Common section settings.

A pop-up on a button, anywhere on the page

The section above is the automatic pop-up: one per store, opened by a timer or a scroll. When you instead want a button that a shopper clicks, use the Pop-up block. Add it inside any section, the same way you add a Button. It comes as a pair:

  • Pop-up trigger: the button itself. Set its Label, its Style (Primary, Secondary, Primary outline, Secondary outline, or Link), its Size, and its desktop and mobile widths.
  • Pop-up dialog: what opens. Fill it with content blocks. Its own settings are:
    • Title: read by screen readers only. Put the visible heading in a block inside the dialog.
    • Size: Small, Medium, or Large. Wider than the Pop-up section allows.
    • Image: an optional picture beside the content. Once you set one, Content position appears (Left, Right, or Full), along with Overlay strength, which darkens the picture behind the content from 0 to 150 percent.
    • The standard Appearance, Layout, and Padding controls. See Common section settings.

The theme uses this pair for things like a "Join the waitlist" button next to a countdown, or a "How we ship" panel on a product page. Unlike the section, it never opens on its own, so there is no frequency cap and no page filter.

There is also an Inline pop-up block, which is the same dialog opened by a small text link instead of a button. Its one setting is Link label. It is built to sit beside a variant picker, for a jar-size table or a measurements chart: see Variant pickers and swatches and Add a size chart.

Tips

  • Show pop-up is the setting that keeps a pop-up polite. A visitor who has already seen it will not see it again until the period passes, so a longer interval reads as less pushy.
  • For a newsletter pop-up, Scroll with a trigger point around 50 percent tends to interrupt less than Load: the shopper has shown interest before you ask for their email.
  • While testing, remember the frequency cap applies to you too. If the pop-up does not reopen on the storefront, you have most likely seen it within the chosen period. In the theme editor it does not open on its own at all; select the section to open it.
  • Keep the content short. One heading, one line of text, and one action fit the dialog; a long stack of blocks forces it to scroll.