Create a sale popup

This guide builds one complete sale popup: an image, a heading and a line of text, a link, a position, a schedule, and the pages it should appear on.

Make sure the app embed is on before you start — it renders sale popups as well as countdowns.

Steps to set it up

1. Open Sale Popups and create one

   Click Sale Popups in the app’s menu, then Create popup.

2. Name it

   Give it a name at the top of the editor — “Spring sale banner”, for example. Only you see it.

3. Write the content

   On the Component tab, fill in:

   • Heading text — the bold first line. A new popup starts with 🔥 Hurry up! 🔥
   • Content text — the line underneath. A new popup starts with “The Sale is on – Don’t miss out on hot deals for a limited time only!”
   • Link — where the popup goes when clicked, with an option to open it in a new tab
   • Image — an optional picture beside the text

   Full detail in Popup content and image.

   

   The Component tab holds everything a shopper reads and clicks.

4. Style it and place it

   Switch to the Design tab:

   • Appearance and background — solid, gradient, or image fill, with opacity, borders, padding and margins
   • Position settings — where it floats, separately for desktop and mobile, with an animation
   • Size settings — popup size and image size, with different sizes for mobile if you want
   • Font family and font size — heading and content font sizes

   Details in Design and position.

5. Set the schedule

   Switch to the Schedule tab:

   • Schedule date — Start at and End at
   • Times shown — how many times one shopper sees it
   • Duration — how long it stays on screen, in seconds
   • Always visible — keep it on screen instead of timing out

   Details in Visibility and schedule.

   

   The Schedule tab controls when the popup runs and how long it stays.

6. Choose who sees it

   Switch to the Display tab and set the Conditions. Popups can be targeted by All pages, Select products, Collections, Page, Customer, Customer tag, Language, and Country. See Display conditions.

   The same tab carries a shortcode, under Custom location to show popup, if you’d rather pin the popup into the page than let it float.

7. Check the shared settings

   Open Popup General Settings and check the timing that applies to every popup — how long before the first one appears, the gap between pops, and the maximum number. A new store’s defaults are deliberately low. See Sale popup general settings.

8. Save it as Active

   Set the status to Active and click Save. A Draft popup never appears.

9. Check it on your storefront

   Open your live storefront on a page that matches the popup’s conditions and wait for it to appear — remember the Time before the first pop delay in the general settings.

   Check three things:

   1. It appears in the corner you chose, and doesn’t cover anything important.
   2. The close button works.
   3. The link goes where you meant it to.

   Then check it on a phone. Popups take up proportionally much more of a small screen, and this is where the mobile position and size settings earn their keep.

Next steps

• Popup content and image
• Design and position
• Visibility and schedule
• Sale popup general settings