Sales Boost Sections
These are the conversion-focused sections in Vertex โ the urgency cues, the promo surfaces, the modal flows, and the bundle blocks. None of them require a third-party app. All of them respect Shopify Theme Store policy (no persistent wishlists, no tracking scripts, no affiliate links).
Stack too many urgency cues and they cancel each other out. A countdown next to a low-stock counter next to a promo popup screams desperate. Pick the one that matches your campaign, lean into it, and rotate.
Promo bannerโ
A dismissible top banner โ typically used to promote a sitewide sale, free-shipping threshold, or seasonal campaign. Distinct from the announcement bar (which is always-on chrome); the promo banner is campaign-driven and dismissible.
Open Shopify admin โ Online Store โ Themes โ Customize. In the page editor, click Add section and choose Promo banner.
Settingsโ
- Text โ Short value message: "Spring Sale ยท 15% off orders over $1,000".
- Background color โ Pick a high-contrast accent โ amber, red-orange, teal, etc.
- Link URL โ Click target for the banner (the entire band is clickable).
- Link label โ Inline call-to-action: "Shop the sale โ".
- Dismissible โ On by default. Adds the close button so visitors can hide the banner.
- Position โ Above header (default) or Below header. Above the header reads more urgent; below reads more like a banner.
Dismissibilityโ
When Dismissible is on, clicking the close button hides the banner for that visitor. The banner stays hidden in their browser until they clear their site data โ or you re-publish the section under a new ID.
If you want to re-surface a dismissed promo for a new campaign, delete and re-add the section in the customizer. The old hidden state will no longer match and the banner will reappear for everyone.
Promo popupโ
Auto-opening modal with image, heading, body, and call-to-action button. Pick a trigger and a cooldown so visitors don't see it on every page load.
In the page editor, click Add section and choose Promo popup.
Settingsโ
- Heading โ "Subscribe & save 10%" or "Wait โ get a free swatch kit".
- Body โ Short reassurance plus value proposition.
- Image โ Side illustration (or full-bleed background).
- CTA label โ "Sign up" or "Get the kit".
- CTA URL โ Form page or product.
- Trigger โ Immediate (with delay), On scroll (after 50% scrolled), or Exit intent (mouse-leave detection).
- Delay seconds โ Only used when the trigger is Immediate. Default 5.
- Cookie expiry days โ Default 7. Visitors who close or convert won't see it again for that many days.
Triggers explainedโ
| Trigger | Best for | UX consideration |
|---|---|---|
| Immediate (delay) | Newsletter signups, first-time visitor offers | Most intrusive โ use a 5โ10 second delay minimum |
| On scroll (50%) | Engagement signal โ only fires after the visitor has scrolled, signaling interest | Best balance of conversion and UX |
| Exit intent | Last-chance offers, abandonment recovery | Desktop only โ exit-intent doesn't fire reliably on mobile |
The modal won't re-open for a visitor until the cookie expires.
Countdownโ
Days, hours, minutes, and seconds counter. Live-counting, with the initial state shown the moment the page loads (no flash of empty content).
In the page editor, click Add section and choose Countdown.
Settingsโ
- Heading โ "Spring sale ends in".
- End date โ Date and time picker for when the timer expires. Stored in your store's timezone.
- Expired text โ Replaces the counter once the timer hits zero. "The sale has ended".
- Link URL โ Optional call-to-action below the counter.
- Link label โ "Shop now".
- Color scheme โ Standard color scheme dropdown.
How it countsโ
The timer updates every second. When the target time is reached, the counter is replaced with the Expired text and the call-to-action link is hidden.
Fake countdowns (perpetually 24 hours, reset on page reload) destroy trust. Tie the End date to a real campaign end and let the section take care of the expiry state.
Featured bundlesโ
Curated bundle cards with image, title, discount badge, and Add to cart button. Each block is one bundle (typically a parent product that bundles 2โ5 SKUs, configured as a Shopify Bundle in your admin).
In the page editor, click Add section and choose Featured bundles, then click Add block to add one card per bundle.
Per-block settingsโ
- Product โ Pick the bundle parent product.
- Bundle label โ Override the product title โ "Starter MRO Kit".
- Discount text โ Badge overlaid on the image โ "Save 15%" / "3 for the price of 2".
- Description โ Short value proposition under the title.
Section settingsโ
- Heading โ "Bundle & save"
- Columns โ 2, 3, or 4
- Show price โ Toggle (respects login-required pricing)
Discount badge stylingโ
The discount text shows as a circular pill over the top-right corner of the image. Use accent colors (amber, red-orange, teal) โ the badge is small enough that it doesn't overwhelm the bundle visual.
Stock counter (low-stock indicator)โ
This block lives on the product page โ see Product Page for full details. It only appears for variants you track inventory on, and switches to the "Only N left" warning once stock reaches the low threshold (10 units). It triggers urgency without revealing exact inventory to competitors.
States:
- More than 10 in stock: "In stock"
- At or below 10: "Only 4 left in stock"
- Back-orderable (zero, set to keep selling): "Back-ordered โ ships in 7โ10 days"
- Sold out (zero, not back-orderable): "Sold out" (with back-in-stock form)
Back-in-stock alertโ
An email opt-in form that appears on sold-out variants when pre-order is not turned on. Native, no third-party app.
How it worksโ
- Buyer selects a sold-out variant
- The Add to cart button is replaced with an email input and a Notify me button
- On submit, the buyer's email is added to your Shopify customer list with a tag like
back_in_stock:product-handle:variant-id - When you restock and re-publish the variant, you can filter customers by that tag and send a campaign
What you need to doโ
- In Shopify admin, create a customer segment filtered by the back-in-stock tag
- When you restock, send a manual campaign to that segment via Shopify Email or your email tool
Vertex captures the opt-in. Sending the restock email is a manual step โ Shopify doesn't expose a "auto-email on restock" hook from theme code without an app. The trade-off is full Theme Store compliance and zero monthly cost.
Quick view modalโ
Triggered by the Quick view button on product cards. Opens a modal with the product gallery, variant picker, quantity input, and Add to cart โ without leaving the collection page.
What appears in the modalโ
- Multi-image gallery (with swipe on mobile)
- Title and price (respects login-required pricing and B2B catalog price)
- Variant picker
- Quantity input (with MOQ, max, and case-pack enforcement)
- Add to cart button
- "View full details โ" link to the product page
Settings (on product card / collection sections)โ
- Show quick view button โ Toggle (per section: Featured collection, Collection list, search results, related products)
- Quick view button label โ Defaults to "Quick view"
When to turn it on or offโ
| Use case | Recommendation |
|---|---|
| High-volume catalog where buyers compare variants quickly | Turn on โ speeds up the "browse 20 products, add 3" flow |
| Highly-technical catalog where buyers need datasheets and specs before deciding | Turn off โ quick view doesn't show specs or documents; force the click-through to the product page |
When to use whatโ
| Goal | Section |
|---|---|
| Drive attention to a sitewide campaign | Promo banner |
| Capture email and offer a first-time discount | Promo popup |
| Time-limited offer with hard expiry | Countdown |
| Highlight curated multi-product offers | Featured bundles |
| Urgency on the product page without revealing exact inventory | Stock counter |
| Capture demand for sold-out items | Back-in-stock alert |
| Reduce friction on the collection page to Add to cart flow | Quick view |
What's nextโ
- Product page sections โ โ Stock counter and back-in-stock on the product page in full
- Homepage marketing โ โ Where to drop promo banners on the homepage
- Finder sections โ โ Make/Model/Year and Brand/Category/Capacity finders
- Theme settings reference โ โ Color schemes, layout, and the product-page toggles