Skip to main content

Notice Popup Section

Use this section to create a customizable popup that can display announcements, newsletter signups, or promotional content.

The popup includes cookie-based display control and theme editor integration.


Set up a Notice Popup section

  1. Go to Customize theme
  2. In Theme editor, select any page
  3. Select "Add section""Popup"
Site-Wide Display

The popup will appear across all pages based on your timing settings.


Timing Settings

Setting nameDescription
Days until popup shows againSet cookie duration (1-30 days). Default is 7
Popup delaySet initial display delay (0-60 seconds). Default is 0
Add tintToggle background overlay. Default is false

Content Settings

Setting nameDescription
Popup titleSet heading text. Default is "Notification title"
Popup textRich text content area
Popup imageOptional image (recommended: 600px wide)
Image positionChoose Left or Right. Default is left

Newsletter Settings

Setting nameDescription
Show newsletter signupToggle form display. Default is true
Show buttonToggle CTA button. Default is true
Button textSet button label. Default is "Continue shopping"
Page linkSelect page for button link (optional)

Technical Notes

  • Popup uses cookies to track when it was last closed
  • In theme editor, popup visibility is controlled by section selection
  • Responsive design adapts layout for mobile devices
  • Maximum width adjusts based on image presence (md/2xl)
  • Newsletter signups are processed through Shopify's customer system

Best Practices

  • Set 7-14 day cookie to avoid annoying repeat visitors
  • Use 5-10 second delay for better UX
  • Keep content short and focused
  • Test on mobile devices
User Experience

Consider user experience when setting popup frequency and delay. Aggressive popup settings may negatively impact user engagement and increase bounce rates.

Popup Strategy

Use popups for high-value offers (10% off, free shipping) or important announcements (new collection launches, limited-time sales). Avoid using them for generic content.