# Introduction (https://docs.sledge-app.com/)
Most apps hand you a dashboard. Sledge hands you a method.
Watch what shoppers tell you they want. Put the right offer where they decide. Measure what every offer earned, so you keep the winners and drop the rest. Three steps — and these docs show you how to run each one.
## The three steps [#the-three-steps]
**See what shoppers want.** A shopper types "waterproof jacket". Another filters to size medium, in stock, under $80. Every one is a signal, and almost all of it normally vanishes unread. Sledge listens in the moment, so the dead-end search becomes a fixable leak and the filter nobody can find becomes obvious.
→ [Search](/guide/search) · [Filters](/guide/filter)
**Sell where shoppers decide.** You built a good bundle, and it sits on the product page where it only works if the shopper gets that far. But the decision happens in the search results, on the collection, one tap from leaving the cart. Sledge places your offers across all nine of those moments.
→ [Surfaces](/start/surfaces) · [Bundles & offers](/guide/bundles) · [Merchandising](/guide/merchandising)
**Know what every offer earned.** You added the bundle, launched the banner, turned on the upsell. Revenue moved — but which change did it? Sledge tracks the whole user journey, from product page through to a thank-you page upsell, and measures every offer against your real sales. Each Growth Intelligence finding arrives with a priority, the dollars attached and a button to act on it — then gets graded against what it actually earned.
→ [Analytics](/guide/analytics) · [Growth Opportunities](/guide/growth-opportunities)
**Nothing goes live untested.** Preview any offer on any surface before you publish it, and [A/B test](https://sledge-app.com/a-b-testing/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=intro\&utm_content=ab-testing) it against a variant once it's out — bundles, badges, banners, countdowns, pre-order and merchandising strategy all support it. Split traffic, watch revenue per variant, pick the winner.
## Before you worry about it [#before-you-worry-about-it]
**It won't break your theme.** Sledge detects your theme and adapts — cards, colors, drawer, badges. It never touches your theme files. Uninstall and your theme is exactly as it was. See [Themes](/start/themes).
**It won't slow your store.** One lightweight library instead of a stack of app scripts, loaded without blocking your page.
**There's no code step.** Installing is one switch in your theme editor. See [Install](/start/install).
Every plan has a 14-day free trial and development stores are free.
**[Start free on the Shopify App Store](https://apps.shopify.com/sledge?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=intro\&utm_content=index)** — or [see how Sledge works](https://sledge-app.com/how-it-works/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=intro\&utm_content=index) first.
## Everything included [#everything-included]
One subscription covers all of it. Feature names link to the full story on the Sledge site; the right column takes you straight to the setup guide.
### Discovery [#discovery]
| Feature | Set it up |
| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------- |
| [Search](https://sledge-app.com/search/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=search) — instant search, synonyms, AI matching, redirects | [Guide](/guide/search) |
| [Filters](https://sledge-app.com/filters/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=filters) — filter trees, colour and image swatches, price sliders, merged values | [Guide](/guide/filter) |
| [Merchandising](https://sledge-app.com/merchandising/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=merchandising) — pin, boost, demote, hide and inject products anywhere in the grid | [Guide](/guide/merchandising) |
| [Recommendations](https://sledge-app.com/recommendations/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=recommendations) — best sellers, trending, personalised picks, recently viewed | [Guide](/guide/recommendations) |
| [Personalization](https://sledge-app.com/personalization/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=personalization) — results shaped by what each shopper has shown interest in | [Guide](/guide/search) |
### Offers [#offers]
| Feature | Set it up |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------- |
| [Bundles](https://sledge-app.com/bundles/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=bundles) — [fixed](https://sledge-app.com/bundle/bogo/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features), [BYOB](https://sledge-app.com/bundle/byob/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features), [volume](https://sledge-app.com/bundle/volume-discount/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features), [free gift](https://sledge-app.com/bundle/free-gift/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features) | [Guide](/guide/bundles) |
| [Upsell](https://sledge-app.com/upsell/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=upsell) — cart and post-purchase offers | [Guide](/guide/bundles) |
| [Subscriptions](https://sledge-app.com/subscription/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=subscription) — subscribe and save on product and cart | [Guide](/guide/bundles) |
| [Promotions](https://sledge-app.com/promotions/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=promotions) — banners and countdown timers | [Guide](/guide/promotion) |
| [Cart drawer](https://sledge-app.com/cart-drawer/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=cart-drawer) — progress goal, countdown, upsells, free gift, subscriptions, trust badges, shipping protection, order notes, discount codes | [Guide](/guide/cart-drawer) |
### Conversion [#conversion]
| Feature | Set it up |
| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------- |
| [Reviews](https://sledge-app.com/reviews/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=reviews) — product reviews, ratings, snippets, trust badges | [Guide](/guide/reviews) |
| [Wishlist](https://sledge-app.com/wishlist/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=wishlist) — save for later, with a full wishlist page | [Guide](/guide/wishlist) |
| [Badges](https://sledge-app.com/badges/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=badges) — Sale, New, Bestseller, and badge campaigns that tag products automatically | [Guide](/guide/merchandising) |
| [Back in stock](https://sledge-app.com/back-in-stock/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=back-in-stock) — notify shoppers when you restock | [Guide](/guide/merchandising) |
| [Pre-order](https://sledge-app.com/pre-order/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=pre-order) — sell before stock lands, in full or on a deposit | [Guide](/guide/merchandising) |
### Knowing what worked [#knowing-what-worked]
| Feature | Set it up |
| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------ |
| [Growth Intelligence](https://sledge-app.com/growth-intelligence/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=growth-intelligence) — live signals and prioritised findings from your own orders, each with the dollars attached and a one-click action | [Guide](/guide/growth-opportunities) |
| [Analytics](https://sledge-app.com/analytics/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=analytics) — the full user journey and what every widget and offer actually earned | [Guide](/guide/analytics) |
| [A/B testing](https://sledge-app.com/a-b-testing/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=ab-testing) — split traffic across variants of almost any feature, then pick the winner on revenue | [Guide](/guide/bundles) |
See [all nine surfaces](https://sledge-app.com/surfaces/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=surfaces) an offer can appear on, or [what's in each plan](https://sledge-app.com/pricing/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=features\&utm_content=pricing).
## Where to go next [#where-to-go-next]
## For AI agents [#for-ai-agents]
Every page is available as Markdown by appending `.md` to its URL. A corpus
index lives at [`/llms.txt`](/llms.txt), and the complete text at
[`/llms-full.txt`](/llms-full.txt).
---
# Custom code (https://docs.sledge-app.com/customize/custom-code)
Sledge has two settings for your own code: **Custom CSS** and **Custom JavaScript**. Both live in the Sledge dashboard under global settings, and both apply across your whole storefront.
Three facts govern everything on this page. Read them before writing anything.
**1.** Custom CSS is applied inside **every Sledge widget's shadow root**, at the highest priority.
**2.** Custom CSS therefore **cannot style the widget elements themselves** — only their contents.
**3.** Custom JavaScript runs **before any widget has rendered**.
## 1. Custom CSS goes inside widgets [#1-custom-css-goes-inside-widgets]
Sledge widgets render in shadow roots, which is what stops theme CSS and Sledge CSS interfering with each other. Your custom CSS is adopted directly into each of those shadow roots, above Sledge's own styles.
So this works — it targets content *inside* a widget:
```css
.product-card {
border: 1px solid #dedede;
border-radius: 6px;
}
```
And this does **not** work, because `sledge-wishlist-badge` is the widget element itself, which lives in your theme's DOM, not inside a shadow root:
```css
/* Never matches. */
sledge-wishlist-badge {
align-self: center;
}
```
## 2. Host elements need a document-level style [#2-host-elements-need-a-document-level-style]
To style the widget element itself — its alignment in a header row, its width in a grid, its margins — inject a document-level stylesheet from Custom JavaScript:
```js
SledgeCC.style('badge-align', 'sledge-wishlist-badge{align-self:center;vertical-align:middle}')
```
This is the single most common reason custom CSS "does nothing". If your selector targets a `sledge-*` element, it belongs in JavaScript.
## 3. JavaScript runs before widgets exist [#3-javascript-runs-before-widgets-exist]
Custom JavaScript executes while Sledge is booting, which is *before* any widget has rendered. Anything that queries for a Sledge element at the top level will find nothing:
```js
// Always null. Runs too early.
const card = document.querySelector('sledge-product-card')
```
Do the work inside an event handler instead:
```js
document.addEventListener('sledge:product-card:rendered', (e) => {
const card = e.detail?.card
// ...
})
```
A re-render rebuilds the widget's shadow tree and discards your changes, so this event fires again. Every patch must re-apply on each fire — never assume it runs once.
## The standard helpers [#the-standard-helpers]
Paste this at the top of your Custom JavaScript. It handles the patterns above correctly so you don't have to reimplement them.
```js
/* Sledge custom-code helpers */
const SledgeCC = (() => {
const wired = new WeakSet()
/** Inject a document-level stylesheet once. For host elements and theme markup. */
const style = (id, css) => {
const key = `sledge-cc-${id}`
if (document.getElementById(key)) return
const el = document.createElement('style')
el.id = key
el.textContent = css
;(document.head || document.documentElement).appendChild(el)
}
/** Run fn for every product card, now and on every re-render. */
const onCard = (fn) => {
document.addEventListener('sledge:product-card:rendered', (e) => {
const card = e.detail?.card
if (card) try { fn(card) } catch (err) { console.warn('[sledge-cc]', err) }
})
}
/** Observe one element's shadow root, debounced to one frame. Wires once. */
const watch = (el, fn) => {
if (!el?.shadowRoot || wired.has(el)) return
wired.add(el)
let scheduled = false
const run = () => {
scheduled = false
try { fn(el) } catch (err) { console.warn('[sledge-cc]', err) }
}
new MutationObserver(() => {
if (scheduled) return
scheduled = true
requestAnimationFrame(run)
}).observe(el.shadowRoot, { childList: true, subtree: true, characterData: true })
run()
}
/** Find elements across nested shadow roots. */
const findAll = (selector, root = document) => {
const out = []
const walk = (node) => {
out.push(...node.querySelectorAll(selector))
node.querySelectorAll('*').forEach((el) => el.shadowRoot && walk(el.shadowRoot))
}
try { walk(root) } catch (err) { console.warn('[sledge-cc]', err) }
return out
}
/** Mark a node processed. Returns false if it already was. */
const claim = (node, tag) => {
const attr = `data-sledge-cc-${tag}`
if (node.hasAttribute(attr)) return false
node.setAttribute(attr, '1')
return true
}
return { style, onCard, watch, findAll, claim }
})()
```
## A worked example [#a-worked-example]
Two of the most common requests together — rename the automatic sale badge, and align the wishlist badge in a header icon row:
```js
/* Purpose: sale badge reads "ON SALE"; header wishlist badge sits on the icon row baseline
* Depends: sledge:product-card:rendered
* Fragile: .badges .badge is internal markup and may change between releases
*/
// Host element — custom CSS cannot reach this, so it goes document-level.
SledgeCC.style('badge-align', 'sledge-wishlist-badge{align-self:center;vertical-align:middle}')
// Widget content — re-applied on every render, because a re-render wipes the tree.
SledgeCC.onCard((card) => {
card.shadowRoot.querySelectorAll('.badges .badge').forEach((b) => {
if (!SledgeCC.claim(b, 'onsale')) return
if (b.textContent.trim().startsWith('-')) b.textContent = 'ON SALE'
})
})
```
## Rules [#rules]
Follow these and your customizations will survive theme changes, re-renders and Sledge updates.
| | Rule |
| -- | ------------------------------------------------------------------------------------------------------------------------ |
| 1 | **CSS first.** If it can be done in Custom CSS, do not write JavaScript. |
| 2 | **Widget contents to CSS, host elements to JavaScript.** |
| 3 | **Never query Sledge elements at the top level.** They do not exist yet. |
| 4 | **Prefer [events](/customize/events) over observers.** Reach for `MutationObserver` only when no event covers your case. |
| 5 | **Scope observers to a shadow root**, never to `document` or `documentElement`. |
| 6 | **One guard convention** — a `data-` attribute on nodes, a `WeakSet` for elements. |
| 7 | **Debounce with `requestAnimationFrame`**, not chained `setTimeout` delays. |
| 8 | **Namespace everything** you inject with `sledge-cc-`. |
| 9 | **Fail closed.** Wrap entry points so a broken customization degrades instead of breaking the page. |
| 10 | **Justify every `!important`** with a comment naming the inline style it overrides. |
## Using `!important` [#using-important]
Some values are set inline on elements by Sledge, and inline styles cannot be overridden by a stylesheet without `!important`. That makes it legitimate here — but note *why*, so a later reader knows it was necessary rather than a guess:
```css
/* !important: the badge's background-color is set inline on the element. */
.product-card .badges .badge {
background: #43c6ac !important;
}
```
## What is supported [#what-is-supported]
**Supported.** The Custom CSS and Custom JavaScript settings, document-level style injection, [document-level events](/customize/events), [design tokens](/customize/styling), and [element tag names](/reference/elements).
**Escape hatch.** Reaching into `shadowRoot` and matching internal class names, as the worked example does with `.badges .badge`. Internal markup can change in any release. Note it in a comment at the top of your file so you know where to look if a release changes something.
Where an escape hatch is your only option, that is a gap worth reporting — see [Support](/support).
---
# Custom Components (https://docs.sledge-app.com/customize/custom-components)
When CSS is not enough — when your theme's product card is structurally different from Sledge's, not just styled differently — you can replace the markup entirely.
A Custom Component is a Liquid template you provide. Sledge renders it instead of its own markup, into the light DOM, so your theme's stylesheet applies to it normally.
## Defining one [#defining-one]
Add a script tag with the type `text/x-liquid` and a `slot` naming the part you are replacing:
```html
```
Because this renders into the light DOM, the classes above are styled by your theme's own CSS with no extra work. That is the whole point — you stop reimplementing your card in Sledge's stylesheet and start reusing the one you already have.
## Where to put it [#where-to-put-it]
Add the script tag to the template where the widget appears, or to your theme layout if you want it everywhere. It needs to exist in the page before the widget renders.
## Why prefer this over CSS [#why-prefer-this-over-css]
Replacing markup is more durable than overriding it:
| | Custom CSS against internal markup | Custom Component |
| ----------------------------------------- | ---------------------------------- | ---------------- |
| Depends on Sledge's internal class names | Yes | No |
| Survives a Sledge release changing markup | Not guaranteed | Yes |
| Reuses your theme's existing styles | No | Yes |
| Effort for a structurally different card | High, and grows | One template |
If you find yourself writing a long stylesheet to reshape a card, a Custom Component is almost certainly less work and will age better.
## Keeping behavior [#keeping-behavior]
You are replacing presentation, not behavior. Sledge still handles data, wishlist state, add-to-cart, analytics and re-rendering — it just renders through your template.
Your template runs on every render, including re-renders, so it does not need to guard against being called more than once.
## When you still need CSS [#when-you-still-need-css]
Custom Components replace a widget's markup, not the widget element itself. Layout of the element in your page — width, alignment, margins — is still document-level styling. See [Styling](/customize/styling).
---
# Events (https://docs.sledge-app.com/customize/events)
Sledge dispatches events as things happen on the storefront. Listening to them is the supported way to hook custom behavior in, and it is always preferable to watching the DOM yourself.
There are two namespaces, and the distinction matters.
## Document-level events [#document-level-events]
These use a **colon** and fire on `document`. They are the ones you will use from [custom code](/customize/custom-code):
```js
document.addEventListener('sledge:cart:updated', () => {
// the cart changed — refresh your own UI
})
```
The most useful is `sledge:product-card:rendered`, which fires for every product card, on first render and again on every re-render:
```js
document.addEventListener('sledge:product-card:rendered', (e) => {
const card = e.detail?.card
// A re-render rebuilt the shadow tree, so anything you injected is gone.
// Re-apply here rather than assuming this runs once.
})
```
Others cover the cart, wishlist, reviews and toasts — the full list is in [Reference → Events](/reference/events).
## Element-level events [#element-level-events]
These use a **hyphen** and fire on the element that raised them. They bubble and cross shadow boundaries, so you can listen at the document level, but they tell you about one widget's interaction rather than a global state change:
```js
document.addEventListener('sledge-filter-result', (e) => {
// a filter query returned results
})
```
Use these when you care about a specific interaction — a filter changing, a search suggestion being selected, a sort order changing.
## Choosing an approach [#choosing-an-approach]
### Is there an event for it? [#is-there-an-event-for-it]
Use the event. It is supported, it fires at the right moment, and it costs nothing.
### No event, but it is inside one widget? [#no-event-but-it-is-inside-one-widget]
Observe that widget's shadow root, debounced. `SledgeCC.watch()` in [custom code](/customize/custom-code) does this correctly.
### Neither? [#neither]
Tell us. A missing event is a gap worth closing — see [Support](/support).
Never attach a `MutationObserver` to `document` or `document.documentElement` to watch for Sledge changes. It fires on every DOM change on the page, including your theme's, and is a common cause of storefront jank. Scope it to the specific shadow root instead.
## Full list [#full-list]
[Reference → Events](/reference/events) lists every event in both namespaces, with the feature that fires it.
---
# Customize (https://docs.sledge-app.com/customize)
Most stores never need this page. Sledge picks up your theme's colors, fonts and corner radii on its own, and is tuned for 24 themes out of the box.
When you do want to change something, work down this list. Each step gives you more control and takes more looking after.
### Design tokens [#design-tokens]
Override Sledge's CSS custom properties. Handles most visual differences with a handful of values, and never breaks. See [Styling](/customize/styling).
### Custom CSS [#custom-css]
Restyle the inside of widgets with your own rules. See [Custom code](/customize/custom-code).
### Custom Components [#custom-components]
Replace a widget's markup entirely with a Liquid template of your own, so it renders your theme's card. See [Custom Components](/customize/custom-components).
### Custom JavaScript [#custom-javascript]
Change behavior, react to [events](/customize/events), or restyle host elements. See [Custom code](/customize/custom-code).
## Stability [#stability]
Two tiers apply across this whole section.
**Supported** — custom CSS and JavaScript, design tokens, Custom Components, document-level events, and element tag names. These will not change without a major version and a migration note.
**Escape hatch** — reaching into a widget's shadow root and matching internal class names. This works, and sometimes it is the only way, but internal markup can change in any release. Label it in your code so you know where to look when something breaks.
---
# Styling (https://docs.sledge-app.com/customize/styling)
Sledge widgets are styled in three layers. Understanding which layer you need is the difference between a one-line change and a fight with specificity.
### Base styles [#base-styles]
Sledge's own defaults. Always present, lowest priority.
### Theme bridge [#theme-bridge]
Reads your theme's CSS custom properties — colors, fonts, border radii — and maps them onto Sledge's design tokens. This is why Sledge usually looks like your theme with no configuration.
### Your CSS [#your-css]
Your Custom CSS, applied inside every widget at the highest priority. See [Custom code](/customize/custom-code).
## Start with tokens [#start-with-tokens]
Before writing selectors, try overriding Sledge's design tokens. They are CSS custom properties, they cascade into every widget, and they cannot break when internal markup changes.
```css
:host {
--sledge-color-primary: #1a1a1a;
--sledge-radius: 6px;
--sledge-font-family: Inter, sans-serif;
}
```
`:host` inside Custom CSS refers to the widget element the stylesheet is applied to, so a `:host` rule reaches every widget at once. That makes it the right place for anything global — a font family, a base color, a radius.
Font faces loaded by your theme at document level are available inside shadow roots automatically, so you can set `font-family` to a theme font without loading it again.
## Then target components [#then-target-components]
If tokens are not enough, write rules against the widget's internal structure:
```css
.product-card {
border: 1px solid #dedede;
border-radius: 6px;
overflow: hidden;
}
.product-card .product-title {
font-size: 13px;
letter-spacing: 2px;
}
```
This is the escape hatch tier — internal class names can change between releases. It works, it is how most real customization gets done, but keep a note of where you rely on it.
## Styling the widget element itself [#styling-the-widget-element-itself]
Custom CSS is applied *inside* widgets, so it cannot style the widget elements in your theme's DOM. Anything about a widget's own layout — its alignment, width, margins, whether it is displayed at all — has to be injected at document level from Custom JavaScript:
```js
SledgeCC.style('search-width', 'sledge-search-bar{flex:1 1 100%;max-width:none}')
```
See [Custom code](/customize/custom-code) for the helper.
## Matching a theme Sledge doesn't have a template for [#matching-a-theme-sledge-doesnt-have-a-template-for]
If Sledge ships a [tuned template](/reference/themes) for your theme, widgets already match. If not, work in this order:
1. **Tokens** — set the font, primary color and radius. This alone usually gets close.
2. **Component rules** — adjust card borders, spacing and typography to match your theme's own product card.
3. **[Custom Components](/customize/custom-components)** — if the structure is fundamentally different, replace the markup rather than fighting it with CSS.
Option 3 is often less work than a long stylesheet, and it is more durable, because you own the markup instead of overriding someone else's.
---
# Guide (https://docs.sledge-app.com/guide)
These guides cover configuring and running Sledge from the dashboard. For placing widgets on your storefront, see [Storefront](/storefront).
---
# Blocks (https://docs.sledge-app.com/reference/blocks)
This list always matches the version of Sledge running on your store.
Sledge ships **29 blocks**: 6 app embeds you enable once, and 23 app blocks you place on specific sections.
See [App embeds](/storefront/app-embeds) and [Blocks](/storefront/blocks) for how to add them.
## App embeds [#app-embeds]
Enabled once from **Theme editor → App embeds**. They apply site-wide.
### Reviews Sidebar [#reviews-sidebar]
| Handle | Type | Renders |
| ------------------------------------ | --------- | ------- |
| `embed-review-sticky-sidebar-widget` | App embed | — |
| Setting | Type | Label | Default |
| --------------------- | ---------- | ---------------------- | ------- |
| `position_widget` | `select` | Select Position Widget | `right` |
| `show_rating_average` | `checkbox` | Show Rating Average | `true` |
### Sledge Core [#sledge-core]
| Handle | Type | Renders |
| -------------- | --------- | ------- |
| `embed-script` | App embed | — |
No settings.
### Sledge Cart Drawer [#sledge-cart-drawer]
| Handle | Type | Renders |
| -------------------- | --------- | ---------------------- |
| `sledge-cart-drawer` | App embed | `` |
| Setting | Type | Label | Default |
| --------- | ---------- | ------------------ | ------- |
| `enabled` | `checkbox` | Enable cart drawer | `true` |
### Sledge Promotion Countdown [#sledge-promotion-countdown]
| Handle | Type | Renders |
| ---------------------------- | --------- | ------------------------------ |
| `sledge-promotion-countdown` | App embed | `` |
| Setting | Type | Label | Default |
| --------- | ---------- | ---------------------- | ------- |
| `enabled` | `checkbox` | Enable countdown timer | `true` |
### Sledge Search [#sledge-search]
| Handle | Type | Renders |
| --------------- | --------- | ----------------------- |
| `sledge-search` | App embed | `` |
| Setting | Type | Label | Default |
| --------- | ---------- | ------------------- | ------- |
| `enabled` | `checkbox` | Enable search modal | `true` |
### Sledge Wishlist Overlay [#sledge-wishlist-overlay]
| Handle | Type | Renders |
| ------------------------- | --------- | ---------------------------------------------------- |
| `sledge-wishlist-overlay` | App embed | `` `` |
| Setting | Type | Label | Default |
| --------- | ---------- | -------------------------------- | ------- |
| `enabled` | `checkbox` | Enable wishlist badge and flyout | `true` |
| `url` | `url` | Wishlist page URL | — |
## App blocks [#app-blocks]
Added to a specific section from **Theme editor → Add block**.
### Sledge Free Gift [#sledge-free-gift]
| Handle | Type | Renders |
| ------------------ | --------- | ------------------------ |
| `bundle-free-gift` | App block | `` |
| Setting | Type | Label | Default |
| --------- | ------ | ------------------------------- | ------- |
| `item_id` | `text` | Item ID (from Sledge dashboard) | — |
### Sledge Free Shipping [#sledge-free-shipping]
| Handle | Type | Renders |
| ----------------- | --------- | ------------------------ |
| `bundle-shipping` | App block | `` |
| Setting | Type | Label | Default |
| --------- | ------ | ------------------------------- | ------- |
| `item_id` | `text` | Item ID (from Sledge dashboard) | — |
### Sledge Bundle [#sledge-bundle]
| Handle | Type | Renders |
| --------------- | --------- | ------------------------ |
| `bundle-widget` | App block | `` |
| Setting | Type | Label | Default |
| --------- | ------ | ------------------------------- | ------- |
| `item_id` | `text` | Item ID (from Sledge dashboard) | — |
### Sledge Happy Customers [#sledge-happy-customers]
| Handle | Type | Renders |
| ---------------------- | --------- | --------------------------------- |
| `happy-customers-page` | App block | `` |
| Setting | Type | Label | Default |
| ----------- | ------- | ------------- | ------- |
| `max_width` | `range` | Maximum Width | `1180` |
### Sledge Back in Stock [#sledge-back-in-stock]
| Handle | Type | Renders |
| --------------------- | --------- | ------------------------------ |
| `merch-back-in-stock` | App block | `` |
| Setting | Type | Label | Default |
| ------------ | --------- | --------------------- | ------- |
| `product` | `product` | Product | — |
| `variant_id` | `text` | Variant ID (optional) | — |
| `mode` | `select` | Display mode | `pdp` |
### Sledge Merchandising Badge [#sledge-merchandising-badge]
| Handle | Type | Renders |
| ------------- | --------- | ---------------------- |
| `merch-badge` | App block | `` |
| Setting | Type | Label | Default |
| ---------------------- | ---------- | ----------------------------------- | ---------- |
| `product` | `product` | Product | — |
| `badge_position` | `select` | Badge position | `top-left` |
| `badge_image_position` | `select` | Badge image position | `left` |
| `inline_with_native` | `checkbox` | Inline with native Shopify elements | `false` |
### Sledge Pre-order [#sledge-pre-order]
| Handle | Type | Renders |
| ---------------- | --------- | ------------------------- |
| `merch-preorder` | App block | `` |
| Setting | Type | Label | Default |
| ------------ | --------- | --------------------- | ------- |
| `product` | `product` | Product | — |
| `variant_id` | `text` | Variant ID (optional) | — |
### Sledge Filter + Product Grid [#sledge-filter--product-grid]
| Handle | Type | Renders |
| ---------------- | --------- | ----------------------- |
| `product-filter` | App block | `` |
| Setting | Type | Label | Default |
| -------------------------- | ------------ | -------------------------------------------- | ------- |
| `collection` | `collection` | Select Collection | — |
| `max_width` | `range` | Maximum Width | `1180` |
| `custom_product_card_name` | `text` | Custom Product Card Function Name (optional) | — |
### Recently Viewed [#recently-viewed]
| Handle | Type | Renders |
| ---------------------------------------- | --------- | ------- |
| `product-recommendation-recently-viewed` | App block | — |
| Setting | Type | Label | Default |
| -------------------------- | -------------- | -------------------------------------------- | ------- |
| `custom_product_card_name` | `text` | Custom Product Card Function Name (optional) | — |
| `max_width` | `range` | Maximum Width | `1180` |
| `use_slider` | `select` | Display Style | — |
| `display_limit` | `number` | Display Limit | — |
| `title_text` | `text` | Title Section Text | — |
| `description_text` | `text` | Description Section Text | — |
| `product_list` | `product_list` | Hidden Products | — |
### Sledge Promotion Banner [#sledge-promotion-banner]
| Handle | Type | Renders |
| ------------------ | --------- | --------------------------- |
| `promotion-banner` | App block | `` |
| Setting | Type | Label | Default |
| --------- | ------ | ------------------------------- | ------- |
| `item_id` | `text` | Item ID (from Sledge dashboard) | — |
### Sledge Recommendations [#sledge-recommendations]
| Handle | Type | Renders |
| ----------------------- | --------- | -------------------------------- |
| `recommendation-slider` | App block | `` |
| Setting | Type | Label | Default |
| --------- | ------ | ------------------------------- | ------- |
| `item_id` | `text` | Item ID (from Sledge dashboard) | — |
### Sledge Star Rating [#sledge-star-rating]
| Handle | Type | Renders |
| --------------- | --------- | ------------------------ |
| `review-rating` | App block | `` |
| Setting | Type | Label | Default |
| ------------- | ---------- | -------------------- | -------- |
| `product` | `product` | Product | — |
| `size` | `select` | Size | `medium` |
| `show_count` | `checkbox` | Show review count | `true` |
| `rating_size` | `select` | Rating size (legacy) | `sm` |
### Sledge Review Snippet [#sledge-review-snippet]
| Handle | Type | Renders |
| ---------------- | --------- | ------------------------- |
| `review-snippet` | App block | `` |
| Setting | Type | Label | Default |
| ----------- | --------- | ------------- | ------- |
| `product` | `product` | Product | — |
| `max_width` | `range` | Maximum Width | `400` |
### Sledge Review Sidebar [#sledge-review-sidebar]
| Handle | Type | Renders |
| ----------------------- | --------- | -------------------------------- |
| `review-sticky-sidebar` | App block | `` |
No settings.
### Sledge Trust Badge [#sledge-trust-badge]
| Handle | Type | Renders |
| -------------------- | --------- | ----------------------------- |
| `review-trust-badge` | App block | `` |
| Setting | Type | Label | Default |
| --------------------------- | --------- | -------------------------- | ------------------------ |
| `product` | `product` | Product | — |
| `trust_badge_variant` | `select` | Select Variant | `medium-logo` |
| `trust_badge_fill_color` | `color` | Fill Color | `rgba(35, 188, 69, 1)` |
| `trust_badge_outline_color` | `color` | Outline Color | `rgba(141, 145, 150, 1)` |
| `target_selector` | `text` | Target Selector (optional) | — |
| `target_position` | `select` | Target Position (optional) | — |
| `wrapper_class` | `text` | Wrapper Class (optional) | — |
### Sledge Reviews [#sledge-reviews]
| Handle | Type | Renders |
| --------------- | --------- | ------------------------ |
| `review-widget` | App block | `` |
| Setting | Type | Label | Default |
| ----------- | --------- | ------------- | ------- |
| `product` | `product` | Product | — |
| `max_width` | `range` | Maximum Width | `1180` |
### Instant Search Icon [#instant-search-icon]
| Handle | Type | Renders |
| ------------------- | --------- | ------- |
| `search-icon-popup` | App block | — |
| Setting | Type | Label | Default |
| ------------------------------------- | -------- | ------------------------------------------------------- | ------- |
| `icon_color` | `color` | Icon Color (optional) | — |
| `icon_size` | `select` | Select Icon Size | `sm` |
| `url_search_result` | `url` | URL Search Result (optional) | — |
| `target_selector` | `text` | Target Selector (optional) | — |
| `target_position` | `select` | Target Position (optional) | — |
| `wrapper_class` | `text` | Wrapper Class (optional) | — |
| `custom_product_card_name` | `text` | Custom Product Card Function Name (optional) | — |
| `custom_suggestion_keyword_list_name` | `text` | Custom Suggestion Keyword List Function Name (optional) | — |
| `custom_other_index_list_name` | `text` | Custom Other Index List Function Name (optional) | — |
| `custom_search_view_more_result_name` | `text` | Custom Search View More Result Function Name (optional) | — |
### Sledge Search Results [#sledge-search-results]
| Handle | Type | Renders |
| --------------- | --------- | ------------------------------ |
| `search-result` | App block | `` |
| Setting | Type | Label | Default |
| ----------------------------- | ------- | ----------------------------------------------- | ------- |
| `max_width` | `range` | Maximum Width | `1180` |
| `custom_product_card_name` | `text` | Custom Product Card Function Name (optional) | — |
| `custom_collection_card_name` | `text` | Custom Collection Card Function Name (optional) | — |
| `custom_page_card_name` | `text` | Custom Page Card Function Name (optional) | — |
| `custom_blog_card_name` | `text` | Custom Blog Card Function Name (optional) | — |
| `custom_article_card_name` | `text` | Custom Article Card Function Name (optional) | — |
### Sledge Search Bar [#sledge-search-bar]
| Handle | Type | Renders |
| --------------- | --------- | --------------------- |
| `search-widget` | App block | `` |
| Setting | Type | Label | Default |
| ------------------------------------- | ------- | ------------------------------------------------------- | ------- |
| `max_width` | `range` | Maximum Width | `400` |
| `url_search_result` | `url` | URL Search Result (optional) | — |
| `custom_product_card_name` | `text` | Custom Product Card Function Name (optional) | — |
| `custom_suggestion_keyword_list_name` | `text` | Custom Suggestion Keyword List Function Name (optional) | — |
| `custom_other_index_list_name` | `text` | Custom Other Index List Function Name (optional) | — |
| `custom_search_view_more_result_name` | `text` | Custom Search View More Result Function Name (optional) | — |
### Sledge Wishlist Navbar Icon [#sledge-wishlist-navbar-icon]
| Handle | Type | Renders |
| ---------------- | --------- | ---------------------------------------------------- |
| `wishlist-badge` | App block | `` `` |
| Setting | Type | Label | Default |
| -------------------------- | ---------- | -------------------------------------------- | ------- |
| `icon_color` | `color` | Icon Color (optional) | — |
| `url_wishlist_widget` | `url` | URL Wishlist Widget (optional) | — |
| `use_wishlist_flyout` | `checkbox` | Use Wishlist Flyout | `false` |
| `target_selector` | `text` | Target Selector (optional) | — |
| `target_position` | `select` | Target Position (optional) | — |
| `wrapper_class` | `text` | Wrapper Class (optional) | — |
| `custom_product_card_name` | `text` | Custom Product Card Function Name (optional) | — |
| `preload_element` | `liquid` | Preload Element (optional) | — |
| `url` | `url` | Wishlist URL (v3, optional) | — |
### Sledge Wishlist Button [#sledge-wishlist-button]
| Handle | Type | Renders |
| ------------------------ | --------- | -------------------------- |
| `wishlist-button-detail` | App block | `` |
| Setting | Type | Label | Default |
| ------------ | --------- | --------------------- | ------- |
| `product` | `product` | Product | — |
| `variant_id` | `text` | Variant ID (optional) | — |
### Wishlist Icon [#wishlist-icon]
| Handle | Type | Renders |
| ------------------ | --------- | ------- |
| `wishlist-trigger` | App block | — |
| Setting | Type | Label | Default |
| --------- | --------- | -------------- | ------- |
| `product` | `product` | Select Product | — |
### Wishlist [#wishlist]
| Handle | Type | Renders |
| ----------------- | --------- | -------------------------- |
| `wishlist-widget` | App block | `` |
| Setting | Type | Label | Default |
| -------------------------- | ------- | -------------------------------------------- | --------------------- |
| `max_width` | `range` | Maximum Width | `1180` |
| `limit_options` | `text` | Limit Options (optional) | `12, 24, 36, 48, 120` |
| `custom_product_card_name` | `text` | Custom Product Card Function Name (optional) | — |
---
# Elements (https://docs.sledge-app.com/reference/elements)
This list always matches the version of Sledge running on your store.
Sledge registers **59 custom elements**. Each renders into its own shadow root, so theme CSS cannot reach inside and Sledge styles cannot leak out.
Element tag names are a supported API. The class names *inside* a shadow root are not — see [Custom code](/customize/custom-code) for the stability policy.
## Bundle [#bundle]
| Element | Observed attributes |
| ------------------------ | ------------------- |
| `` | — |
| `` | — |
| `` | — |
## Cart Drawer [#cart-drawer]
| Element | Observed attributes |
| ---------------------------- | ------------------- |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
## Core [#core]
| Element | Observed attributes |
| --------------------------- | -------------------------- |
| `` | `drawer-title`, `position` |
| `` | `popup-title`, `max-width` |
| `` | `variant` |
| `` | — |
## Filter [#filter]
| Element | Observed attributes |
| --------------------------- | ------------------- |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
## Merchandising [#merchandising]
| Element | Observed attributes |
| ----------------------------------- | ---------------------------------------------------------------------- |
| `` | `product-id`, `variant-id`, `mode` |
| `` | — |
| `` | — |
| `` | `product-id`, `variant-id` |
| `` | — |
| `` | — |
| `` | — |
| `` | `original-price`, `final-price`, `discount-label`, `compact`, `single` |
## Promotion [#promotion]
| Element | Observed attributes |
| ------------------------------ | ------------------- |
| `` | — |
| `` | — |
## Quick Add Modal [#quick-add-modal]
| Element | Observed attributes |
| -------------------------- | ------------------- |
| `` | `open` |
## Recommendation [#recommendation]
| Element | Observed attributes |
| -------------------------------- | ------------------- |
| `` | — |
## Review [#review]
| Element | Observed attributes |
| --------------------------------- | ---------------------------------------------------- |
| `` | — |
| `` | — |
| `` | — |
| `` | `product-id`, `value`, `count`, `size`, `show-count` |
| `` | `product-id`, `data-width-element` |
| `` | — |
| `` | — |
| `` | `product-id` |
## Search [#search]
| Element | Observed attributes |
| ------------------------------ | ------------------- |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
| `` | — |
## Shared [#shared]
| Element | Observed attributes |
| ---------------------- | -------------------------------------------------------------------- |
| `` | `value`, `max`, `size`, `fill-color`, `outline-color`, `interactive` |
| `` | — |
## Wishlist [#wishlist]
| Element | Observed attributes |
| --------------------------- | ---------------------------------- |
| `` | `floating`, `url` |
| `` | `product-id`, `product-variant-id` |
| `` | — |
| `` | `product-id`, `product-variant-id` |
| `` | `share-id` |
---
# Events (https://docs.sledge-app.com/reference/events)
This list always matches the version of Sledge running on your store.
Sledge dispatches **54 events** in two namespaces.
**Document-level** events use a colon (`sledge:`) and fire on `document`. These are the ones custom code listens to. There are 19.
**Element-level** events use a hyphen (`sledge-`) and fire on the element that raised them, bubbling and crossing shadow boundaries. There are 35.
```js
document.addEventListener('sledge:product-card:rendered', (e) => {
const card = e.detail?.card
// A re-render rebuilds the shadow tree, so this fires again. Re-apply, do not assume once.
})
```
## Document-level [#document-level]
| Event | Dispatched by |
| ------------------------------------- | ---------------------------------------------- |
| `sledge:bundle:added` | Bundle, Merchandising |
| `sledge:cart-add` | Compat |
| `sledge:cart:added` | Merchandising |
| `sledge:cart:updated` | Bundle, Cart Drawer, Core, Quick Add Modal |
| `sledge:product-card:rendered` | Core, Filter, Recommendation, Search, Wishlist |
| `sledge:product-card:variant-changed` | Core |
| `sledge:product-click` | Compat |
| `sledge:quick-add-modal:open` | Core |
| `sledge:rating:change` | Shared |
| `sledge:review:detail` | Compat, Review |
| `sledge:review:openform` | Compat, Review |
| `sledge:review:submitted` | Compat, Review |
| `sledge:toast:show` | Bundle, Cart Drawer, Core, Review, Wishlist |
| `sledge:wishlist-added` | Compat |
| `sledge:wishlist:atc` | Core |
| `sledge:wishlist:changed` | Compat, Services, Wishlist |
| `sledge:wishlist:cleared` | Compat, Wishlist |
| `sledge:wishlist:flyout:open` | Wishlist |
| `sledge:wishlist:settings-changed` | Wishlist |
## Element-level [#element-level]
| Event | Dispatched by |
| --------------------------------- | -------------- |
| `sledge-bundle-badge-click` | Core |
| `sledge-cart-bundle-update` | Cart Drawer |
| `sledge-cart-gift-variant-change` | Cart Drawer |
| `sledge-cart-quantity-change` | Cart Drawer |
| `sledge-cart-remove` | Cart Drawer |
| `sledge-cart-subscription-change` | Cart Drawer |
| `sledge-compare-toggle` | Filter |
| `sledge-config-change` | Core |
| `sledge-drawer-close` | Core |
| `sledge-filter-clear-all` | Filter |
| `sledge-filter-clear-group` | Filter |
| `sledge-filter-radio-select` | Filter |
| `sledge-filter-range-change` | Filter |
| `sledge-filter-remove` | Filter |
| `sledge-filter-result` | Filter |
| `sledge-filter-select-change` | Filter |
| `sledge-filter-toggle` | Filter |
| `sledge-filter-tree-toggle` | Filter |
| `sledge-layout-change` | Filter |
| `sledge-load-more` | Filter |
| `sledge-merch-preview-change` | Core |
| `sledge-merch-tab-change` | Merchandising |
| `sledge-page-change` | Filter |
| `sledge-perpage-change` | Filter |
| `sledge-popup-close` | Core |
| `sledge-preview-cart-state` | Core |
| `sledge-search` | Filter, Search |
| `sledge-search-focus` | Search |
| `sledge-search-select` | Search |
| `sledge-search-tag-click` | Search |
| `sledge-search-view-more` | Search |
| `sledge-settings-ready` | Core |
| `sledge-sort-change` | Filter |
| `sledge-strategy-change` | Recommendation |
| `sledge-template-ready` | Themes |
---
# Reference (https://docs.sledge-app.com/reference)
This section is for looking things up, not reading end to end. Start with the page closest to what you are trying to do.
| Page | Count | What it covers |
| ------------------------------- | ----- | -------------------------------------------------------------- |
| [Elements](/reference/elements) | 59 | Every widget Sledge can put on your storefront |
| [Blocks](/reference/blocks) | 29 | What you can add in the theme editor, and every setting it has |
| [Events](/reference/events) | 54 | Moments you can hook your own code into |
| [Surfaces](/reference/surfaces) | 13 | The identifiers behind each place an offer can appear |
| [Themes](/reference/themes) | 43 | Themes Sledge already knows how to match |
---
# Surfaces (https://docs.sledge-app.com/reference/surfaces)
This list always matches the version of Sledge running on your store.
A **surface** is a location on the storefront where Sledge widgets can appear. Sledge detects the current surface automatically from the URL and the page markup — you never set it manually.
| Surface |
| --------------------- |
| `homepage` |
| `plp` |
| `pdp` |
| `cart-page` |
| `cart-drawer` |
| `checkout` |
| `instant-search` |
| `search-page` |
| `bundle-listing-page` |
| `wishlist-page` |
| `global` |
| `not-found` |
| `thank-you` |
---
# Themes (https://docs.sledge-app.com/reference/themes)
This list always matches the version of Sledge running on your store.
Sledge ships a theme configuration for **43 Shopify themes**. A configuration tells Sledge where that theme puts its product form, grid and description, and which of its CSS variables to read for colours, fonts and radii.
Depth of match varies by theme. Some are measured against the live theme so widgets match its product card exactly; others carry a baseline configuration that gets the placement and palette right. For which themes are fully tuned, see the [theme pages on the Sledge site](https://sledge-app.com/themes/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=page-cta\&utm_content=reference-themes).
On a theme with no configuration, Sledge falls back to its own design and still reads your theme's CSS variables. Everything works — it just needs more tuning to match exactly. See [Styling](/customize/styling).
## Themes with a configuration [#themes-with-a-configuration]
`atelier` · `baseline` · `colorblock` · `concept` · `craft` · `crave` · `dawn` · `dwell` · `empire` · `enterprise` · `envy` · `fabric` · `heritage` · `horizon` · `hyper` · `impact` · `impulse` · `maranello` · `origin` · `paper` · `pitch` · `prestige` · `publisher` · `pursuit` · `refresh` · `ride` · `rise` · `ritual` · `savor` · `sense` · `spotlight` · `studio` · `supply` · `taiga` · `tailor` · `taste` · `tinker` · `trade` · `turbo` · `unicorn` · `vessel` · `volume` · `warehouse`
---
# Get started (https://docs.sledge-app.com/start)
No code. No script to paste. No theme file to edit. You flip one switch in your theme editor and Sledge is live.
Not installed yet? Every plan has a 14-day free trial and development stores are free.
**[Get Sledge on the Shopify App Store](https://apps.shopify.com/sledge?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=page-cta\&utm_content=start-index)**
Three steps and your store is running it:
### Enable Sledge Core [#enable-sledge-core]
One app embed switch in the theme editor turns Sledge on for the whole store. See [Install](/start/install).
### Add the widgets you want [#add-the-widgets-you-want]
Search, filters, bundles, reviews and the rest are added as blocks on the sections where they belong. See [Storefront](/storefront).
### Configure from the dashboard [#configure-from-the-dashboard]
Everything else — search relevance, filter groups, merchandising rules, bundle offers — is configured in Sledge, not in the theme. See [Guide](/guide).
## Three things worth knowing up front [#three-things-worth-knowing-up-front]
**Sledge knows where it is.** You never tell it "this is a collection page." It works out which [surface](/start/surfaces) a shopper is on and shows only what belongs there — which is also why an offer can be configured and still not appear.
**Your theme's look carries over.** Sledge reads your theme's colors, fonts and corner radii, and is tuned for 24 themes out of the box. See [Themes](/start/themes).
**Nothing you add can break your theme.** Sledge widgets are sealed off from your theme's CSS and JavaScript, in both directions. That's what makes it safe on any theme — and it's the one thing to understand before writing [custom code](/customize/custom-code).
---
# Install Sledge (https://docs.sledge-app.com/start/install)
Four clicks in your theme editor and Sledge is live on your store. No code, no theme files touched, and the same switch turns it back off.
Every plan comes with a 14-day free trial, and development stores are free.
**[Install Sledge from the Shopify App Store](https://apps.shopify.com/sledge?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=page-cta\&utm_content=start-install)**
### Install the app [#install-the-app]
Install Sledge from the [Shopify App Store](https://apps.shopify.com/sledge?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=page-cta\&utm_content=start-install-step). This adds the app to your store and makes the theme app extension available to your themes.
### Open the theme editor [#open-the-theme-editor]
In Shopify admin go to **Online Store → Themes**, then click **Customize** on the theme you want Sledge on.
### Enable Sledge Core [#enable-sledge-core]
In the left sidebar, open **App embeds** and switch on **Sledge Core**.
This is the only required step. It loads the Sledge runtime on every page of your storefront.
### Save [#save]
Click **Save**. Sledge is now live on that theme.
App embeds are per-theme. If you publish a different theme, or duplicate your theme to work on it, enable **Sledge Core** on that theme too.
## What happens after you enable it [#what-happens-after-you-enable-it]
Sledge loads, detects the current [surface](/start/surfaces), reads your settings, and renders only the widgets that are both configured and enabled for that surface.
Some widgets appear immediately once configured in the dashboard, because they inject into known positions in your theme. Others — a search bar in your header, a review widget in a specific spot on the product page — need you to place a block where you want them. See [Storefront](/storefront).
## Verifying the install [#verifying-the-install]
Open your storefront and check any of the following:
* A Sledge widget you have configured appears on the page.
* In your browser's element inspector, elements with names beginning `sledge-` are present in the page.
* Search or filtering behaves differently from your theme's built-in version.
If nothing appears, work through [Troubleshooting](/support/troubleshooting).
## Removing Sledge [#removing-sledge]
Switch **Sledge Core** off in **App embeds** and save. Every Sledge widget stops rendering immediately, and your theme's own search, filtering and layout take over again. Uninstalling the app from Shopify admin does the same thing.
Sledge never writes to your theme files, so nothing is left behind. Your configuration is kept, so re-enabling restores everything as it was.
## What to do next [#what-to-do-next]
---
# Surfaces (https://docs.sledge-app.com/start/surfaces)
A **surface** is a place on your store where shoppers decide: the homepage, instant search, the search results, a collection, the product page, either cart, the 404 page, or the thank-you page.
Sledge places offers across all nine, each offer type on the surfaces where it sells. Your best offer stops living in one place.
Sledge works out which surface a shopper is on automatically, from the URL and the page. You never configure that. What you choose is **which offers appear on which surfaces**, and that lives in the Sledge dashboard.
## The nine surfaces [#the-nine-surfaces]
| Surface | The moment |
| ------------------ | ----------------------------------------------------------------------------------------------- |
| **Homepage** | They just arrived and have decided nothing. Lead with what's moving. |
| **Instant search** | They're telling you exactly what they want, as they type. |
| **Search results** | They searched and they're deciding. Boost the right products, recover a dead-end query. |
| **Collection** | They're browsing with intent. Lead with bestsellers, bury sold-out. |
| **Product page** | They're weighing one product. The bundle, the volume deal, the back-in-stock form. |
| **Cart drawer** | One tap from buying or leaving. Free-shipping bar, last-second upsell, the gift that auto-adds. |
| **Cart page** | The considered version of the same moment, for the shopper who opened the full page. |
| **404 page** | A dead link is still a shopper. Show them something to buy. |
| **Thank-you page** | They already bought, card still warm. A post-purchase offer they add in a tap. |
Each offer carries its own per-surface switches, so you decide exactly where it appears — and you can **preview it on any surface before publishing**. See [Placement](/storefront/placement).
For which offer types can go on which surface, see the [full matrix on the Sledge site](https://sledge-app.com/surfaces/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=page-cta\&utm_content=start-surfaces).
## Why a widget might not appear [#why-a-widget-might-not-appear]
Surfaces are the most common reason something is configured but invisible. A bundle enabled only for the product page will not show on a collection page, no matter where you place the block.
When a widget is missing, check in this order:
1. Is the offer enabled for **this surface** in the dashboard?
2. Is there a block placed on this page, for widgets that need one?
## Where on the page it lands [#where-on-the-page-it-lands]
Knowing the surface decides *whether* Sledge renders. Where on the page comes from one of three things, in priority order:
1. **A selector** you set on the widget in the dashboard.
2. **A block** you placed in the theme editor.
3. **The default position** from Sledge's configuration for your theme.
See [Placement](/storefront/placement).
## Surface identifiers [#surface-identifiers]
Writing [custom code](/customize/custom-code)? Each surface has a short identifier you'll see in settings and events — `pdp` for the product page, `plp` for a collection. A few extra identifiers exist for widgets that run everywhere rather than on one surface. They're all listed in [Reference → Surfaces](/reference/surfaces).
---
# Themes (https://docs.sledge-app.com/start/themes)
Sledge detects your theme and adapts to it: cards, colors, drawer, badges. It never touches your theme files.
Tuned for 24 themes, Dawn and Horizon included, and graceful on the rest. You can [check your theme on the Sledge site](https://sledge-app.com/themes/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=page-cta\&utm_content=start-themes).
## What "tuned" means [#what-tuned-means]
On a tuned theme, Sledge has been measured against the live theme, so widgets match its product card, typography, spacing and controls with no configuration from you.
On any other theme, Sledge falls back to its own design while still reading your theme's CSS variables for colors, fonts and border radii. Everything works and nothing looks broken — it may just not match your product cards exactly.
If you want a closer match, work in this order:
1. **[Design tokens](/customize/styling)** — set the font, primary color and radius. This alone usually gets close.
2. **Component rules** — adjust card borders, spacing and typography to match your own product card.
3. **[Custom Components](/customize/custom-components)** — if the structure is fundamentally different, replace the markup rather than fighting it with CSS.
Option 3 is often less work than a long stylesheet, and it is more durable, because you own the markup.
## Uninstalling leaves nothing behind [#uninstalling-leaves-nothing-behind]
Sledge adds no code to your theme files. Switch off the **Sledge Core** app embed, or uninstall the app, and your theme is exactly as it was.
## Changing themes [#changing-themes]
Sledge re-detects your theme on every page load, so switching themes does not require reconfiguring anything. Two things do need attention:
* **Enable Sledge Core** on the new theme. App embeds are stored per-theme.
* **Re-place any blocks** you added, since blocks live in theme settings.
Your dashboard configuration — search settings, filter groups, merchandising rules, bundle offers — is stored with your store, not your theme, and is unaffected.
To check whether your theme is one Sledge already knows, see [Reference → Themes](/reference/themes).
---
# App embeds (https://docs.sledge-app.com/storefront/app-embeds)
Some Sledge features don't sit in one spot on the page — they slide in, drop down or float above it. The cart drawer, the search overlay, the wishlist panel. You switch those on once and they work across your whole store.
## Enabling an embed [#enabling-an-embed]
### Open the theme editor [#open-the-theme-editor]
**Online Store → Themes → Customize**.
### Open App embeds [#open-app-embeds]
Click the **App embeds** icon in the left sidebar. Every app embed available on your theme is listed.
### Switch on the embeds you want [#switch-on-the-embeds-you-want]
Some carry settings — expand the embed to see them.
### Save [#save]
## What's available [#whats-available]
**Sledge Core** is required. It loads the runtime and is what [Install](/start/install) walks you through.
The remaining embeds cover features that float above the page rather than sitting in it:
* **Cart drawer** — replaces your theme's cart drawer with the Sledge one. Progress goal toward free shipping, countdown timer, product recommendations, a free gift that auto-adds, subscription toggle, trust badges, shipping protection, order notes and discount codes — each switched on or off independently.
* **Search** — the instant search overlay that opens over the page.
* **Wishlist overlay** — the wishlist flyout panel.
* **Promotion countdown** — a countdown that can appear across the store.
For the complete list, with every setting each one exposes, see [Reference → Blocks](/reference/blocks).
## Embeds are per-theme [#embeds-are-per-theme]
App embed settings are stored on the theme, not on your store. That means:
* Publishing a different theme requires enabling the embeds again on that theme.
* Duplicating a theme carries the embeds across, because the duplicate inherits its settings.
* Disabling an embed only affects the theme you are editing.
A common cause of "Sledge disappeared" is publishing a theme that never had **Sledge Core** enabled. Check the published theme's app embeds first.
## Turning a feature off [#turning-a-feature-off]
Switch the embed off and save. The feature stops rendering immediately, and your theme's own equivalent takes over — your theme's cart drawer, your theme's search.
Your configuration in the Sledge dashboard is untouched, so switching it back on restores everything.
---
# App blocks (https://docs.sledge-app.com/storefront/blocks)
Want the search bar in your header, the review widget under the product description, the filter panel beside your collection grid? That's a block. You drag it exactly where you want it, and it stays there.
Unlike [app embeds](/storefront/app-embeds), which switch on store-wide, a block belongs to one section on one template.
## Adding a block [#adding-a-block]
### Navigate to the page you want [#navigate-to-the-page-you-want]
In the theme editor, use the template dropdown at the top to switch to the template you're editing — Product, Collection, Search, and so on.
### Pick the section [#pick-the-section]
In the left sidebar, find the section where the widget should appear, and click **Add block**.
### Choose the Sledge block [#choose-the-sledge-block]
Sledge blocks are grouped under the app's name in the block picker.
### Position and configure it [#position-and-configure-it]
Drag the block to where you want it within the section, then set its options in the right-hand panel.
### Save [#save]
## What's available [#whats-available]
Blocks cover the widgets that occupy a position in your layout:
| Area | Blocks |
| ------------------ | --------------------------------------------------------------------- |
| **Search** | Search bar, search results panel, search icon |
| **Filter** | Filter panel |
| **Review** | Review widget, rating, snippet, trust badge, happy customers, sidebar |
| **Wishlist** | Wishlist widget, wishlist button, badge, trigger icon |
| **Bundle** | Bundle widget, free gift, shipping |
| **Merchandising** | Badge, pre-order, back in stock |
| **Promotion** | Promotion banner |
| **Recommendation** | Recommendation slider, recently viewed |
Every block, with all of its settings, defaults and the element it renders, is in [Reference → Blocks](/reference/blocks).
## If a block renders nothing [#if-a-block-renders-nothing]
A placed block still renders nothing unless the feature behind it is configured and enabled for the current [surface](/start/surfaces). Work through this order:
1. Is **Sledge Core** enabled on this theme?
2. Is the feature configured in the Sledge dashboard?
3. Is it enabled for **this surface**?
4. Is the block on the template you're actually viewing?
Shopify's theme editor previews a template, not a specific product or collection. A block that looks empty in the editor may render correctly on a real storefront URL where there is data to show. Check the live storefront before moving things.
## Blocks and theme updates [#blocks-and-theme-updates]
Blocks are stored in your theme's settings. Updating your theme through Shopify preserves them. Replacing your theme with a fresh copy does not — you will need to place them again.
---
# Storefront (https://docs.sledge-app.com/storefront)
This section covers putting Sledge widgets on the page. All of it happens in the Shopify theme editor. None of it requires editing theme code.
There are two kinds of thing you add:
| | What it is | Where you add it | Applies to |
| --------------------------------------- | ------------------------------------------ | ----------------------------- | ------------ |
| **[App embed](/storefront/app-embeds)** | A site-wide feature with no fixed position | **App embeds** in the sidebar | Every page |
| **[App block](/storefront/blocks)** | A widget placed in a specific spot | **Add block** on a section | That section |
App embeds are for things that float above the page or attach themselves — the cart drawer, the search overlay, the wishlist overlay. You switch them on once.
App blocks are for things that occupy a position in your layout — a search bar in the header, a review widget under the product description, a filter panel beside a collection grid. You place them where you want them.
## The order to do things [#the-order-to-do-things]
### Enable Sledge Core [#enable-sledge-core]
Nothing else works until this is on. See [Install](/start/install).
### Configure the feature in Sledge [#configure-the-feature-in-sledge]
A block renders nothing if the feature behind it is not configured and enabled for that [surface](/start/surfaces). Configuration lives in the Sledge dashboard — see [Guide](/guide).
### Add the embed or block [#add-the-embed-or-block]
Switch on the app embed, or place the block on the section where it belongs.
If a widget does not appear, it is almost always step 2 — the feature is not enabled for the surface you are looking at. Check that before moving blocks around.
## Full inventory [#full-inventory]
Every embed and block, with all of its theme editor settings, is listed in [Reference → Blocks](/reference/blocks).
---
# Placement (https://docs.sledge-app.com/storefront/placement)
The [surface](/start/surfaces) decides whether a widget shows up at all. This page is about where on the page it lands.
## Resolution order [#resolution-order]
For each widget on each surface, Sledge resolves a position by taking the first of these that exists:
### An explicit selector [#an-explicit-selector]
If you set a placement selector on the widget in the Sledge dashboard, that wins. Sledge finds the element matching your CSS selector and inserts relative to it.
### A placed block [#a-placed-block]
If you added an [app block](/storefront/blocks) in the theme editor, the widget renders exactly where that block sits.
### The theme default [#the-theme-default]
Sledge's template for your theme knows where the product form, the grid and the description sit, and inserts there. This is why widgets often appear correctly with no placement work at all.
If none resolves, the widget does not render. That is deliberate — it is better than injecting into an unpredictable position.
## Position within the target [#position-within-the-target]
Alongside the selector, each surface has a position: insert **at the top** of the matched element, or **at the bottom**. For most widgets top and bottom are the only sensible options; a selector plus a position covers nearly every layout.
## Preview before you publish [#preview-before-you-publish]
You do not have to guess how an offer will look, and you do not have to publish it to find out.
Every offer can be previewed on every surface it is enabled for, before it goes live. Turn a surface on, preview it, and see the bundle sitting in the search results or the collection grid exactly as a shopper would — then publish when it looks right.
This is the fastest way to answer "will this land in the right place on my theme?" without experimenting on live traffic.
Once it is live, [A/B testing](/guide/bundles) takes over: run a variant alongside it, split the traffic, and compare revenue per variant before choosing a winner.
## Multiple instances [#multiple-instances]
Bundle, recommendation and promotion widgets support **multi-instance placement**: several configured items can render at once, on different surfaces, each with its own position.
A store might run a volume-discount bundle on product pages, a free-gift bundle in the cart drawer, and a build-your-own-bundle on a dedicated page — all simultaneously, each placed independently.
Each configured item carries its own per-surface settings, so enabling one on a new surface never disturbs the others.
## Choosing a good selector [#choosing-a-good-selector]
If you do set an explicit selector, prefer one that survives theme updates:
* **Good** — a stable structural class your theme has had for a long time, or an id.
* **Risky** — generated class names, deeply nested descendant chains, `nth-child` positions.
A selector that stops matching does not break the page; the widget simply falls back to nothing rendering there. If a widget disappears after a theme update, an over-specific selector is the first thing to check.
## When placement is not enough [#when-placement-is-not-enough]
If the widget lands in the right place but does not *look* right, that is a styling problem rather than a placement one. See [Styling](/customize/styling), and [Custom Components](/customize/custom-components) if you need to replace the markup entirely.
---
# Support (https://docs.sledge-app.com/support)
## Before you get in touch [#before-you-get-in-touch]
Most issues resolve in a couple of minutes with [Troubleshooting](/support/troubleshooting), which is organised by symptom rather than by feature.
## How to reach us [#how-to-reach-us]
Use the **Support** button in the corner of any page here, or the same button inside the Sledge dashboard — both reach the same team and search the same help articles.
For questions about plans, pricing or whether Sledge fits your store, see [the Sledge site](https://sledge-app.com/?utm_source=sledge-docs\&utm_medium=docs\&utm_campaign=page-cta\&utm_content=support-index).
## Reporting a problem [#reporting-a-problem]
Include these and we can usually answer on the first reply:
* **Your store URL** and the exact page where the problem appears.
* **What you expected** and what happened instead.
* **The theme** you are using, and whether the problem appears on other themes.
* **Whether custom code is involved** — if you have Custom CSS or JavaScript configured, try disabling it briefly to narrow things down.
* **A screenshot**, if it is visual.
If a widget is not appearing, tell us whether it is configured and enabled for that [surface](/start/surfaces) — that is the single most common cause and knowing you have checked it saves a round trip.
## Reporting a gap [#reporting-a-gap]
If the only way to achieve something was to reach into a widget's shadow root and match internal class names, that is a gap in the supported API, not just a workaround. Tell us what you were trying to do. Those reports are how the supported surface grows.
Same for missing [events](/customize/events): if you had to use a `MutationObserver` because nothing was dispatched at the moment you needed, we would like to know.
---
# Troubleshooting (https://docs.sledge-app.com/support/troubleshooting)
Find what you're seeing below. Most of these take a minute to fix.
## A widget is not appearing [#a-widget-is-not-appearing]
Work through these in order. The cause is nearly always in the first two.
### Is Sledge Core enabled on the published theme? [#is-sledge-core-enabled-on-the-published-theme]
App embeds are per-theme. Publishing or duplicating a theme does not carry them across. Open the theme editor on the **published** theme and confirm **Sledge Core** is on under App embeds.
### Is the feature enabled for this surface? [#is-the-feature-enabled-for-this-surface]
A widget renders only where it is enabled. A bundle enabled for product pages will not appear on a collection page. Check the feature's per-surface settings in the Sledge dashboard, and confirm the [surface](/start/surfaces) you are on is the one you think.
### Does the widget need a block? [#does-the-widget-need-a-block]
Some widgets inject automatically; others need an [app block](/storefront/blocks) placed where you want them. Confirm the block is on the template you are viewing.
### Is there data to show? [#is-there-data-to-show]
A recommendation slider with no qualifying products, or a review widget on a product with no reviews, renders nothing by design.
The theme editor previews a template, not a real product or collection. A widget can look empty there and render correctly on the live storefront. Always confirm on a real URL before moving things.
To check an offer without publishing it, use Sledge's own preview instead — it renders the offer on the surface exactly as a shopper would see it. See [Placement](/storefront/placement).
## My custom CSS is not applying [#my-custom-css-is-not-applying]
Almost always one of two causes.
**You are targeting the widget element.** Custom CSS is applied *inside* widgets, so a rule targeting `sledge-product-card`, `sledge-wishlist-badge` or any other `sledge-*` element never matches. Those need a document-level style injected from Custom JavaScript — see [Custom code](/customize/custom-code).
**The value is set inline.** Some values are set directly on elements, and inline styles beat stylesheets. Add `!important`, and leave a comment saying why so a later reader knows it was necessary.
## My changes disappear after interacting with the page [#my-changes-disappear-after-interacting-with-the-page]
Sledge re-renders widgets when their data changes — filtering, paginating, changing a variant. A re-render rebuilds the widget's internals, discarding anything you injected.
Re-apply your change on every render rather than once at startup:
```js
SledgeCC.onCard((card) => {
// runs on first render and on every re-render
})
```
See [Custom code](/customize/custom-code).
## A widget is in the wrong place [#a-widget-is-in-the-wrong-place]
Placement resolves in a fixed order: an explicit selector you set, then a placed block, then the default position for your theme. Check them in that order — an old selector in the dashboard will override a block you just placed.
If a widget moved or vanished after a theme update, an over-specific selector is the likely cause. See [Placement](/storefront/placement).
## Widgets don't match my theme [#widgets-dont-match-my-theme]
Sledge picks up your theme's colors, fonts and corner radii automatically, and is tuned for 24 themes. If yours isn't one of them, work up in this order:
1. **[Design tokens](/customize/styling)** — font, primary color, radius. Usually gets close.
2. **Component rules** — match card borders, spacing and typography.
3. **[Custom Components](/customize/custom-components)** — replace the markup with your theme's own card.
If you are writing a long stylesheet, jump to step 3. It is usually less work and it does not break when internal markup changes.
## Search or filter results look wrong [#search-or-filter-results-look-wrong]
Sledge keeps its own index of your catalogue rather than querying Shopify on every request, which is what makes it fast. Right after a catalogue change, the index may briefly lag.
If results stay wrong, check indexing status in the Sledge dashboard and confirm the products are eligible for the collection or query you are testing.
## Something broke after I added custom code [#something-broke-after-i-added-custom-code]
Disable Custom JavaScript, reload, and confirm the problem disappears. If it does, re-enable and check your browser console for warnings prefixed `[sledge-cc]`.
The most common causes are querying for Sledge elements at the top level of your script — they do not exist yet — and forgetting to re-apply changes after a re-render. Both are covered in [Custom code](/customize/custom-code).
---
# Analytics Documentation (https://docs.sledge-app.com/guide/analytics/analytics-documentation)
**Analytics** answers one question: what is Sledge actually earning you? Every number here is revenue Sledge can take credit for — an order where a customer interacted with one of your Sledge widgets before buying — not your whole store’s revenue.
The six tabs across the top are the same data cut six different ways. Rather than reading them in order, it helps to know which question each one answers:
* **Overview** — how much, in total?
* **By Surfaces** — *where* in the store did it happen?
* **By Features** — *which tool* earned it?
* **By Goals** — is it moving the outcome I care about?
* **Journey Performance** — where are customers dropping out?
* **Signals** — what are customers telling me they want?
The filters in the top-right apply to every tab: the date range (**Today**), **No comparison** to compare against a previous period, plus **All traffic** and **All channels**. **Export** downloads what you’re looking at.
## Overview — the headline number [#overview--the-headline-number]
**Revenue from Sledge this period** sits at the top, with the order count beneath it and the change against the previous period. Under that, a breakdown by feature shows which tools contributed, then the core metrics: **Revenue**, **Sessions**, **Conversion rate**, and their trends.
Start here to see whether Sledge is earning at all, then use the other tabs to find out why. If your plan has a revenue allowance, the progress bar here also shows how much of it you’ve used.
## By Surfaces — where it happened [#by-surfaces--where-it-happened]
A card per surface — **Homepage**, **Collection Page**, **Product Page**, **Instant Search**, **Search Page**, **Cart Drawer** and the rest — each with its own **Revenue**, **Sessions** and **CVR**.
This is the most actionable tab in the whole section, because it tells you which parts of your store are pulling their weight. In the example above, Product Page shows **$93.42** from 2 sessions at **50% CVR**, while Homepage sits at **$0.00** from 4 sessions and Instant Search and Search Page show only a dash.
**Read a dash as “not measured”, not “not working”.** A surface with no Sledge widget enabled cannot record anything — there is nothing there for a customer to interact with. Zero revenue on a surface you never switched on isn’t a result; it’s a blind spot.
## Why switching on more surfaces matters [#why-switching-on-more-surfaces-matters]
It’s tempting to enable Sledge on one page, see revenue, and stop. That leaves two things on the table.
**First, coverage.** Customers don’t arrive in one place. Some land on a collection page from an ad, some search, some go straight to a product. Each surface you enable is another point where Sledge can help — and another point where it can be measured. The example above makes this concrete: all the revenue is on Product Page because that’s where the bundle runs. The four homepage sessions produced nothing measurable, not because the homepage is worthless, but because nothing was running on it.
**Second, and less obvious: surfaces are how Sledge learns.** Every interaction is a data point — what customers searched, which filters they used, what they ignored, where they gave up. One surface produces a thin trickle. Several surfaces produce enough for a *pattern* to form, and patterns are what turn raw numbers into the recommendations in **Signals** and **Journey Performance**.
This is why a new store sees empty panels. It isn’t broken — there simply isn’t enough behaviour recorded yet to say anything trustworthy. The fastest way through that phase is to give Sledge more places to observe, then let real traffic accumulate.
## By Features — which tool earned it [#by-features--which-tool-earned-it]
The same revenue, split by tool instead of by page: **Search**, **Product Filter**, **Merchandising**, **Bundle, Discount & Upsell**, **Product Recommendation**, **Cart Drawer**. Each card carries a trend line, its **Revenue**, and its **Lift**.
Use this to decide where your effort goes. In the example, Bundle, Discount & Upsell is carrying everything at **$93.42** while the rest show a dash — a clear sign the other tools either aren’t configured or aren’t placed anywhere customers meet them.
## By Goals — is it moving the needle [#by-goals--is-it-moving-the-needle]
Nine business outcomes rather than features: **Improve product discovery**, **Improve search relevance**, **Improve collection browsing**, **Increase product page conversion**, **Increase average order value (AOV)**, **Increase cart conversion**, **Improve campaign performance**, **Increase repeat purchase**, and **Recover dead ends**.
Each card shows how many **features** and **placements** are working toward that goal and the **Lift** they’ve produced. It’s the quickest way to spot a goal you care about that has nothing assigned to it — a card reading *0 features, 0 placements* is a goal you’ve left unattended.
## Journey Performance — where customers drop out [#journey-performance--where-customers-drop-out]
A session-based funnel across four stages, each with a **step-through** rate:
* **Discovery** — all sessions entering the storefront.
* **Consideration** — customers view product details but haven’t added to cart.
* **Decision** — items are in the cart and the customer is heading to checkout.
* **Purchase** — the order is placed.
Below the funnel, **Re-purchase** tracks how many orders came from returning customers, and **Biggest drop-offs** ranks the leaks — for example *Discovery → Consideration* at 25%, meaning three of four visitors never reached a product page. Each leak has a **View opportunities** button that takes you to what Sledge suggests doing about it.
Read this tab as a diagnosis: the stage with the worst step-through is where your next change should go.
## Signals — what customers are telling you [#signals--what-customers-are-telling-you]
Signals is the qualitative side — intent rather than money:
* **Top search terms** — what customers actually type, in their words rather than yours.
* **Zero-result leaks** — searches that returned nothing. Demand you already have and can’t serve; often the fastest win on the whole page.
* **Trending intent** — what’s rising compared with the previous period.
* **High-abandonment filters** — filters customers apply and then give up on.
* **Recommendation mismatch** — where recommendations aren’t landing.
In the example every panel reads **No data**, and that’s the point worth understanding: these panels are built from repeated behaviour. Sledge won’t report a “top” search term from one search, or call a filter high-abandonment from a single session — a pattern needs volume before it means anything. Enable search and filtering, let traffic run, and this tab fills in on its own.
## Reading the tabs together [#reading-the-tabs-together]
**Overview** tells you the size of the prize. **By Surfaces** and **By Features** tell you where it’s coming from — and, by their gaps, where it isn’t. **By Goals** checks you’re aimed at the right outcome. **Journey Performance** shows the leak, and **Signals** often explains it.
A worked example: if Journey Performance shows a big *Discovery → Consideration* drop and Signals shows zero-result searches, customers are looking for things your search can’t find. That’s a search and merchandising fix, and you’d expect it to show up later as revenue on the Search Page surface.
**Numbers look wrong?** Check the date range first — **Today** is a narrow window and most stores need a longer one to see anything. Remember this reports Sledge-attributed revenue only, so it will always be lower than your Shopify total. Analytics is event-based, so a brand-new order can take a few minutes to appear. And if a surface or feature shows a dash, confirm it’s actually enabled under **Tools** before reading it as poor performance.
## Related [#related]
* Growth Opportunities
* Where widgets appear (Surfaces)
---
# Analytics (https://docs.sledge-app.com/guide/analytics)
---
# How to Create a Buy X Get Y Offer in Sledge? (https://docs.sledge-app.com/guide/bundles/add-buy-x-get-y)
**Buy X Get Y** gives customers free units when they buy a set quantity — buy one get one, buy two get two, and so on. The reward is more of the same product rather than money off.
It works because the offer is easy to picture. “Buy 2 get 2 free” needs no arithmetic, and it moves inventory in multiples rather than shaving margin off single sales. It suits products people genuinely use more than one of — tees, socks, basics.
Unlike a Fix Bundle, the products you pick here are the *condition*, not the offer. The reward lives in the tiers you build, and each tier can carry its own upsell products and free gifts.
**Before you start** — Sledge must be active on your theme. Decide what the offer is and what it costs you before you build it. The example throughout this guide is an Ivory Relaxed Tee running two tiers — *Buy 1 get 1* and *Buy 2 get 2*, both at 50% off.
## Step 1 — Name it and choose where it applies [#step-1--name-it-and-choose-where-it-applies]
1. Go to **Tools → Bundle, Discount & Upsell → Buy X Get Y** and open the bundle you want to edit, or create a new one.
2. **Bundle name** — customer-facing, so write it as a shopper would read it.
3. **Product eligibility** decides which product pages the offer appears on. Choose **All products**, **Specific products**, **Products in specific collections**, or one of the two exclude options. Then add the products with **Add products**.
4. Optionally set **Country** to limit markets, **Active dates** to schedule a run, and **Countdown** to add urgency. Leave all three alone for an evergreen offer.
**If you see an overlap warning** — another bundle already targets one of these products, and Shopify picks between the competing discounts at random. It won’t stop you saving, but the customer may not get the offer you intended. Narrow one of the two bundles if the overlap wasn’t deliberate.
## Step 2 — Build the offer [#step-2--build-the-offer]
The **Buy X Get Y rules** section is where this bundle type does its real work.
This is where the offer actually lives. Each tier is its own card:
* **Buy quantity** and **Free quantity** — the deal itself. *Buy 1 get 1* and *Buy 2 get 2* in the example.
* **Tier title** and a **badge** or **medal** — the label customers read, plus the flag that marks your best value.
* **Selected by default** — which tier is pre-ticked. Most customers accept the default, so this quietly sets your average order value.
* **Extra Offer** / **Upsell products** — an add-on customers can tick alongside the tier, at its own discount. The example offers Essential Comfort Chinos at 20% off.
Add as many tiers as you need with **Add tier**. Keep them few and clearly different — three tiers that overlap confuse more than they convert.
**Variant** lets customers choose a size or colour per unit, which matters here because they're buying several of the same product.
Under **Surfaces**, switch on where the offer should render. At least one surface must be on — Product Page is the usual home.
## Step 3 — Customise how it looks [#step-3--customise-how-it-looks]
The **Design** card is what makes the offer look like part of your theme rather than an app bolted onto it. It’s optional, and it’s the difference between an offer customers trust and one they scroll past.
1. **Bundle label**, **price** and **compare-at price** colours — the text customers read first.
2. **Badge** (and, on tiered types, **medal**) colours — the flag carrying your savings message. Give it contrast; it does the selling.
3. **Card background**, **border**, **border radius** and **padding** — the panel itself. Radius and padding are what match it to your theme’s other cards.
4. **Featured card** — a separate colour used only where the bundle appears as a card in a product grid on Collection, Search and Instant Search.
Watch the **Preview** as you edit — it re-renders live, so you can judge the real thing instead of guessing from hex codes.
## Step 4 — Save and publish [#step-4--save-and-publish]
1. Check the **Preview**, then click **Save**.
2. Set **Status** to **Enable**. A saved bundle that is still disabled won’t appear for anyone.
## Result [#result]
**Done.** The offer is now live. Below is the example on the storefront — the two tiers, the free units marked *Free*, and the optional chinos upsell beneath.
**Not showing up?**
* **Status** must be **Enable**, and the relevant surface switched on.
* Make sure you’re looking at a product that’s actually in **Product eligibility**.
* Every product involved must be active and in stock — an unavailable product takes the offer down with it.
* If a different discount applies, look for the overlap warning — another bundle is competing for the same product.
* If you set **Active dates**, confirm today falls inside the window.
* Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Set Up A/B Testing for Buy X Get Y?](/guide/bundles/how-to-set-up-a-b-testing-for-buy-x-get-y)
* [How to Set Up Pre-Order for Buy X Get Y?](/guide/bundles/how-to-set-up-pre-order-for-buy-x-get-y)
* [How to Create a Fix Bundle in Sledge?](/guide/bundles/add-fix-bundle)
* [How to Create a Volume Discount in Sledge?](/guide/bundles/add-volume-discount)
* [How do I create a Free Gift offer?](/guide/bundles/how-do-i-create-a-free-gift-discount-and-display-it-on-the-storefront)
* [How to Create Product Add-ons in Sledge?](/guide/bundles/add-new-add-ons)
---
# How to Create a Fix Bundle in Sledge? (https://docs.sledge-app.com/guide/bundles/add-fix-bundle)
A **Fix Bundle** is a fixed set of products sold together at a single discounted price — the classic “buy these two things together and save” offer. The customer doesn’t choose the contents; you do.
That makes it the most predictable bundle type, and the one to reach for first. Because the contents never vary, you know exactly what margin you’re giving away and exactly what the customer receives. It works best on products that genuinely belong together — a shirt and the trousers that match it — where the pairing does some of the selling for you.
Fix Bundle is also unusual in one respect worth knowing up front: it’s the only bundle type where **the products you pick are the offer itself**. In the other types the products are a condition and the reward lives elsewhere. Here, the set *is* the deal.
**Before you start** — Sledge must be active on your theme. Have in mind which products belong in the set and what discount you’re willing to give. The example throughout this guide is a live bundle called *Value Pack*: an Ivory Classic Piqué Polo paired with Essential Comfort Chinos at 15% off.
## Step 1 — Name the bundle and choose where it applies [#step-1--name-the-bundle-and-choose-where-it-applies]
1. Go to **Tools → Bundle, Discount & Upsell → Fix Bundles** and open a bundle, or create a new one.
2. **Bundle name** — this is customer-facing. It appears as the heading on the bundle card, so *Value Pack* or *Complete the Look* reads better than an internal code.
3. **Product eligibility** decides *which product pages the bundle shows up on*. Choose one:
* **All products** — the bundle appears everywhere.
* **Specific products** — only on the products you list. This is the usual choice, and the one in the example.
* **Products in specific collections** — everything inside a collection, so new products added later are included automatically.
* **Exclude products** / **Exclude collections** — everywhere *except* what you name.
4. Click **Add products** and pick the anchor product — here, the Ivory Classic Piqué Polo. This is the page the offer appears on.
**If you see an overlap warning** — “This eligibility overlaps other bundles” means another bundle already targets one of these products, and Shopify will pick between the discounts at random. It won’t block you from saving, but it does mean the customer may not get the offer you intended. Narrow one of the two bundles if the overlap wasn’t deliberate.
## Step 2 — Build the offer and set the discount [#step-2--build-the-offer-and-set-the-discount]
The **Offer** card holds the products that make up the set, each with a **Show compare-at price** option so the original price appears struck through beside the new one. Seeing $59.50 next to a crossed-out $69.99 is what makes the saving land.
1. **Discount type** — **Percentage** or **Fixed amount**. Percentages read better on lower-priced sets; a fixed amount feels more concrete on expensive ones.
2. **Discount value** — the size of the saving. The example uses **15%**, which turns a $109.89 pair into $93.42.
3. **Sticky add to cart** — keeps an Add to Cart bar visible as the customer scrolls, so the offer stays reachable on long product pages.
4. **Pre order** — lets customers reserve the bundle before it ships, paying in full or leaving a deposit. Covered in its own guide.
5. **Surfaces** — where the bundle renders: **Collection Page**, **Product Page**, **Search Page** and **Instant Search**. At least one must be on. Product Page is the natural home for a Fix Bundle, since that’s where someone is already considering one of its items.
**Also on this page** — **Country** limits the bundle to specific markets, **Active dates** schedules a start and end, and **Countdown** adds a timer to create urgency. All three are optional; leave them alone for an evergreen offer.
## Step 3 — Customise how the bundle looks [#step-3--customise-how-the-bundle-looks]
The **Design** card is where a bundle stops looking like an app widget and starts looking like part of your theme. Everything here is optional, but it’s the difference between an offer customers trust and one they scroll past.
1. **Bundle label** — the colour of the bundle’s title text.
2. **Button text**, **Button background** and **Button border** — the Add to Cart button. Match your theme’s primary button so the bundle’s call to action feels native rather than bolted on.
3. **Badge text** and **Badge background** — the little savings flag (*Save 15%*). Give it enough contrast to be noticed, since it carries the whole pitch.
4. **Card background**, **Card border**, **Card border radius** and **Card padding** — the panel the bundle sits in. Radius and padding are the settings that make it match your theme’s other cards.
5. **Featured card** — a separate background colour used only where the bundle appears as a card on **Collection**, **Search** and **Instant Search** surfaces, where it sits in a product grid rather than on a product page.
Watch the **Preview** on the right as you change these — it re-renders live, so you can see the real bundle rather than guess from hex codes.
## Step 4 — Save and publish [#step-4--save-and-publish]
1. Check the **Preview**, then click **Save**.
2. Set **Status** to **Enable**. A saved bundle that’s still disabled won’t appear for anyone.
## Result [#result]
**Done.** The bundle now appears on the product pages you targeted. Below is *Value Pack* live on the storefront: both products with their individual discounted prices, the *Save 15%* badge, the combined price against the struck-through original, and a single **Add bundle to cart** button that adds the whole set at once.
**Not showing up?** Work through these in order — the first two cover most cases.
* **Status** must be **Enable**, and at least one **Surface** must be switched on.
* Check you’re looking at a product that’s actually in **Product eligibility**. The bundle only appears on the products you targeted.
* Every product in the set must be active and in stock — an unavailable product takes the bundle down with it.
* If a different discount is being applied, look for the overlap warning: another bundle is competing for the same product.
* If you set **Active dates**, confirm today falls inside the window.
* Storefront changes take about a minute to sync, so give it a moment before assuming it’s broken.
## Related [#related]
* [How to Set Up A/B Testing for Fix Bundle?](/guide/bundles/how-to-set-up-a-b-testing-for-fix-bundle)
* [How to Set Up Pre-Order for Fix Bundle?](/guide/bundles/how-to-set-up-pre-order-for-fix-bundle)
* [How to Create a Buy X Get Y Offer in Sledge?](/guide/bundles/add-buy-x-get-y)
* [How to Create a Volume Discount in Sledge?](/guide/bundles/add-volume-discount)
* [How do I create a Build Your Own Bundle offer?](/guide/bundles/how-do-i-create-a-byob-discount-and-display-it-on-the-storefront)
* [How to Create Product Add-ons in Sledge?](/guide/bundles/add-new-add-ons)
---
# How to Create Product Add-ons in Sledge? (https://docs.sledge-app.com/guide/bundles/add-new-add-ons)
**Add-ons** suggest related products underneath the one a customer is already looking at, each available at a discount if they take it now.
It's the shop-counter question — “anything else with that?” — at the one moment the answer is most likely to be yes. The customer has already decided to buy; adding a small, relevant item is a much easier decision than starting a new one.
Add-ons is deliberately narrow: it renders on the **Product Page** only. There is no collection or search placement, because the offer only makes sense next to a product someone is actively considering.
**Before you start** — Sledge must be active on your theme. Decide what the offer is and what it costs you before you build it. The example throughout this guide is an Ivory Jacquard Polo Shirt suggesting a Heather Knit Pullover and other pieces.
## Step 1 — Name it and choose where it applies [#step-1--name-it-and-choose-where-it-applies]
1. Go to **Tools → Bundle, Discount & Upsell → Add-ons** and open the bundle you want to edit, or create a new one.
2. **Bundle name** — customer-facing, so write it as a shopper would read it.
3. **Product eligibility** decides which product pages the offer appears on. Choose **All products**, **Specific products**, **Products in specific collections**, or one of the two exclude options. Then add the products with **Add products**.
4. Optionally set **Country** to limit markets, **Active dates** to schedule a run, and **Countdown** to add urgency. Leave all three alone for an evergreen offer.
**If you see an overlap warning** — another bundle already targets one of these products, and Shopify picks between the competing discounts at random. It won’t stop you saving, but the customer may not get the offer you intended. Narrow one of the two bundles if the overlap wasn’t deliberate.
## Step 2 — Build the offer [#step-2--build-the-offer]
The **Offer** section is where this bundle type does its real work.
The **Offer** card holds the products you want to suggest, and **Discount** sets the incentive that applies to them.
* **Products** — the add-ons themselves. Pick things that genuinely complement the anchor product; a random discount on something unrelated reads as clearance.
* **Discount type** and **value** — the saving customers get for adding now. It only needs to be enough to tip a small decision.
* **Layout** — **Slider** or grid, controlling how the suggestions are presented.
**Sticky add to cart** keeps the buy bar in reach while customers scroll the suggestions.
Under **Surfaces**, switch on where the offer should render. Add-ons is Product Page only.
## Step 3 — Customise how it looks [#step-3--customise-how-it-looks]
The **Design** card is what makes the offer look like part of your theme rather than an app bolted onto it. It’s optional, and it’s the difference between an offer customers trust and one they scroll past.
1. **Bundle label**, **price** and **compare-at price** colours — the text customers read first.
2. **Badge** (and, on tiered types, **medal**) colours — the flag carrying your savings message. Give it contrast; it does the selling.
3. **Card background**, **border**, **border radius** and **padding** — the panel itself. Radius and padding are what match it to your theme’s other cards.
4. **Featured card** — a separate colour used only where the bundle appears as a card in a product grid on Collection, Search and Instant Search.
Watch the **Preview** as you edit — it re-renders live, so you can judge the real thing instead of guessing from hex codes.
## Step 4 — Save and publish [#step-4--save-and-publish]
1. Check the **Preview**, then click **Save**.
2. Set **Status** to **Enable**. A saved bundle that is still disabled won’t appear for anyone.
## Result [#result]
**Done.** The offer is now live. Below is the example on the storefront — the add-on strip under the product with its combined price.
**Not showing up?**
* **Status** must be **Enable**, and the relevant surface switched on.
* Make sure you’re looking at a product that’s actually in **Product eligibility**.
* Every product involved must be active and in stock — an unavailable product takes the offer down with it.
* If a different discount applies, look for the overlap warning — another bundle is competing for the same product.
* If you set **Active dates**, confirm today falls inside the window.
* Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Set Up A/B Testing for Add-ons?](/guide/bundles/how-to-set-up-a-b-testing-for-add-ons)
* [How to Create a Fix Bundle in Sledge?](/guide/bundles/add-fix-bundle)
* [How to Create a Buy X Get Y Offer in Sledge?](/guide/bundles/add-buy-x-get-y)
* [How to Create a Volume Discount in Sledge?](/guide/bundles/add-volume-discount)
* [How do I create a Build Your Own Bundle offer?](/guide/bundles/how-do-i-create-a-byob-discount-and-display-it-on-the-storefront)
* [How do I create a Thank You Page offer?](/guide/bundles/how-do-i-create-a-thank-you-page-discount-and-display-it-on-the-thank-you-page)
---
# How to Create a Volume Discount in Sledge? (https://docs.sledge-app.com/guide/bundles/add-volume-discount)
**Volume Discount** lowers the unit price as the quantity goes up — buy one and save a little, buy more and save more.
It's the gentlest way to lift order value, because the customer chooses to spend more in exchange for a better rate. Nothing is forced on them and nothing is given away free. It suits consumables and basics, where buying ahead is rational.
Like Buy X Get Y, the products you pick are the condition and the offer lives in the tiers. The difference is what the customer gets: a better *price* rather than free units.
**Before you start** — Sledge must be active on your theme. Decide what the offer is and what it costs you before you build it. The example throughout this guide is a Blush Essential Women’s Polo Shirt with two tiers — *Buy 1, save 5%* and *Buy 2, save 10%*.
## Step 1 — Name it and choose where it applies [#step-1--name-it-and-choose-where-it-applies]
1. Go to **Tools → Bundle, Discount & Upsell → Volume Discounts** and open the bundle you want to edit, or create a new one.
2. **Bundle name** — customer-facing, so write it as a shopper would read it.
3. **Product eligibility** decides which product pages the offer appears on. Choose **All products**, **Specific products**, **Products in specific collections**, or one of the two exclude options. Then add the products with **Add products**.
4. Optionally set **Country** to limit markets, **Active dates** to schedule a run, and **Countdown** to add urgency. Leave all three alone for an evergreen offer.
**If you see an overlap warning** — another bundle already targets one of these products, and Shopify picks between the competing discounts at random. It won’t stop you saving, but the customer may not get the offer you intended. Narrow one of the two bundles if the overlap wasn’t deliberate.
## Step 2 — Build the offer [#step-2--build-the-offer]
The **Volume bundle** section is where this bundle type does its real work.
Each tier sets a quantity and the discount that unlocks at it:
* **Quantity** — how many units the customer must buy.
* **Discount type** and **value** — percentage or fixed amount, per tier.
* **Tier title** and **badge** — how the tier reads, and which one you mark as best value.
* **Extra Offer** — per-tier upsell products, so a bigger tier can also unlock a related item.
Space the tiers so each step is worth taking. If buying two saves 5% and buying three saves 6%, nobody moves up.
There is also a **Volume discount with other product** section, which extends the offer to a second product — in the example, Modern Men’s Shirt. Use it when the volume deal should span a small range rather than a single item.
**Variant** lets customers pick size or colour per unit.
Under **Surfaces**, switch on where the offer should render. At least one surface must be on — Product Page is the usual home.
## Step 3 — Customise how it looks [#step-3--customise-how-it-looks]
The **Design** card is what makes the offer look like part of your theme rather than an app bolted onto it. It’s optional, and it’s the difference between an offer customers trust and one they scroll past.
1. **Bundle label**, **price** and **compare-at price** colours — the text customers read first.
2. **Badge** (and, on tiered types, **medal**) colours — the flag carrying your savings message. Give it contrast; it does the selling.
3. **Card background**, **border**, **border radius** and **padding** — the panel itself. Radius and padding are what match it to your theme’s other cards.
4. **Featured card** — a separate colour used only where the bundle appears as a card in a product grid on Collection, Search and Instant Search.
Watch the **Preview** as you edit — it re-renders live, so you can judge the real thing instead of guessing from hex codes.
## Step 4 — Save and publish [#step-4--save-and-publish]
1. Check the **Preview**, then click **Save**.
2. Set **Status** to **Enable**. A saved bundle that is still disabled won’t appear for anyone.
## Result [#result]
**Done.** The offer is now live. Below is the example on the storefront — the quantity tiers as customers choose between them on the product page.
**Not showing up?**
* **Status** must be **Enable**, and the relevant surface switched on.
* Make sure you’re looking at a product that’s actually in **Product eligibility**.
* Every product involved must be active and in stock — an unavailable product takes the offer down with it.
* If a different discount applies, look for the overlap warning — another bundle is competing for the same product.
* If you set **Active dates**, confirm today falls inside the window.
* Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Set Up A/B Testing for Volume Discount?](/guide/bundles/how-to-set-up-a-b-testing-for-volume-discount)
* [How to Set Up Pre-Order for Volume Discount?](/guide/bundles/how-to-set-up-pre-order-for-volume-discount)
* [How to Create a Fix Bundle in Sledge?](/guide/bundles/add-fix-bundle)
* [How to Create a Buy X Get Y Offer in Sledge?](/guide/bundles/add-buy-x-get-y)
* [How to Create Product Add-ons in Sledge?](/guide/bundles/add-new-add-ons)
* [How do I create a Free Shipping offer?](/guide/bundles/how-do-i-create-a-shipping-discount-and-display-it-on-the-storefront)
---
# How do I create a Build Your Own Bundle offer? (https://docs.sledge-app.com/guide/bundles/how-do-i-create-a-byob-discount-and-display-it-on-the-storefront)
**Build Your Own Bundle** hands the choosing to the customer. You define the steps and the reward; they pick what goes in.
It converts because the customer builds something they actually want, rather than accepting a set you guessed at. It also lifts basket size naturally — the reward grows as they add, so the incentive to keep going is built into the interaction.
BYOB works differently from every other bundle type. It has **no product eligibility, country, active dates or countdown**, because it isn’t attached to a product page at all. It lives on its own **Bundle Listing Page**, and that page’s address is the bundle’s identity.
**Before you start** — Sledge must be active on your theme. Decide what the offer is and what it costs you before you build it. The example throughout this guide is *BYOB Accesories*, built from category steps — Bag, Sneakers, Glasses, Caps & Hats and Belts.
## Step 1 — Name it and choose where it applies [#step-1--name-it-and-choose-where-it-applies]
1. Go to **Tools → Bundle, Discount & Upsell → BYOB** and open the bundle you want to edit, or create a new one.
2. **Bundle name** — customer-facing, so write it as a shopper would read it.
3. BYOB has no product eligibility. Instead of attaching to product pages, it lives on its own listing page — you’ll set that address under **Surfaces** in the next step.
## Step 2 — Build the offer [#step-2--build-the-offer]
The **Builder structure** section is where this bundle type does its real work.
**Builder structure** is the heart of this type. Each step is a category the customer picks from:
* **Steps** — add one per category (Bag, Sneakers, Glasses, and so on) and choose which products belong in each.
* **Minimum and maximum products** — how many items make a valid bundle. The minimum is at least two.
* **Discount** — the reward. Set it globally, or per step so different categories carry different savings.
* **Conditions** — extra rules that must be met before the discount unlocks.
Under **Surfaces** you set the **Bundle Listing Page** address. This is the one blocking field on the page — the bundle needs a unique URL to live at, and Sledge checks it as you type.
Under **Surfaces**, switch on where the offer should render. BYOB uses the Bundle Listing Page.
## Step 3 — Customise how it looks [#step-3--customise-how-it-looks]
The **Design** card is what makes the offer look like part of your theme rather than an app bolted onto it. It’s optional, and it’s the difference between an offer customers trust and one they scroll past.
1. **Bundle label**, **price** and **compare-at price** colours — the text customers read first.
2. **Badge** (and, on tiered types, **medal**) colours — the flag carrying your savings message. Give it contrast; it does the selling.
3. **Card background**, **border**, **border radius** and **padding** — the panel itself. Radius and padding are what match it to your theme’s other cards.
4. **Featured card** — a separate colour used only where the bundle appears as a card in a product grid on Collection, Search and Instant Search.
Watch the **Preview** as you edit — it re-renders live, so you can judge the real thing instead of guessing from hex codes.
## Step 4 — Save and publish [#step-4--save-and-publish]
1. Check the **Preview**, then click **Save**.
2. Set **Status** to **Enable**. A saved bundle that is still disabled won’t appear for anyone.
## Result [#result]
**Done.** The offer is now live. Below is the example on the storefront — the builder on its listing page, with a discount tier per category and a “0 of 1-4 selected” tray.
**Not showing up?**
* **Status** must be **Enable**, and the relevant surface switched on.
* Check the **Bundle Listing Page** address is set and unique — without it the bundle has nowhere to live.
* Every product involved must be active and in stock — an unavailable product takes the offer down with it.
* If you set **Active dates**, confirm today falls inside the window.
* Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Set Up A/B Testing for Build Your Own Bundle (BYOB)?](/guide/bundles/how-to-set-up-a-b-testing-for-build-your-own-bundle-byob)
* [How to Create a Fix Bundle in Sledge?](/guide/bundles/add-fix-bundle)
* [How to Create a Volume Discount in Sledge?](/guide/bundles/add-volume-discount)
* [How to Create Product Add-ons in Sledge?](/guide/bundles/add-new-add-ons)
* [How do I create a Free Gift offer?](/guide/bundles/how-do-i-create-a-free-gift-discount-and-display-it-on-the-storefront)
* [How do I create a Subscription offer?](/guide/bundles/how-do-i-create-a-subscription-discount-and-display-it-on-the-storefront)
---
# How do I create a Free Gift offer? (https://docs.sledge-app.com/guide/bundles/how-do-i-create-a-free-gift-discount-and-display-it-on-the-storefront)
**Free Gift** adds a product to the basket at no charge once the customer spends above an amount you set.
A gift feels different from a discount. Money off reduces what you receive; a gift adds something the customer wasn’t expecting, and it costs you the item rather than the margin on everything in the basket. It's also a way to move slow stock or introduce a product people haven’t tried.
The gift is added as a fully discounted line, so the customer sees it in the cart at zero. Sledge also guards against the gift being claimed twice or hanging around after the basket drops below the threshold.
**Before you start** — Sledge must be active on your theme. Decide what the offer is and what it costs you before you build it. The example throughout this guide is a Chestnut Wool Overcoat, with Noir Pleated Trousers as the gift.
## Step 1 — Name it and choose where it applies [#step-1--name-it-and-choose-where-it-applies]
1. Go to **Tools → Bundle, Discount & Upsell → Free Gift** and open the bundle you want to edit, or create a new one.
2. **Bundle name** — customer-facing, so write it as a shopper would read it.
3. **Product eligibility** decides which product pages the offer appears on. Choose **All products**, **Specific products**, **Products in specific collections**, or one of the two exclude options. Then add the products with **Add products**.
4. Optionally set **Country** to limit markets, **Active dates** to schedule a run, and **Countdown** to add urgency. Leave all three alone for an evergreen offer.
**If you see an overlap warning** — another bundle already targets one of these products, and Shopify picks between the competing discounts at random. It won’t stop you saving, but the customer may not get the offer you intended. Narrow one of the two bundles if the overlap wasn’t deliberate.
## Step 2 — Build the offer [#step-2--build-the-offer]
The **Free Gifts** section is where this bundle type does its real work.
The **Free Gifts** card defines what customers earn and when:
* **Gift products** — the item given away. Choose something with a clear perceived value; a gift nobody wants is worse than no offer.
* **Threshold** — the spend required to unlock it. As with free shipping, set it just above your typical order.
* **Bundle label**, **description** and **progress goal label** — the wording that tells customers what they’re working toward.
The **Upsell** section adds products that help customers reach the threshold — here a Blush Oxford Short Sleeve Shirt and a Blush Rose Belted Blouse. Anything bought through the upsell counts toward the goal.
Under **Surfaces**, switch on where the offer should render. At least one surface must be on — Product Page is the usual home.
## Step 3 — Customise how it looks [#step-3--customise-how-it-looks]
The **Design** card is what makes the offer look like part of your theme rather than an app bolted onto it. It’s optional, and it’s the difference between an offer customers trust and one they scroll past.
1. **Bundle label**, **price** and **compare-at price** colours — the text customers read first.
2. **Badge** (and, on tiered types, **medal**) colours — the flag carrying your savings message. Give it contrast; it does the selling.
3. **Card background**, **border**, **border radius** and **padding** — the panel itself. Radius and padding are what match it to your theme’s other cards.
4. **Featured card** — a separate colour used only where the bundle appears as a card in a product grid on Collection, Search and Instant Search.
Watch the **Preview** as you edit — it re-renders live, so you can judge the real thing instead of guessing from hex codes.
## Step 4 — Save and publish [#step-4--save-and-publish]
1. Check the **Preview**, then click **Save**.
2. Set **Status** to **Enable**. A saved bundle that is still disabled won’t appear for anyone.
## Result [#result]
**Done.** The offer is now live. Below is the example on the storefront — the free-gift offer on the product page.
**Not showing up?**
* **Status** must be **Enable**, and the relevant surface switched on.
* Make sure you’re looking at a product that’s actually in **Product eligibility**.
* Every product involved must be active and in stock — an unavailable product takes the offer down with it.
* If a different discount applies, look for the overlap warning — another bundle is competing for the same product.
* If you set **Active dates**, confirm today falls inside the window.
* Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Set Up A/B Testing for Free Gift?](/guide/bundles/how-to-set-up-a-b-testing-for-free-gift)
* [How do I create a Free Shipping offer?](/guide/bundles/how-do-i-create-a-shipping-discount-and-display-it-on-the-storefront)
* [How to Create a Buy X Get Y Offer in Sledge?](/guide/bundles/add-buy-x-get-y)
* [How to Create a Fix Bundle in Sledge?](/guide/bundles/add-fix-bundle)
* [How do I create a Build Your Own Bundle offer?](/guide/bundles/how-do-i-create-a-byob-discount-and-display-it-on-the-storefront)
* [How do I create a Thank You Page offer?](/guide/bundles/how-do-i-create-a-thank-you-page-discount-and-display-it-on-the-thank-you-page)
---
# How do I create a Free Shipping offer? (https://docs.sledge-app.com/guide/bundles/how-do-i-create-a-shipping-discount-and-display-it-on-the-storefront)
**Free Shipping** offers to cover delivery once a customer’s basket passes an amount you set, with a progress bar showing how close they are.
Shipping cost is the most common reason a full basket is abandoned, and the threshold turns that objection into a target. The progress bar does the persuading: a customer $12 away from free delivery will often add a $20 item to get there.
This type applies its discount to *delivery* rather than to products, which is why it has a **maximum covered** setting — a guard so an expensive shipping method can’t cost you more than intended.
**Before you start** — Sledge must be active on your theme. Decide what the offer is and what it costs you before you build it. The example throughout this guide is a Camel Signature Peacoat and other outerwear, with an upsell offer attached.
## Step 1 — Name it and choose where it applies [#step-1--name-it-and-choose-where-it-applies]
1. Go to **Tools → Bundle, Discount & Upsell → Shipping** and open the bundle you want to edit, or create a new one.
2. **Bundle name** — customer-facing, so write it as a shopper would read it.
3. **Product eligibility** decides which product pages the offer appears on. Choose **All products**, **Specific products**, **Products in specific collections**, or one of the two exclude options. Then add the products with **Add products**.
4. Optionally set **Country** to limit markets, **Active dates** to schedule a run, and **Countdown** to add urgency. Leave all three alone for an evergreen offer.
**If you see an overlap warning** — another bundle already targets one of these products, and Shopify picks between the competing discounts at random. It won’t stop you saving, but the customer may not get the offer you intended. Narrow one of the two bundles if the overlap wasn’t deliberate.
## Step 2 — Build the offer [#step-2--build-the-offer]
The **Progress bar / Shipping settings** section is where this bundle type does its real work.
This card holds the threshold and the message around it:
* **Progress goal** and **value** — the amount a customer must reach. Set it a little above your current average order value; far above and it reads as unattainable.
* **Discount type** and **value** — how much of the shipping cost you cover.
* **Maximum discount covered** — the ceiling on what you’ll pay toward delivery.
* **Exclude over amount** — stops the offer applying above a certain basket size.
* **Label** and **description** — the wording customers read as they approach the goal.
The **Upsell** section below adds products customers can put in the basket to close the gap — the example offers a Sky Blue Women’s Polo Shirt and a Skyline Oxford Short Sleeve Shirt. This pairing is the point: show the gap, then offer something that fills it.
Under **Surfaces**, switch on where the offer should render. At least one surface must be on — Product Page is the usual home.
## Step 3 — Customise how it looks [#step-3--customise-how-it-looks]
The **Design** card is what makes the offer look like part of your theme rather than an app bolted onto it. It’s optional, and it’s the difference between an offer customers trust and one they scroll past.
1. **Bundle label**, **price** and **compare-at price** colours — the text customers read first.
2. **Badge** (and, on tiered types, **medal**) colours — the flag carrying your savings message. Give it contrast; it does the selling.
3. **Card background**, **border**, **border radius** and **padding** — the panel itself. Radius and padding are what match it to your theme’s other cards.
4. **Featured card** — a separate colour used only where the bundle appears as a card in a product grid on Collection, Search and Instant Search.
Watch the **Preview** as you edit — it re-renders live, so you can judge the real thing instead of guessing from hex codes.
## Step 4 — Save and publish [#step-4--save-and-publish]
1. Check the **Preview**, then click **Save**.
2. Set **Status** to **Enable**. A saved bundle that is still disabled won’t appear for anyone.
## Result [#result]
**Done.** The offer is now live. Below is the example on the storefront — the free-shipping offer on the product page.
**Not showing up?**
* **Status** must be **Enable**, and the relevant surface switched on.
* Make sure you’re looking at a product that’s actually in **Product eligibility**.
* Every product involved must be active and in stock — an unavailable product takes the offer down with it.
* If a different discount applies, look for the overlap warning — another bundle is competing for the same product.
* If you set **Active dates**, confirm today falls inside the window.
* Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Set Up A/B Testing for Shipping?](/guide/bundles/how-to-set-up-a-b-testing-for-shipping)
* [How do I create a Free Gift offer?](/guide/bundles/how-do-i-create-a-free-gift-discount-and-display-it-on-the-storefront)
* [How to Create a Volume Discount in Sledge?](/guide/bundles/add-volume-discount)
* [How to Create a Fix Bundle in Sledge?](/guide/bundles/add-fix-bundle)
* [How do I create a Subscription offer?](/guide/bundles/how-do-i-create-a-subscription-discount-and-display-it-on-the-storefront)
* [How do I create a Thank You Page offer?](/guide/bundles/how-do-i-create-a-thank-you-page-discount-and-display-it-on-the-thank-you-page)
---
# How do I create a Subscription offer? (https://docs.sledge-app.com/guide/bundles/how-do-i-create-a-subscription-discount-and-display-it-on-the-storefront)
**Subscription** offers customers a repeating delivery at a better price than buying once.
A subscriber is worth many times a single order, and the discount that secures one is usually cheaper than the marketing needed to win the same customer back. It suits anything people run out of.
Subscription is the only bundle type that doesn’t use Sledge’s discount engine. It works through Shopify **selling plans**, which is what makes the recurring charge real rather than a one-off discount.
**Before you start** — Sledge must be active on your theme. Decide what the offer is and what it costs you before you build it. The example throughout this guide is a Blush Oxford Short Sleeve Shirt and other basics offered on a repeating plan.
## Step 1 — Name it and choose where it applies [#step-1--name-it-and-choose-where-it-applies]
1. Go to **Tools → Bundle, Discount & Upsell → Subscription** and open the bundle you want to edit, or create a new one.
2. **Bundle name** — customer-facing, so write it as a shopper would read it.
3. **Product eligibility** decides which product pages the offer appears on. Choose **All products**, **Specific products**, **Products in specific collections**, or one of the two exclude options. Then add the products with **Add products**.
4. Optionally set **Country** to limit markets, **Active dates** to schedule a run, and **Countdown** to add urgency. Leave all three alone for an evergreen offer.
**If you see an overlap warning** — another bundle already targets one of these products, and Shopify picks between the competing discounts at random. It won’t stop you saving, but the customer may not get the offer you intended. Narrow one of the two bundles if the overlap wasn’t deliberate.
## Step 2 — Build the offer [#step-2--build-the-offer]
The **Offer** section is where this bundle type does its real work.
The **Offer** card is built from **frequencies** — the delivery intervals customers can choose:
* **Frequency** — the interval itself, for example every 30 days. Add one card per option.
* **Discount** — the subscriber’s saving on that interval. A larger discount on a longer commitment is the usual pattern.
* **Badge** — marks the plan you want chosen, typically the best value.
* **Benefits** — the short lines listed under the plan (*Benefit 1*, *Benefit 2*, *Benefit 3*). Use them for the reassurances that actually block signups: cancel any time, skip a delivery, free returns.
Offer two or three intervals at most. A long list makes a simple decision feel like a commitment.
**Show compare-at price** puts the one-off price beside the subscriber price, which is what makes the saving obvious.
Under **Surfaces**, switch on where the offer should render. At least one surface must be on — Product Page is the usual home.
## Step 3 — Customise how it looks [#step-3--customise-how-it-looks]
The **Design** card is what makes the offer look like part of your theme rather than an app bolted onto it. It’s optional, and it’s the difference between an offer customers trust and one they scroll past.
1. **Bundle label**, **price** and **compare-at price** colours — the text customers read first.
2. **Badge** (and, on tiered types, **medal**) colours — the flag carrying your savings message. Give it contrast; it does the selling.
3. **Card background**, **border**, **border radius** and **padding** — the panel itself. Radius and padding are what match it to your theme’s other cards.
4. **Featured card** — a separate colour used only where the bundle appears as a card in a product grid on Collection, Search and Instant Search.
Watch the **Preview** as you edit — it re-renders live, so you can judge the real thing instead of guessing from hex codes.
## Step 4 — Save and publish [#step-4--save-and-publish]
1. Check the **Preview**, then click **Save**.
2. Set **Status** to **Enable**. A saved bundle that is still disabled won’t appear for anyone.
## Result [#result]
**Done.** The offer is now live. Below is the example on the storefront — the subscribe option on the product page.
**Not showing up?**
* **Status** must be **Enable**, and the relevant surface switched on.
* Make sure you’re looking at a product that’s actually in **Product eligibility**.
* Every product involved must be active and in stock — an unavailable product takes the offer down with it.
* If a different discount applies, look for the overlap warning — another bundle is competing for the same product.
* If you set **Active dates**, confirm today falls inside the window.
* Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Set Up A/B Testing for Subscription?](/guide/bundles/how-to-set-up-a-b-testing-for-subscription)
* [How to Create a Fix Bundle in Sledge?](/guide/bundles/add-fix-bundle)
* [How to Create a Volume Discount in Sledge?](/guide/bundles/add-volume-discount)
* [How do I create a Build Your Own Bundle offer?](/guide/bundles/how-do-i-create-a-byob-discount-and-display-it-on-the-storefront)
* [How do I create a Free Shipping offer?](/guide/bundles/how-do-i-create-a-shipping-discount-and-display-it-on-the-storefront)
* [How do I create a Thank You Page offer?](/guide/bundles/how-do-i-create-a-thank-you-page-discount-and-display-it-on-the-thank-you-page)
---
# How do I create a Thank You Page offer? (https://docs.sledge-app.com/guide/bundles/how-do-i-create-a-thank-you-page-discount-and-display-it-on-the-thank-you-page)
A **Thank You Page offer** appears after checkout, on the order-confirmation page, proposing one more product at a discount.
The customer has already paid, so their payment details and trust are established — the friction that stops most upsells is simply gone. It also can’t hurt the original order: whatever happens here, the sale you already made is safe.
This type behaves unlike the others in three ways. It has **no product eligibility**, because it isn’t tied to what was bought. It has **no Design section** — the offer inherits Shopify’s post-purchase styling, so there are no colours to set. And it needs the thank-you-page surface switched on in your Checkout settings, which is why the page opens with **Activate thank you page surface**.
**Before you start** — Sledge must be active on your theme. Decide what the offer is and what it costs you before you build it. The example throughout this guide is *Thank you demo store*, offering a Cloud White Everyday Tee and other basics.
## Step 1 — Name it and choose where it applies [#step-1--name-it-and-choose-where-it-applies]
1. Go to **Tools → Bundle, Discount & Upsell → Thank You Page** and open the bundle you want to edit, or create a new one.
2. **Bundle name** — customer-facing, so write it as a shopper would read it.
3. There is no product eligibility here either — the offer shows after any order. Use **Activate thank you page surface** at the top to switch the surface on, then set **Country** and **Active dates** if you want to limit when it runs.
## Step 2 — Build the offer [#step-2--build-the-offer]
The **Offer** section is where this bundle type does its real work.
The **Offer** card holds the products you want to propose after checkout:
* **Upsell offers** — add a card per product, each with its own discount. The example lists several tees.
* **Bundle label**, **description** and **button text** — the pitch. Keep it short; this is a page people are skimming.
* **Layout** — **Slider** or grid.
Lead with your strongest single offer. Only the first upsell is shown to a given customer, so ordering matters more here than elsewhere.
Under **Surfaces**, switch on where the offer should render. The thank-you page is set through your Checkout settings rather than the usual surface list.
## A note on design [#a-note-on-design]
Unlike every other bundle type, the Thank You Page offer has **no Design card**. Shopify controls the styling of the post-purchase page, so the offer inherits it automatically and there is nothing for you to configure. If you were looking for colour settings, that’s why they aren’t there.
## Step 4 — Save and publish [#step-4--save-and-publish]
1. Check the **Preview**, then click **Save**.
2. Set **Status** to **Enable**. A saved bundle that is still disabled won’t appear for anyone.
## Result [#result]
**Done.** The offer now appears after checkout, on the order-confirmation page customers see once they’ve paid. Because it only exists post-purchase, you can’t open it from your storefront to check — place a test order, or use the **Preview** panel in the settings to see how it reads.
**Not showing up?**
* **Status** must be **Enable**, and the relevant surface switched on.
* Confirm the thank-you-page surface is activated in your Checkout settings; without it the offer has no place to render.
* Every product involved must be active and in stock — an unavailable product takes the offer down with it.
* If you set **Active dates**, confirm today falls inside the window.
* Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Set Up A/B Testing for Thank you page?](/guide/bundles/how-to-set-up-a-b-testing-for-thank-you-page)
* [How do I create a Free Gift offer?](/guide/bundles/how-do-i-create-a-free-gift-discount-and-display-it-on-the-storefront)
* [How do I create a Free Shipping offer?](/guide/bundles/how-do-i-create-a-shipping-discount-and-display-it-on-the-storefront)
* [How to Create Product Add-ons in Sledge?](/guide/bundles/add-new-add-ons)
* [How to Create a Fix Bundle in Sledge?](/guide/bundles/add-fix-bundle)
* [How to Create a Buy X Get Y Offer in Sledge?](/guide/bundles/add-buy-x-get-y)
---
# How to Set Up A/B Testing for Add-ons? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-a-b-testing-for-add-ons)
**A/B testing** lets you run two versions of the same Add-ons at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Add-ons the things worth testing are which products you suggest, the add-on discount, or how many suggestions appear.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Bundle, Discount & Upsell → Add-ons** and click into the record you want to test (the example here is *Add on demo store*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s the add-on strip under the product, with its combined price:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Add-ons from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Create Product Add-ons in Sledge?](/guide/bundles/add-new-add-ons)
* [How to Set Up A/B Testing for Buy X Get Y?](/guide/bundles/how-to-set-up-a-b-testing-for-buy-x-get-y)
* [How to Set Up A/B Testing for Fix Bundle?](/guide/bundles/how-to-set-up-a-b-testing-for-fix-bundle)
* [How to Set Up A/B Testing for Volume Discount?](/guide/bundles/how-to-set-up-a-b-testing-for-volume-discount)
* [How to Set Up A/B Testing for Build Your Own Bundle (BYOB)?](/guide/bundles/how-to-set-up-a-b-testing-for-build-your-own-bundle-byob)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up A/B Testing for Build Your Own Bundle (BYOB)? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-a-b-testing-for-build-your-own-bundle-byob)
**A/B testing** lets you run two versions of the same Build Your Own Bundle at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Build Your Own Bundle the things worth testing are how many slots customers fill, the reward at each step, or the wording that explains the deal.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Bundle, Discount & Upsell → BYOB** and click into the record you want to test (the example here is *BYOB Accesories*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s a Build Your Own Bundle builder on its listing page, with a discount tier per category:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Build Your Own Bundle from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* * [How do I create a Build Your Own Bundle offer?](/guide/bundles/how-do-i-create-a-byob-discount-and-display-it-on-the-storefront)
* [How to Set Up A/B Testing for Buy X Get Y?](/guide/bundles/how-to-set-up-a-b-testing-for-buy-x-get-y)
* [How to Set Up A/B Testing for Fix Bundle?](/guide/bundles/how-to-set-up-a-b-testing-for-fix-bundle)
* [How to Set Up A/B Testing for Volume Discount?](/guide/bundles/how-to-set-up-a-b-testing-for-volume-discount)
* [How to Set Up A/B Testing for Add-ons?](/guide/bundles/how-to-set-up-a-b-testing-for-add-ons)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up A/B Testing for Buy X Get Y? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-a-b-testing-for-buy-x-get-y)
**A/B testing** lets you run two versions of the same Buy X Get Y at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Buy X Get Y the things worth testing are the tier that leads (buy 1 vs buy 2), the discount percentage, or the tier labels.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Bundle, Discount & Upsell → Buy X Get Y** and click into the record you want to test (the example here is *Buy 2 get 2*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s the offer on the product page with both tiers and the free items:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Buy X Get Y from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Create a Buy X Get Y Offer in Sledge?](/guide/bundles/add-buy-x-get-y)
* [How to Set Up A/B Testing for Fix Bundle?](/guide/bundles/how-to-set-up-a-b-testing-for-fix-bundle)
* [How to Set Up A/B Testing for Volume Discount?](/guide/bundles/how-to-set-up-a-b-testing-for-volume-discount)
* [How to Set Up A/B Testing for Add-ons?](/guide/bundles/how-to-set-up-a-b-testing-for-add-ons)
* [How to Set Up A/B Testing for Build Your Own Bundle (BYOB)?](/guide/bundles/how-to-set-up-a-b-testing-for-build-your-own-bundle-byob)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up A/B Testing for Fix Bundle? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-a-b-testing-for-fix-bundle)
**A/B testing** lets you run two versions of the same Fix Bundle at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Fix Bundle the things worth testing are the discount depth, which products sit in the set, or how the offer is worded.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Bundle, Discount & Upsell → Fix Bundles** and click into the record you want to test (the example here is *Value Pack*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s the bundle box on the product page, showing the set and its saving:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Fix Bundle from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Create a Fix Bundle in Sledge?](/guide/bundles/add-fix-bundle)
* [How to Set Up A/B Testing for Buy X Get Y?](/guide/bundles/how-to-set-up-a-b-testing-for-buy-x-get-y)
* [How to Set Up A/B Testing for Volume Discount?](/guide/bundles/how-to-set-up-a-b-testing-for-volume-discount)
* [How to Set Up A/B Testing for Add-ons?](/guide/bundles/how-to-set-up-a-b-testing-for-add-ons)
* [How to Set Up A/B Testing for Build Your Own Bundle (BYOB)?](/guide/bundles/how-to-set-up-a-b-testing-for-build-your-own-bundle-byob)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up A/B Testing for Free Gift? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-a-b-testing-for-free-gift)
**A/B testing** lets you run two versions of the same Free Gift at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Free Gift the things worth testing are which product you give away, the qualifying threshold, or how the gift is presented.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Bundle, Discount & Upsell → Free Gift** and click into the record you want to test (the example here is *Free gift offer*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s the free-gift offer on the product page:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Free Gift from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* * [How do I create a Free Gift offer?](/guide/bundles/how-do-i-create-a-free-gift-discount-and-display-it-on-the-storefront)
* [How to Set Up A/B Testing for Subscription?](/guide/bundles/how-to-set-up-a-b-testing-for-subscription)
* [How to Set Up A/B Testing for Shipping?](/guide/bundles/how-to-set-up-a-b-testing-for-shipping)
* [How to Set Up A/B Testing for Thank you page?](/guide/bundles/how-to-set-up-a-b-testing-for-thank-you-page)
* [How to Set Up A/B Testing for Add-ons?](/guide/bundles/how-to-set-up-a-b-testing-for-add-ons)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up A/B Testing for Shipping? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-a-b-testing-for-shipping)
**A/B testing** lets you run two versions of the same Free Shipping at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Free Shipping the things worth testing are the spend threshold, or how the “you’re almost there” message is phrased.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Bundle, Discount & Upsell → Shipping** and click into the record you want to test (the example here is *Free shipping offer*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s the free-shipping offer on the product page:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Free Shipping from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* [How do I create a Free Shipping offer?](/guide/bundles/how-do-i-create-a-shipping-discount-and-display-it-on-the-storefront)
* [How to Set Up A/B Testing for Subscription?](/guide/bundles/how-to-set-up-a-b-testing-for-subscription)
* [How to Set Up A/B Testing for Free Gift?](/guide/bundles/how-to-set-up-a-b-testing-for-free-gift)
* [How to Set Up A/B Testing for Thank you page?](/guide/bundles/how-to-set-up-a-b-testing-for-thank-you-page)
* [How to Set Up A/B Testing for Volume Discount?](/guide/bundles/how-to-set-up-a-b-testing-for-volume-discount)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up A/B Testing for Subscription? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-a-b-testing-for-subscription)
**A/B testing** lets you run two versions of the same Subscription at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Subscription the things worth testing are the subscriber discount, the delivery intervals you offer, or which interval is preselected.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Bundle, Discount & Upsell → Subscription** and click into the record you want to test (the example here is *Subscribe & save*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s the subscribe option on the product page:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Subscription from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* * [How do I create a Subscription offer?](/guide/bundles/how-do-i-create-a-subscription-discount-and-display-it-on-the-storefront)
* [How to Set Up A/B Testing for Shipping?](/guide/bundles/how-to-set-up-a-b-testing-for-shipping)
* [How to Set Up A/B Testing for Free Gift?](/guide/bundles/how-to-set-up-a-b-testing-for-free-gift)
* [How to Set Up A/B Testing for Thank you page?](/guide/bundles/how-to-set-up-a-b-testing-for-thank-you-page)
* [How to Set Up A/B Testing for Fix Bundle?](/guide/bundles/how-to-set-up-a-b-testing-for-fix-bundle)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up A/B Testing for Thank you page? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-a-b-testing-for-thank-you-page)
**A/B testing** lets you run two versions of the same Thank You Page offer at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Thank You Page offer the things worth testing are the post-purchase discount, which product you offer, or the headline that sells it.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Bundle, Discount & Upsell → Thank You Page** and click into the record you want to test (the example here is *Thank you demo store*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
This offer only appears **after** checkout, on the order-confirmation page, so it isn’t something you can open on your storefront to check. Use the **Preview** panel in the settings above to see each variant, and read the real result from the visitor and revenue figures in the **Stop A/B test** window below.
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Thank You Page offer from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* * [How do I create a Thank You Page offer?](/guide/bundles/how-do-i-create-a-thank-you-page-discount-and-display-it-on-the-thank-you-page)
* [How to Set Up A/B Testing for Subscription?](/guide/bundles/how-to-set-up-a-b-testing-for-subscription)
* [How to Set Up A/B Testing for Shipping?](/guide/bundles/how-to-set-up-a-b-testing-for-shipping)
* [How to Set Up A/B Testing for Free Gift?](/guide/bundles/how-to-set-up-a-b-testing-for-free-gift)
* [How to Set Up A/B Testing for Build Your Own Bundle (BYOB)?](/guide/bundles/how-to-set-up-a-b-testing-for-build-your-own-bundle-byob)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up A/B Testing for Volume Discount? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-a-b-testing-for-volume-discount)
**A/B testing** lets you run two versions of the same Volume Discount at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Volume Discount the things worth testing are how many tiers you show, where the quantity breaks fall, or which tier is badged as best value.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Bundle, Discount & Upsell → Volume Discounts** and click into the record you want to test (the example here is *Volume tiers*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s the quantity tiers as customers see them on the product page:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Volume Discount from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* * [How to Create a Volume Discount in Sledge?](/guide/bundles/add-volume-discount)
* [How to Set Up A/B Testing for Buy X Get Y?](/guide/bundles/how-to-set-up-a-b-testing-for-buy-x-get-y)
* [How to Set Up A/B Testing for Fix Bundle?](/guide/bundles/how-to-set-up-a-b-testing-for-fix-bundle)
* [How to Set Up A/B Testing for Add-ons?](/guide/bundles/how-to-set-up-a-b-testing-for-add-ons)
* [How to Set Up A/B Testing for Build Your Own Bundle (BYOB)?](/guide/bundles/how-to-set-up-a-b-testing-for-build-your-own-bundle-byob)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up Pre-Order for Buy X Get Y? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-pre-order-for-buy-x-get-y)
**Pre-order** lets customers buy a Buy X Get Y before you can ship it — useful for a restock, a launch, or anything you’re taking demand for ahead of stock arriving.
Pre-ordering a buy-X-get-Y offer reserves the free items too, so the deal a customer locks in today is the deal they receive. You decide whether customers pay the whole amount up front or leave a deposit and settle the rest on a date you choose.
**Before you start** — Set the bundle up the way you want it first; pre-order is a setting on an existing bundle, not a separate one. If you plan to take a deposit, decide the amount and the date the balance should be charged before you begin.
## Step 1 — Switch pre-order on [#step-1--switch-pre-order-on]
1. Go to **Bundle, Discount & Upsell → Buy X Get Y** and open the bundle you want to pre-sell (the example here is *Buy 2 get 2*).
2. Scroll to the **Pre order** card — *Offer pre-orders and choose whether customers pay in full or pay a deposit* — and switch it on.
3. A **Type** choice appears. This is the only decision that changes how customers are charged, so take it deliberately.
## Step 2 — Choose how customers pay [#step-2--choose-how-customers-pay]
1. **Type** — pick one:
* **Full payment** — customers pay the entire amount at checkout, exactly like a normal order. Nothing else to configure. Best when the wait is short and you’d rather not manage a second charge.
* **Partial payment** — customers pay a deposit now and the balance later. This lowers the barrier to committing, at the cost of a payment you still have to collect. Choosing it reveals the three fields below.
2. **Amount pay now** — the deposit taken at checkout. Set it high enough that a customer thinks twice before abandoning, low enough that it still feels easy.
3. **Due date** — when the remaining balance is charged. Pick a date you’re confident the stock will have arrived; charging a customer before you can ship invites refund requests.
4. **Description** — the payment terms customers actually read, e.g. *The second payment will be automatically debited from your credit card on the \{due\_date}*. The **\{due\_date}** token is replaced with the real date, so you can set the wording once and let each bundle fill in its own date. Be explicit here — this line is what prevents a surprise charge turning into a dispute.
## Step 3 — Save [#step-3--save]
1. Check the **Preview** on the right. With pre-order on, the bundle’s button changes to **Pre Order**, which is the quickest way to confirm the setting took effect.
2. Click **Save**, and make sure **Status** is **Enable** so the bundle is live.
## Result [#result]
**Done.** Customers can now reserve this Buy X Get Y before it’s in stock. With **Full payment** they’re charged once at checkout; with **Partial payment** they pay your deposit now, see your payment terms at checkout, and the balance is charged automatically on the due date.
**Not showing up?** Check **Status** is **Enable** and that at least one surface is switched on under **Surfaces** — a bundle with pre-order enabled but no surface still has nowhere to appear. If the button doesn’t say **Pre Order**, the **Pre order** toggle didn’t save; reopen the bundle and confirm it’s still on. If you chose **Partial payment**, all three fields need a value — an empty **Amount pay now** or **Due date** will block the save. Storefront changes can take about a minute to sync.
## Related [#related]
* * [How to Create a Buy X Get Y Offer in Sledge?](/guide/bundles/add-buy-x-get-y)
* [How to Set Up Pre-Order for Volume Discount?](/guide/bundles/how-to-set-up-pre-order-for-volume-discount)
* [How to Set Up Pre-Order for Fix Bundle?](/guide/bundles/how-to-set-up-pre-order-for-fix-bundle)
* [How to set up pre order (single / multiple products)?](/guide/merchandising/how-to-set-up-pre-order-single-multiple-products)
* [How to set up pre order bundle?](/guide/merchandising/how-to-set-up-pre-order-bundle)
* [How to Set Up A/B Testing for Buy X Get Y?](/guide/bundles/how-to-set-up-a-b-testing-for-buy-x-get-y)
---
# How to Set Up Pre-Order for Fix Bundle? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-pre-order-for-fix-bundle)
**Pre-order** lets customers buy a Fix Bundle before you can ship it — useful for a restock, a launch, or anything you’re taking demand for ahead of stock arriving.
A fixed set is the easiest thing to pre-sell, because the contents never change — customers know exactly what they’re reserving. You decide whether customers pay the whole amount up front or leave a deposit and settle the rest on a date you choose.
**Before you start** — Set the bundle up the way you want it first; pre-order is a setting on an existing bundle, not a separate one. If you plan to take a deposit, decide the amount and the date the balance should be charged before you begin.
## Step 1 — Switch pre-order on [#step-1--switch-pre-order-on]
1. Go to **Bundle, Discount & Upsell → Fix Bundles** and open the bundle you want to pre-sell (the example here is *Value Pack*).
2. Scroll to the **Pre order** card — *Offer pre-orders and choose whether customers pay in full or pay a deposit* — and switch it on.
3. A **Type** choice appears. This is the only decision that changes how customers are charged, so take it deliberately.
## Step 2 — Choose how customers pay [#step-2--choose-how-customers-pay]
1. **Type** — pick one:
* **Full payment** — customers pay the entire amount at checkout, exactly like a normal order. Nothing else to configure. Best when the wait is short and you’d rather not manage a second charge.
* **Partial payment** — customers pay a deposit now and the balance later. This lowers the barrier to committing, at the cost of a payment you still have to collect. Choosing it reveals the three fields below.
2. **Amount pay now** — the deposit taken at checkout. Set it high enough that a customer thinks twice before abandoning, low enough that it still feels easy.
3. **Due date** — when the remaining balance is charged. Pick a date you’re confident the stock will have arrived; charging a customer before you can ship invites refund requests.
4. **Description** — the payment terms customers actually read, e.g. *The second payment will be automatically debited from your credit card on the \{due\_date}*. The **\{due\_date}** token is replaced with the real date, so you can set the wording once and let each bundle fill in its own date. Be explicit here — this line is what prevents a surprise charge turning into a dispute.
## Step 3 — Save [#step-3--save]
1. Check the **Preview** on the right. With pre-order on, the bundle’s button changes to **Pre Order**, which is the quickest way to confirm the setting took effect.
2. Click **Save**, and make sure **Status** is **Enable** so the bundle is live.
## Result [#result]
**Done.** Customers can now reserve this Fix Bundle before it’s in stock. With **Full payment** they’re charged once at checkout; with **Partial payment** they pay your deposit now, see your payment terms at checkout, and the balance is charged automatically on the due date.
**Not showing up?** Check **Status** is **Enable** and that at least one surface is switched on under **Surfaces** — a bundle with pre-order enabled but no surface still has nowhere to appear. If the button doesn’t say **Pre Order**, the **Pre order** toggle didn’t save; reopen the bundle and confirm it’s still on. If you chose **Partial payment**, all three fields need a value — an empty **Amount pay now** or **Due date** will block the save. Storefront changes can take about a minute to sync.
## Related [#related]
* * [How to Create a Fix Bundle in Sledge?](/guide/bundles/add-fix-bundle)
* [How to Set Up Pre-Order for Volume Discount?](/guide/bundles/how-to-set-up-pre-order-for-volume-discount)
* [How to Set Up Pre-Order for Buy X Get Y?](/guide/bundles/how-to-set-up-pre-order-for-buy-x-get-y)
* [How to set up pre order (single / multiple products)?](/guide/merchandising/how-to-set-up-pre-order-single-multiple-products)
* [How to set up pre order bundle?](/guide/merchandising/how-to-set-up-pre-order-bundle)
* [How to Set Up A/B Testing for Fix Bundle?](/guide/bundles/how-to-set-up-a-b-testing-for-fix-bundle)
---
# How to Set Up Pre-Order for Volume Discount? (https://docs.sledge-app.com/guide/bundles/how-to-set-up-pre-order-for-volume-discount)
**Pre-order** lets customers buy a Volume Discount before you can ship it — useful for a restock, a launch, or anything you’re taking demand for ahead of stock arriving.
Volume tiers and pre-orders pair well for restocks: customers commit to the larger quantity now and you get a read on demand before the stock lands. You decide whether customers pay the whole amount up front or leave a deposit and settle the rest on a date you choose.
**Before you start** — Set the bundle up the way you want it first; pre-order is a setting on an existing bundle, not a separate one. If you plan to take a deposit, decide the amount and the date the balance should be charged before you begin.
## Step 1 — Switch pre-order on [#step-1--switch-pre-order-on]
1. Go to **Bundle, Discount & Upsell → Volume Discounts** and open the bundle you want to pre-sell (the example here is *Volume tiers*).
2. Scroll to the **Pre order** card — *Offer pre-orders and choose whether customers pay in full or pay a deposit* — and switch it on.
3. A **Type** choice appears. This is the only decision that changes how customers are charged, so take it deliberately.
## Step 2 — Choose how customers pay [#step-2--choose-how-customers-pay]
1. **Type** — pick one:
* **Full payment** — customers pay the entire amount at checkout, exactly like a normal order. Nothing else to configure. Best when the wait is short and you’d rather not manage a second charge.
* **Partial payment** — customers pay a deposit now and the balance later. This lowers the barrier to committing, at the cost of a payment you still have to collect. Choosing it reveals the three fields below.
2. **Amount pay now** — the deposit taken at checkout. Set it high enough that a customer thinks twice before abandoning, low enough that it still feels easy.
3. **Due date** — when the remaining balance is charged. Pick a date you’re confident the stock will have arrived; charging a customer before you can ship invites refund requests.
4. **Description** — the payment terms customers actually read, e.g. *The second payment will be automatically debited from your credit card on the \{due\_date}*. The **\{due\_date}** token is replaced with the real date, so you can set the wording once and let each bundle fill in its own date. Be explicit here — this line is what prevents a surprise charge turning into a dispute.
## Step 3 — Save [#step-3--save]
1. Check the **Preview** on the right. With pre-order on, the bundle’s button changes to **Pre Order**, which is the quickest way to confirm the setting took effect.
2. Click **Save**, and make sure **Status** is **Enable** so the bundle is live.
## Result [#result]
**Done.** Customers can now reserve this Volume Discount before it’s in stock. With **Full payment** they’re charged once at checkout; with **Partial payment** they pay your deposit now, see your payment terms at checkout, and the balance is charged automatically on the due date.
**Not showing up?** Check **Status** is **Enable** and that at least one surface is switched on under **Surfaces** — a bundle with pre-order enabled but no surface still has nowhere to appear. If the button doesn’t say **Pre Order**, the **Pre order** toggle didn’t save; reopen the bundle and confirm it’s still on. If you chose **Partial payment**, all three fields need a value — an empty **Amount pay now** or **Due date** will block the save. Storefront changes can take about a minute to sync.
## Related [#related]
* * [How to Create a Volume Discount in Sledge?](/guide/bundles/add-volume-discount)
* [How to Set Up Pre-Order for Fix Bundle?](/guide/bundles/how-to-set-up-pre-order-for-fix-bundle)
* [How to Set Up Pre-Order for Buy X Get Y?](/guide/bundles/how-to-set-up-pre-order-for-buy-x-get-y)
* [How to set up pre order (single / multiple products)?](/guide/merchandising/how-to-set-up-pre-order-single-multiple-products)
* [How to set up pre order bundle?](/guide/merchandising/how-to-set-up-pre-order-bundle)
* [How to Set Up A/B Testing for Volume Discount?](/guide/bundles/how-to-set-up-a-b-testing-for-volume-discount)
---
# Bundles, Discounts & Upsell (https://docs.sledge-app.com/guide/bundles)
---
# How to set up cart drawer? (https://docs.sledge-app.com/guide/cart-drawer/how-to-set-up-cart-drawer)
The **Cart Drawer** is the slide-out cart that opens when a customer adds something, instead of sending them away to a separate cart page. They keep their place, and you keep the momentum.
It’s also the highest-intent surface in your store — everyone who opens it has already decided to buy. That’s why it’s built from stackable blocks: a rewards bar showing how close free shipping is, a countdown, a recommendation row, a discount field, trust badges. You switch on the ones that suit your store and leave the rest off.
This guide walks through every setting, in the order they appear: **General**, **Header**, **Body**, then **Footer**.
**Before you start** — Sledge must be active on your theme. Settings are grouped into collapsible cards; click a card heading to open it. The **Preview** on the right updates as you edit, so keep an eye on it — it’s the fastest way to see what a setting actually does.
## Turn the cart drawer on [#turn-the-cart-drawer-on]
1. Go to **Tools → Cart Drawer**. The first card has a single switch: **Cart Drawer — turn this on to activate the cart drawer experience on your storefront**. Switch it on.
2. Under **Features**, click **Cart Drawer — manage all settings cart drawer** to open the settings page. (**Translation** next to it is where you localise the drawer’s text.)
## General — position and overall look [#general--position-and-overall-look]
1. **Cart position** — choose whether the drawer slides in from the **Left** or the **Right**. Right is the common choice because most themes put the cart icon top-right, so the drawer opens under the customer’s cursor.
2. **Design** — the drawer’s overall appearance: **Border radius**, **Background color**, and **Border color**. Match these to your theme so the drawer reads as part of your store rather than a bolt-on.
3. **Open cart drawer on add to cart** — when on, the drawer opens automatically the moment a product is added. Leave it on if you want customers to see upsells immediately; switch it off if you’d rather they carry on browsing uninterrupted.
## Header — the top of the drawer [#header--the-top-of-the-drawer]
1. **Cart label** — the title customers see, e.g. *My cart*. Sledge appends the item count automatically, so it reads *My cart (2)*.
2. **Icon** — the close control in the corner. Pick the icon (for example *Close*) or use **Add icon** to upload your own.
3. **Design** — typography and colours for the header: **Title size** in px, **Title weight**, **Text alignment**, **Title transform** (for uppercase and similar), plus separate colours for the **Cart label** and the **Icon**.
## Body — what sits between the header and the totals [#body--what-sits-between-the-header-and-the-totals]
The **Body** card holds the blocks that make up the middle of the drawer. Each has its own on/off switch, and each has a drag handle on the left — **the order you arrange them here is the order customers see**. Switch off anything you don’t need; an overloaded drawer converts worse than a focused one.
### Banner [#banner]
Puts a promotional image at the top of the drawer. Upload artwork for **Horizontal** and **Vertical (Recommendation 16:9)**, and use **Crop** to control framing. **Country** and **Active dates** limit where and when it runs — useful for a sale banner that should retire itself automatically.
### Countdown timer [#countdown-timer]
Adds a live clock to the drawer — the *Your cart will expire in 12:00* line. Under **Timer** you set the duration and the message shown beside it. **Timer type** decides what happens when it reaches zero, and **Design** controls its appearance. Keep the promise honest: if nothing actually expires, a fake clock costs you trust.
### Progress goal [#progress-goal]
The rewards bar — the strongest upsell in the drawer, because it tells customers exactly what one more item gets them.
* **Title** and **Subtitle** — the heading above the bar, e.g. *Unlock rewards*.
* **Finish title** — what customers see once every reward is unlocked, e.g. *You’ve unlocked free shipping and a free gift*.
* **Reward tiers** — add one per reward. Each is **Free shipping**, **Order discount**, or **Free gift**, and each can be duplicated, deleted, or dragged into a different order.
* For every tier you choose a source: **Select Free Shipping** / **Select Free Gift** reuses an offer you already built in that feature, while **Create in Cart Drawer** makes one that lives only here. Reusing keeps a single source of truth; creating in the drawer is quicker for a one-off.
* **Design** — the look of the progress bar itself.
### Cart items [#cart-items]
Controls which product details each line in the cart shows. It also owns the **Cart is empty** state: set a **Title** and pick the products to recommend when there’s nothing in the cart yet, either automatically or with **Add products manually**. **Layout** switches those between **Slider** and **Grid**. An empty drawer is a dead end otherwise — this turns it into a starting point.
### Product recommendations [#product-recommendations]
Shows a recommendation row inside the drawer. Use **Select recommendation** to choose which of your Product Recommendation campaigns runs here — so the drawer can show best sellers, trending items, or a hand-picked set, depending on which campaign you point it at.
## Footer — totals and everything below them [#footer--totals-and-everything-below-them]
The **Footer** card starts with **Card background** and **Card border**, which style the footer panel itself. Below that sits a stack of blocks. Like the body, each has its own switch and drag handle, so you control both whether a block appears and where.
Every block follows the same shape: a toggle, its own text fields, and a **Design** section for typography and colours. **Discount code** is a good worked example:
It has a **Placeholder** (*Enter discount code*) and **Button text** (*Apply*), then a **Design** block covering **Placeholder size**, **Placeholder weight**, **Placeholder transform**, and separate colours for the placeholder, the typed input, the card background and border, and the button’s text, background and border.
The full set of footer blocks:
* **Shipping Protection** — offers shipping protection as an add-on before checkout.
* **Discount code** — the promo-code field described above. Worth thinking about: showing it invites customers to go hunting for a code, so some stores deliberately leave it off.
* **Order notes** — lets customers add special instructions with their order.
* **Trust badges** — payment or guarantee badges, placed right where hesitation happens.
* **Discount applied** — the text and colours of the discount line once a code lands.
* **Subtotal** — the subtotal label and its text colour in the summary.
* **Checkout button** — the wording on the main call to action.
* **Term and condition** — the terms text shown near checkout.
* **Continue shop** — the continue-shopping link that sends customers back to browsing.
When everything reads the way you want, check the **Preview**, click **Save**, and set **Status** to **Enable**.
## Result [#result]
**Done.** Adding a product now opens your configured drawer. Below is the live drawer with the blocks switched on: the header banner and cart label, the countdown, the **Unlock rewards** bar telling the customer what’s left to earn free shipping, the line item, the discount field, the totals, and the checkout button with the continue-shopping link beneath it.
**Not showing up?** Check **Status** is **Enable** on the settings page *and* that the master **Cart Drawer** switch on the Tools page is on — both have to be on. If a single block is missing, its own toggle in **Body** or **Footer** is off. If the blocks appear in the wrong order, drag them into place with the handles. An empty drawer is expected when the cart has nothing in it — add a product and reopen. Storefront changes can take about a minute to sync.
## Related [#related]
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How do I create a Free Shipping offer?](/guide/bundles/how-do-i-create-a-shipping-discount-and-display-it-on-the-storefront)
* [How do I create a Free Gift offer?](/guide/bundles/how-do-i-create-a-free-gift-discount-and-display-it-on-the-storefront)
* [How to set up the Wishlist view?](/guide/wishlist/set-up-the-wishlist-view)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
* [How to set up Global Countdown?](/guide/promotion/how-to-set-up-global-countdown)
---
# Cart Drawer (https://docs.sledge-app.com/guide/cart-drawer)
---
# How do I choose a filter Layout? (https://docs.sledge-app.com/guide/filter/choose-your-filter-layout)
Layout controls how the whole product filter is presented to customers — where it sits on desktop, how it opens on mobile, and how filtered products load as customers browse. It’s one page with three choices and a live preview.
## Before you start [#before-you-start]
This feature renders inside the Sledge product filter on your storefront, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **The Collections page surface is turned on.** Open **Sledge → Tools → Product Filter** and check the **Collections page** switch at the top — this is what puts the Sledge filter on your collection pages.
## Open Layout [#open-layout]
Go to **Sledge → Tools → Product Filter**, and under **Features** click **Layout**. Each option is a picture card with a **Choose** button — the current selection shows a green **Current layout** badge. Picking an option marks it; click **Save** in the save bar to apply (or **Discard** to revert).
### Mobile [#mobile]
How filters are displayed and accessed on mobile devices:
* **Standard** — the filter opens as a full panel over the product list, the common pattern customers know from most stores.
* **Flyout** — the filter slides in as a drawer from the side, keeping the product list partly visible.
### Desktop [#desktop]
How filters appear and behave on desktop devices:
* **Vertical** — the classic sidebar on the left of the product grid. A safe default for most themes.
* **Horizontal** — filters run in a bar across the top of the grid, freeing the full width for products.
* **Flyout** — filters stay hidden behind a button and slide in as a drawer when opened.
* **Enterprise** — a denser layout designed for very large catalogs with many filter groups.
### Pagination [#pagination]
How products load and navigate between pages after filtering:
* **Standard** — previous / next page controls.
* **Numbered button** — numbered pages (1 2 3 4) so customers can jump directly to a page.
* **Load more** — a button at the bottom appends the next page under the current one.
* **Infinite scroll** — the next page loads automatically as the customer scrolls; no clicking at all.
### Preview [#preview]
The panel on the right shows a schematic of your current combination — use the icons at its top-right to switch between the mobile and desktop preview:
## Result [#result]
After saving, your collection pages use the chosen combination — the sidebar (or bar, or drawer) on the device the customer is on, and your pagination style at the bottom of the product grid.
Not showing up? Give the change a minute to sync, then reload the collection page. Also confirm that Sledge Core and the Collections page switch are enabled as described above.
## Related [#related]
* [How do I configure Display Settings?](/guide/filter/configure-display-settings)
* [How do I set up a filter group?](/guide/filter/how-to-set-up-filter-group)
* [How do I set up Color Swatches?](/guide/filter/set-up-color-swatches)
* [How do I set up Image Swatches?](/guide/filter/set-up-image-swatches)
* [How do I merge duplicate filter values?](/guide/filter/merge-duplicate-filter-values)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
---
# How do I configure Display Settings? (https://docs.sledge-app.com/guide/filter/configure-display-settings)
Display Settings is the behavior panel of the product filter: which values are visible, how long lists are broken up, whether result counts show, and how product variants appear in the filtered grid. One page, two cards, with a live preview on the right.
## Before you start [#before-you-start]
This feature renders inside the Sledge product filter on your storefront, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **The Collections page surface is turned on.** Open **Sledge → Tools → Product Filter** and check the **Collections page** switch at the top — this is what puts the Sledge filter on your collection pages.
## Open Display Settings [#open-display-settings]
Go to **Sledge → Tools → Product Filter**, and under **Features** click **Display Settings**. Change any setting, then click **Save** in the save bar to apply.
## The Filter card [#the-filter-card]
* **Show out of stock variant filter items** — keep values visible in the filter even when every matching variant is unavailable. Turn it off to hide options customers can’t buy anyway.
* **Filter item pagination** — split long value lists into pages instead of one endless list. When it’s on, **Items per page** sets how many values show before the “Show more” control appears (4 in the example).
* **Show selected filters block** — display the customer’s active filters as chips above the results, each with an ✕ for quick removal, plus a Clear all.
* **Show matching products number at filter items** — show the result count next to each value (for example “Male (22)”), so customers know what to expect before clicking.
* **Hide filter when result only one** — hide a whole filter group when only one value is available; a filter with a single choice doesn’t help anyone narrow down.
* **Hide filter when item is zero** — hide values that would return no products, keeping dead ends out of the list.
## The Product list card [#the-product-list-card]
**Display variants as separate products** — when on, each variant gets its own card in the filtered grid (a shirt in three colours shows as three cards). The info banner links to **Global setting** in Settings & Support, where the product list and product card styling themselves are configured.
## Preview [#preview]
The right-hand panel reflects your settings on a sample filter and product grid — use the icons at its top-right to switch between mobile and desktop:
## Result [#result]
Your collection page filter follows these rules everywhere Sledge renders it — value lists paginate at the number you set, counts appear next to values, selected filters show as removable chips, and empty or single-value groups stay hidden.
Not showing up? Give the change a minute to sync, then reload the collection page. Also confirm that Sledge Core and the Collections page switch are enabled as described above.
## Related [#related]
* [How do I choose a filter Layout?](/guide/filter/choose-your-filter-layout)
* [How do I set up a filter group?](/guide/filter/how-to-set-up-filter-group)
* [How do I merge duplicate filter values?](/guide/filter/merge-duplicate-filter-values)
* [How do I set up Color Swatches?](/guide/filter/set-up-color-swatches)
* [How do I set up Image Swatches?](/guide/filter/set-up-image-swatches)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
---
# How do I set up a filter group? (https://docs.sledge-app.com/guide/filter/how-to-set-up-filter-group)
A filter group is the set of filters a customer sees on one page of your store. Sledge keeps filters in groups so that a customer browsing Women's Elegant Tops can see a Colour and a Size filter, while a customer browsing Accessories sees something completely different.
This guide walks through the three levels of the feature, from the top down:
1. Filter Group — the list of every group in your store
2. Edit Filter Group — which collections a group applies to, and which filters it contains
3. Edit Filter Item — one single filter, and its Advanced settings
## Before you start [#before-you-start]
Filter groups render inside the Sledge product filter on your storefront, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **The Collections page surface is turned on.** Open **Sledge → Tools → Product Filter** and check the **Collections page** switch at the top — this is what puts the filter on your collection pages.
3. **Your products are synced.** Filters are built from data that already exists on your products (vendor, product type, tags, options, price), so a filter can only show values your products actually have.
## Step 1 — Open the Filter Group page [#step-1--open-the-filter-group-page]
In the Sledge admin go to Tools → Product Filter → Filter Group. You will see two cards.
### Default filter groups [#default-filter-groups]
Sledge creates these two groups for you and you cannot add or remove them:
* All Collections — the fallback group. It applies to every collection page that does not have its own group.
* Search Results — the filters shown on your search results page and in instant search.
### Custom filter group [#custom-filter-group]
This is where you add your own groups. Each custom group is tied to one or more specific collections, and it overrides the default group on those pages.
Both tables use the same four columns:
* Name — your own label for the group. Click it to open the group.
* Applies to Collection — the collections this group is attached to.
* View — the eye icon opens that collection on your live storefront in a new tab, so you can check the result immediately.
* Status — turns the whole group on or off. Switching it off means those filters stop appearing on the storefront. This saves straight away.
To create a new group, click Add custom filter group. Tick the checkboxes on the left of one or more rows to Duplicate or Delete several groups at once.
## Step 2 — Expand a group to see its filters [#step-2--expand-a-group-to-see-its-filters]
Click the small chevron next to a group name to expand it without leaving the page. This is the quickest way to see what a group contains.
Each child row is one filter. The two grey badges tell you how it is built: the first is the source (where the values come from) and the second is the display (how it looks on the storefront). In the example above, Brand reads from Vendor and is shown as a Swatch color.
The dotted handle on the left lets you drag a filter up or down. That order is exactly the order the filters appear in on your storefront, so put the filters your customers use most at the top. Use Add filter item at the bottom of the list to add another filter to that group.
## Step 3 — Open a group [#step-3--open-a-group]
Click a group name to open it. This page has two cards.
### Edit Filter Group [#edit-filter-group]
* Applies to — choose the collections this group should be used on. Start typing to search, then click a collection to add it as a chip below the field. Remove a collection with the small cross on its chip. A group with no collection is never shown, so leave at least one here.
* Name — an internal label to help you find the group later. Customers never see it. It cannot be left empty.
### Filter Items [#filter-items]
Every filter in this group, in storefront order. Drag the handle to reorder, or click any row to open that filter. Add filter item creates a new one.
The More actions menu at the top right holds View storefront (opens the first collection this group applies to) and Delete filter group.
Changes on this page are not live until you press Save in the bar that appears at the top of the screen.
## Step 4 — Open a filter item [#step-4--open-a-filter-item]
Click a row in the Filter Items table to configure one filter on its own.
* Source — the product data this filter reads. Options include Collection, Vendor, Product Type, Availability, Price, Sale Percent, Tags, plus any product options and metafields your store uses. The list only offers sources that actually have values in the collections this group covers, so you cannot build an empty filter by accident.
* Filter label — the heading your customers see above the filter. This is the one field on this page they will read, so use their words: Brand usually beats Vendor.
* Display as — how the filter is drawn. The available choices depend on the source. Checkbox, Radio, Select and the four swatch styles are for list-type sources; Slider, Input Range and Slider with Input Range are for Price and Sale Percent; Filter Tree is for Collection and Product Type.
Changing the source may automatically change the display, because not every display works with every source. Press Save when you are done.
## Step 5 — Open Advanced settings [#step-5--open-advanced-settings]
Click the Advanced settings bar at the bottom of the card to expand it. It is closed every time the page loads, and none of these settings are required — the defaults are fine for most stores.
The settings shown here are:
* Operator — how several selections inside this one filter are combined. OR (the default) shows products matching any value the customer picked, which is what people expect from colours or brands. AND shows only products matching every value picked, which suits tags where a product can genuinely carry several at once.
* Enable filter list visibility rules — hides this filter until the customer's other selections match rules you define. Useful for a filter that only makes sense in context, such as showing Shoe size only after Footwear has been selected.
* Always show filter items & disable dynamic counters — normally values disappear and the result counts update as a customer narrows down. Turn this on to keep every value visible at all times.
* Show search above filter list — adds a small search box above this filter's values. Worth turning on for long lists such as brands.
* Collapse filter list by default — the filter loads closed and the customer clicks its heading to open it. Handy for keeping a long sidebar tidy.
### Settings that open more options [#settings-that-open-more-options]
Two of the checkboxes reveal further settings when you tick them.
Enable filter list visibility rules opens a Visibility rules panel. Click Add rule, then set Type (which other filter the rule watches), Operator, and Selected values (which values trigger it — pick All values to match any selection). Add as many rules as you need, and remove one with the bin icon.
Show search above filter list opens two extra choices: Enable auto-check matching filters selects values automatically as the text is typed, and Hide filter list when search is visible keeps the values hidden until the customer starts typing.
## Advanced settings for other sources [#advanced-settings-for-other-sources]
Advanced settings adapts to the filter you opened, so a different filter shows a different set. The example below is a Tags filter, which adds two settings that Availability does not have.
* Remove filter item prefix — tidies up messy value names. If your tags are stored as color\_Red and color\_Blue , type color\_ here and customers will simply see Red and Blue. Your tags are not changed, only the labels shown.
* Select filter items to display — controls which values appear at all. All shows everything, Filter by prefix shows only values starting with the prefixes you list, and Only selected items lets you hand-pick the exact values.
Other sources and displays add their own settings in the same place — a Price or Sale Percent filter shows Round values, and a Filter Tree adds Expand all filter items along with tree separators.
### Reorder [#reorder]
For sources that hold a list of values, a second card called Reorder appears below the filter card.
Drag the handles to set the order the values appear in on your storefront — putting Small, Medium, Large in a sensible order rather than alphabetically makes a real difference. The toggle on the right hides a single value without deleting anything. Use the search and sort controls above the table when the list is long.
## Result [#result]
Once you save, open the collection you attached the group to (the eye icon in the View column takes you straight there). Your filters appear in the order you set, with the labels you chose, and each one behaves the way you configured it.
## Not showing up? [#not-showing-up]
* Check the Status toggle on the Filter Group list — the whole group may be switched off.
* Check Applies to on the group. If the collection is not listed, the default All Collections group is used instead.
* A filter with no matching values on the current page is hidden automatically. Try it on a collection where products actually carry that vendor, tag or option.
* If you turned on Enable filter list visibility rules, the filter stays hidden until its rules are met.
* Make sure you pressed Save. The Edit Filter Group and Edit Filter Item pages only apply changes when you save.
## Related [#related]
* [How do I set up Color Swatches?](/guide/filter/set-up-color-swatches)
* [How do I set up Image Swatches?](/guide/filter/set-up-image-swatches)
* [How do I choose a filter Layout?](/guide/filter/choose-your-filter-layout)
* [How do I merge duplicate filter values?](/guide/filter/merge-duplicate-filter-values)
* [How do I configure Display Settings?](/guide/filter/configure-display-settings)
---
# Filters (https://docs.sledge-app.com/guide/filter)
---
# How do I merge duplicate filter values? (https://docs.sledge-app.com/guide/filter/merge-duplicate-filter-values)
Merge Value combines several filter values into one clean label. Catalogs accumulate near-duplicates — “Navy” and “navy blue”, or a run of granular sizes like 28, 30, 32 — and every one of them becomes its own row in the filter. Merging shows customers a single label instead; selecting it applies *all* merged values at once.
## Before you start [#before-you-start]
This feature renders inside the Sledge product filter on your storefront, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **The Collections page surface is turned on.** Open **Sledge → Tools → Product Filter** and check the **Collections page** switch at the top — this is what puts the Sledge filter on your collection pages.
## Add a merge rule [#add-a-merge-rule]
Go to **Sledge → Tools → Product Filter**, under **Features** click **Merge Value**, then click **Add merge value**.
### Type [#type]
Which filter the rule applies to — the same source list as your filter items (product options, metafields, tags, vendor, and so on). In the example it’s **Options Size**. Choosing a type loads that filter’s values below.
### Display label [#display-label]
The single label customers will see instead of the merged values — here **EU sizes (28-32)**.
### Values to merge [#values-to-merge]
Tick the values to combine; each selected value appears as a chip under the field (here **28**, **30**, and **32**). When a customer selects the merged label on your storefront, products matching *any* of these values are shown.
### Add more merge / Enable merge value [#add-more-merge--enable-merge-value]
**Add more merge** adds another merge card so you can create several rules for the same type in one go. The **Enable merge value** switch controls whether the rule is live — leave it on and click **Save** in the save bar.
## Manage your merge rules [#manage-your-merge-rules]
Saved rules appear in the Merge Value list showing the **Type**, the **Display label**, and chips for the **Values to merge**. Click a row to edit it, use the icons above the table to search and sort, or select rows with the checkboxes to delete them.
## Result [#result]
On your collection pages, the size filter no longer lists 28, 30, and 32 separately — customers see one **EU sizes (28-32)** entry, and selecting it filters to products matching any of the three sizes.
Not showing up? Give the change a minute to sync, then reload the collection page. Also confirm that Sledge Core and the Collections page switch are enabled as described above.
## Related [#related]
* [How do I set up a filter group?](/guide/filter/how-to-set-up-filter-group)
* [How do I configure Display Settings?](/guide/filter/configure-display-settings)
* [How do I set up Color Swatches?](/guide/filter/set-up-color-swatches)
* [How do I set up Image Swatches?](/guide/filter/set-up-image-swatches)
* [How do I choose a filter Layout?](/guide/filter/choose-your-filter-layout)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
---
# How do I set up Color Swatches? (https://docs.sledge-app.com/guide/filter/set-up-color-swatches)
A color swatch turns a plain text colour value — “Sage”, “Butter Yellow” — into a colour chip customers can scan at a glance in the filter sidebar. Instead of reading a list of colour names, customers see the actual colours and click the one they want.
## Before you start [#before-you-start]
Color swatches render inside the Sledge product filter on your storefront, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **The Collections page surface is turned on.** Open **Sledge → Tools → Product Filter** and check the **Collections page** switch at the top — this is what puts the filter (and your swatches) on your collection pages.
3. **A Filter Group shows the colour filter.** Swatches decorate an existing filter item — you need a Filter Group whose filter item uses the same source you pick below (for example a “Color” item with source *Options Color*). If the sources don’t match, the filter shows plain text values instead of chips.
## Open Color Swatch [#open-color-swatch]
Go to **Sledge → Tools → Product Filter**, and under **Features** click **Color Swatch**.
## The Color Swatch page [#the-color-swatch-page]
### Color source [#color-source]
The select at the top decides *where your colour values come from*. In the example it’s set to **Options Color** — the product option named “Color” — so every value of that option (Beige, Black, Blue, …) gets a row in the table. You can also map values from metafields, tags, collections, vendors, product types, and more. Remember: this source must match the source used by the colour filter item in your Filter Group.
### The mapping table — one row per colour value [#the-mapping-table--one-row-per-colour-value]
Each row maps one label to what customers will see:
* **Label** — the raw value from your source, with a live preview chip next to it. Sortable via the arrows in the header.
* **Color 1 / Color 2 / Color 3** — up to three hex colours per label. One colour gives a solid chip; two or three give a split chip — useful for multi-tone colours (in the example, *Sage* uses three green tones and *Lavender* two purples). Click a field and pick or type the hex; changes save automatically.
* **Image** — instead of hex colours, upload a small image to use as the swatch (for example a fabric texture or pattern). **Upload image** opens the file picker; a **Remove** link appears once an image is set.
* **Action → Clear** — empties the row’s colours and image so you can start over. To delete rows entirely, select them with the checkboxes and use the **Delete** bulk action.
There is no Save button on this page — every change is saved as soon as you make it.
## Add a colour manually [#add-a-colour-manually]
Values from your source appear automatically, but you can also click **Add color** for a value that doesn’t exist yet (for example one you’re about to introduce). Fill the **Label** and up to three colours, then click **Add**.
## Import colours in bulk [#import-colours-in-bulk]
Click **Import color** to upload a CSV of mappings in one go — click **Download sample CSV** in the modal for the exact format. Handy for large catalogs or for copying a mapping between stores.
## Result [#result]
On your collection pages, the colour filter now renders as chips — including the split chips for multi-tone values like Sage and Lavender. Customers click a chip to filter, exactly like ticking a checkbox:
Not showing up? Confirm the swatch source here matches the Source of the colour filter item in your Filter Group, give the change a minute to sync, and check that Sledge Core and the Collections page switch are on as described above.
## Related [#related]
* [How do I set up Image Swatches?](/guide/filter/set-up-image-swatches)
* [How do I set up a filter group?](/guide/filter/how-to-set-up-filter-group)
* [How do I configure Display Settings?](/guide/filter/configure-display-settings)
* [How do I choose a filter Layout?](/guide/filter/choose-your-filter-layout)
* [How do I merge duplicate filter values?](/guide/filter/merge-duplicate-filter-values)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
---
# How do I set up Image Swatches? (https://docs.sledge-app.com/guide/filter/set-up-image-swatches)
An image swatch replaces a plain text filter value with a small image — a brand logo instead of a vendor name, a pattern instead of a fabric label. Customers recognise the image faster than they read the word, which makes scanning the filter effortless.
## Before you start [#before-you-start]
This feature renders inside the Sledge product filter on your storefront, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **The Collections page surface is turned on.** Open **Sledge → Tools → Product Filter** and check the **Collections page** switch at the top — this is what puts the Sledge filter on your collection pages.
3. **A Filter Group shows the filter you want to decorate.** Image swatches decorate an existing filter item — the source you pick below must match the Source of that filter item in your Filter Group (for example a “Brand” item with source *Vendor*). If they don’t match, the filter keeps showing plain text.
## Open Image Swatch [#open-image-swatch]
Go to **Sledge → Tools → Product Filter**, and under **Features** click **Image Swatch**.
## The Image Swatch page [#the-image-swatch-page]
### Image source [#image-source]
The select at the top decides *where your values come from*. In the example it’s set to **Vendor**, so every brand in the store gets a row. You can also map values from product options, metafields, collections, tags, product types, and more — the same source list as Color Swatch. Remember: this source must match the source of the filter item in your Filter Group.
### The mapping table — one row per value [#the-mapping-table--one-row-per-value]
* **Label** — the raw value from your source (each vendor name above), with a preview of its swatch. Sortable via the arrows in the header.
* **Image** — the picture customers will see. Click **Upload image** to pick a file (square images work best); once set, the thumbnail shows next to a **Remove** link.
* **Action → Clear** — empties the row’s image so you can start over. To delete rows entirely, select them with the checkboxes and use the **Delete** bulk action.
There is no Save button on this page — every change is saved as soon as you make it.
## Add an image manually [#add-an-image-manually]
Values from your source appear automatically, but you can also click **Add image** for a value that doesn’t exist yet. Type the **Label** and click **Add**, then upload its image from the table row. **Import image** next to it uploads mappings in bulk.
## Result [#result]
On your collection pages, the vendor filter now renders as logo chips — customers click a logo to filter by that brand:
Not showing up? Give the change a minute to sync, then reload the collection page. Also confirm that Sledge Core and the Collections page switch are enabled as described above.
## Related [#related]
* [How do I set up Color Swatches?](/guide/filter/set-up-color-swatches)
* [How do I set up a filter group?](/guide/filter/how-to-set-up-filter-group)
* [How do I choose a filter Layout?](/guide/filter/choose-your-filter-layout)
* [How do I configure Display Settings?](/guide/filter/configure-display-settings)
* [How do I merge duplicate filter values?](/guide/filter/merge-duplicate-filter-values)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
---
# Growth Opportunities by Customer Journey: fixing your store stage by stage (https://docs.sledge-app.com/guide/growth-opportunities/growth-opportunities-by-customer-journey-fixing-your-store-stage-by-stage)
The **Playbook** in Growth Opportunities holds the same set of best practices in two arrangements. **By Customer Journey** is the one that follows your customer rather than your org chart — it lines the work up in the order a shopper actually experiences your store, from first landing to buying again.
Use this view when you know *where* customers are struggling but not which feature fixes it. If instead you know which outcome you want to move — AOV, repeat purchase, search relevance — the *By Goals* view is the better door into the same content.
**Before you start** — Sledge Core must be active on your theme. This view is most useful alongside **Journey Performance** in Analytics, which tells you which stage is actually leaking; bring that number with you and you’ll know exactly which stage to open.
## The five stages [#the-five-stages]
Open **Growth Opportunities** and choose the **By Customer Journey** tab. The work is grouped into five stages, shown as a row you can move through:
* **Discovery** — the customer has arrived and is working out what you sell. Search, browsing and collection pages dominate here.
* **Consideration** — they’re looking at specific products and comparing. Product pages, trust and reassurance matter.
* **Decision** — items are in the cart and they’re deciding whether to go through with it. Cart drawer and friction removal.
* **Purchase** — completing the order, plus anything that lifts the basket at the last moment.
* **Next purchase** — what happens after the order, to bring them back.
The heading tells you what you’re looking at — for example *Opportunities for Discovery* — with the note *Based on shopper signals from tools*, meaning the suggestions are informed by real behaviour on your store, not a generic checklist.
## What each stage contains [#what-each-stage-contains]
Within a stage, every card is a best practice with the same anatomy as the By Goals view: a **step count**, a completion **percentage**, a plain-language description, the **Surface** it applies to, and a **Configure** button.
From **Discovery** in this store, for example:
* **Make instant search feel guided** — improve instant search so customers see helpful results and suggestions as they type. *Search Page & Instant Search.*
* **Speed up browsing on collection pages** — make it easy to scan, filter and sort so customers reach the right items faster. *Collection Page.*
* **Fix query mismatches** — handle different wording, misspellings and close matches. *Search Page.*
* **Tune ranking for high-intent queries** — prioritise the right fields and apply merchandising rules. *Search Page.*
* **Improve results page experience** — make result and no-result states useful, and route high-intent keywords to the best page. *Search Page.*
* **Launch campaigns with banners and timers** — seasonal messaging and urgency. *Homepage, Global & Product Page.*
* **Make campaigns discoverable in search** — surface campaigns through suggestions and banners. *Search Page.*
* **Merchandising for seasonal pushes** — pin and boost key products, and notify customers when items return. *Collection Page.*
Notice that several of these also appear under goals like *Improve search relevance*. That’s deliberate — it’s one body of work shown through a different lens, and progress you make in one view immediately shows in the other.
## Configuring a practice [#configuring-a-practice]
**Configure** opens the same step-by-step screen used throughout the Playbook: numbered steps, a completion count per step, and a **Steps summary** so you can see the whole shape of the task.
Taking *Fix query mismatches*: **Step 1 — Manual synonym** lets you manage your own synonym rules so a search for one word still finds products named with another, and **Step 2 — Suggestion dictionary** lets you curate suggestions and preferred spellings so the dropdown steers customers toward searches that return results. Each step links straight to the screen where you do it.
## Choosing a stage to work on [#choosing-a-stage-to-work-on]
The advantage of this view is that it maps onto a diagnosis. Open **Analytics → Journey Performance**, find the stage with the worst step-through rate, then open that same stage here.
* Losing people at **Discovery → Consideration**? Visitors aren’t reaching product pages — work the Discovery stage: search quality, filters, collection browsing.
* Losing them at **Consideration → Decision**? They see products but don’t add to cart — work Consideration: trust, product page conversion.
* Losing them at **Decision → Purchase**? Carts aren’t becoming orders — work Decision: cart drawer friction, reassurance, incentives.
* Few returning customers? Work **Next purchase**.
This is the difference between guessing and fixing. Rather than configuring whichever feature you happened to read about, you find the leak, open that stage, and work the practices that address it.
## By Journey or By Goals? [#by-journey-or-by-goals]
They contain the same practices, so use whichever matches how you’re thinking:
* Use **By Customer Journey** when the problem is behavioural — “people leave before reaching a product page”. It pairs directly with Journey Performance.
* Use **By Goals** when the problem is commercial — “our average order value is too low”. It pairs with the goals reported in Analytics.
Progress is shared, so completing a step in one view updates the other.
**Not seeing progress?** A step only counts once its setting is saved and enabled — opening a screen isn’t enough. Stages tied to features you haven’t switched on will look untouched, which is accurate rather than broken. And because suggestions are informed by shopper signals, a store with little traffic will see a thinner list until customers start interacting.
## Related [#related]
* [Growth Opportunities by Goals: working through the playbook outcome by outcome](/guide/growth-opportunities/growth-opportunities-by-goals-working-through-the-playbook-outcome-by-outcome)
* [Understanding your Sledge Dashboard: revenue, growth intelligence, and live signals](/guide/onboarding/understanding-your-sledge-dashboard-revenue-growth-intelligence-and-live-signals)
* [How to Enable Sledge Core and Complete the Initial Setup ?](/guide/onboarding/how-to-enable-sledge-core-and-complete-the-initial-setup-1)
* [How do I set up Instant Search?](/guide/search/how-to-set-up-instant-search)
* [How do I set up Personalized Picks?](/guide/recommendations/set-up-personalized-picks)
* [How do I set up Recently Viewed?](/guide/recommendations/set-up-recently-viewed)
---
# Growth Opportunities by Goals: working through the playbook outcome by outcome (https://docs.sledge-app.com/guide/growth-opportunities/growth-opportunities-by-goals-working-through-the-playbook-outcome-by-outcome)
**Growth Opportunities** is Sledge’s standing to-do list for your store. It monitors your data every week, works out what deserves attention, and turns that into a checklist you can work through — instead of leaving you to guess which of the nine tools to configure next.
The list is called the **Playbook**, and it has two views of the same content. This guide covers **By Goals**, which groups the work by the business outcome it moves. If you’d rather organise the same tasks by where customers are in their journey, see the *By Customer Journey* guide.
**Before you start** — Sledge Core must be active on your theme. Findings are based on your own order and behaviour data, so a new store will see fewer of them at first; they sharpen as orders build up.
## Reading the summary bar [#reading-the-summary-bar]
The header explains the promise: *Sledge monitors your store every week and surfaces what deserves your attention most.* Four figures sit beneath it:
* **Est. potential** — the estimated revenue available if you complete the outstanding work. Treat it as a rough sizing to help you prioritise, not a forecast.
* **Goals completed** — how many of the nine goals are fully done.
* **Best practices done** — the finer-grained count across all goals (for example *0 of 25*).
* **Last monitored** / **Next** — when Sledge last reviewed your store and when it will look again.
## Growth Intelligence findings [#growth-intelligence-findings]
Above the Playbook sit the findings Sledge has raised from your order data, the same ones shown on your Dashboard, with **View all findings** to see the full set. Each has a priority, an observation about your store, a button that jumps to the fix, and **Ignore** to dismiss it.
The distinction is worth understanding: **findings** are reactive — specific problems spotted in your data. The **Playbook** below is proactive — the full set of best practices regardless of whether a problem has shown up yet. Findings tell you what’s broken; the Playbook tells you what’s possible.
## Getting notified [#getting-notified]
**Stay informed with growth intelligence updates** sends new findings to you rather than waiting for you to check. Available channels are **Email**, **SMS**, **Telegram** and **Slack**, and **Notification settings** is where you choose which to use. Worth switching on at least one — findings are time-sensitive, and the value comes from acting while the pattern is fresh.
## The Playbook, By Goals [#the-playbook-by-goals]
Choose the **By Goals** tab and the work is grouped into nine outcomes. Each card shows the goal, a progress count of its best practices, what it achieves, and the **Surface** it applies to:
* **Improve product discovery** — help customers find relevant products faster. *Instant Search, Search Page & Collection Page.*
* **Improve search relevance** — make results match intent consistently. *Search Page.*
* **Improve collection browsing (filters)** — let customers narrow down in fewer steps. *Collection Page.*
* **Increase product page conversion** — build trust so more views become add-to-carts. *Product Page.*
* **Increase average order value (AOV)** — grow cart size with bundles, discounts and add-ons. *Product Page, Cart Drawer, Collection Page & Thank You Page.*
* **Increase cart conversion (cart drawer)** — reduce friction so more carts become orders. *Cart Drawer, Global & Product Page.*
* **Improve campaign performance** — clearer messaging, urgency and curated merchandising. *Homepage, Global, Product Page & Search Page.*
* **Increase repeat purchase** — turn one-time buyers into returning ones. *Product Page & Thank You Page.*
* **Recover dead ends** — turn no-results and wrong searches into pathways. *Search Page, Product Page & Collection Page.*
Pick the goal that matches what you’re actually trying to fix. If your problem is a low average order value, go to the AOV goal — not whichever card happens to have the lowest score.
## Inside a goal: the best practices [#inside-a-goal-the-best-practices]
Click a goal and it opens to reveal the best practices that make it up. Each one shows how many **steps** it involves, a completion **percentage**, a description, the **Surface** it affects, and a **Configure** button. Practices already finished also offer **Show performance** so you can see what they earned.
Taking *Improve search relevance* as the example, it breaks into three practices:
* **Fix query mismatches** — handle different wording, misspellings and close matches so customers still get results.
* **Tune ranking for high-intent queries** — prioritise the right fields and apply merchandising rules to queries that matter.
* **Improve results page experience** — make both result and no-result states useful, and route high-intent keywords to the best page.
## Inside a best practice: the actual settings [#inside-a-best-practice-the-actual-settings]
Click **Configure** and Sledge walks you through the specific settings, numbered as steps, with a **Steps summary** alongside so you can see where you are.
Continuing the example, *Fix query mismatches* has two steps:
* **Step 1 — Manual synonym** (*1 of 1 completed*): manage your own synonym rules, so a customer searching “sneakers” still finds products you call “trainers”. The button is **Setup manual synonyms**.
* **Step 2 — Suggestion dictionary** (*0 of 1 completed*): curate query suggestions and preferred spellings, so the dropdown guides customers toward searches that return results. The button is **Setup suggestion dictionary**.
This is the level that makes the Playbook useful. Each step names a real setting, explains what it does in plain terms, tracks whether you’ve done it, and links straight to the screen where you do it — so “improve search relevance” stops being an abstraction and becomes two concrete jobs.
## A sensible way to work through it [#a-sensible-way-to-work-through-it]
1. Deal with any **High** priority finding first — it’s a problem Sledge has actually observed in your data.
2. Then pick the goal matching your current business priority, not the easiest one.
3. Inside it, start with the practice showing the lowest completion percentage — that’s where the untouched work is.
4. Work the steps in order; they’re sequenced so earlier steps support later ones.
5. Come back after the next weekly monitor and check **Est. potential** and **Goals completed** have moved.
**Not seeing progress?** A step only counts as complete once the underlying setting is saved and enabled — configuring it without saving leaves the counter unchanged. If a goal seems irrelevant to your store, it’s fine to leave it; the score is a guide, not a grade. And if findings look sparse, that’s normal for a new store — Growth Intelligence reads order history, so it needs orders before it can say much.
## Related [#related]
* [Growth Opportunities by Customer Journey: fixing your store stage by stage](/guide/growth-opportunities/growth-opportunities-by-customer-journey-fixing-your-store-stage-by-stage)
* [Understanding your Sledge Dashboard: revenue, growth intelligence, and live signals](/guide/onboarding/understanding-your-sledge-dashboard-revenue-growth-intelligence-and-live-signals)
* [How to Enable Sledge Core and Complete the Initial Setup ?](/guide/onboarding/how-to-enable-sledge-core-and-complete-the-initial-setup-1)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How to set up a promotion Banner?](/guide/promotion/how-to-set-up-a-promotion-banner)
* [How do I set up Personalization?](/guide/search/set-up-personalization)
---
# Growth Opportunities (https://docs.sledge-app.com/guide/growth-opportunities)
---
# Integrations (https://docs.sledge-app.com/guide/integrations)
---
# Show Judge.me star ratings on Sledge widgets (https://docs.sledge-app.com/guide/integrations/judge-me)
Sledge can display your **Judge.me** product ratings directly on the product cards inside Sledge's search, filter, recommendation, and bundle widgets — so shoppers see social proof wherever they browse, not only on product pages.
The best part: once you flip the toggle, it works automatically. **No theme edits or code changes required.**
## Before you start [#before-you-start]
Make sure you have:
* The **Judge.me Product Reviews** app installed on your Shopify store
* Judge.me reviews already showing correctly on your product pages
* Sledge installed and active
If Judge.me isn't showing ratings on your own product pages yet, set that up first — Sledge reuses the same data.
## How to enable it [#how-to-enable-it]
1. In your Shopify Admin, open **Sledge**
2. In the left sidebar, click **Settings & Support**
3. Open the **Integration** page
4. Find the **Judge.me** row and flip the switch **ON**
The toggle saves automatically — you'll see a "Settings saved" confirmation at the bottom of the screen. Ratings will start appearing on Sledge product cards within about a minute.
\> **Note:** Judge.me and Loox cannot both be active at the same time. Turning Judge.me **ON** will automatically turn Loox **OFF**. Only one review provider can be shown at a time.
## Where ratings will appear [#where-ratings-will-appear]
This integration only adds ratings to **Sledge's own product cards** — the ones rendered inside Sledge widgets. It does not change how Judge.me appears anywhere else on your store.
Once enabled, Judge.me star ratings show up on product cards in:
* Sledge search results
* Sledge instant search dropdown
* Sledge product filter / collection grids
* Sledge product recommendations
* Sledge bundle listings
Your existing Judge.me widgets on product pages, homepage, and anywhere else on your theme are not affected — they keep working exactly as before.
## Troubleshooting [#troubleshooting]
**Ratings aren't showing up.** Wait about a minute, then refresh your storefront and clear your browser cache. If you use a CDN or page cache, clear that too.
**Ratings show on product pages but not on Sledge widgets.** Re-open **Sledge → Settings & Support → Integration** and confirm the Judge.me switch is **ON**.
**Can I turn on Judge.me and Loox at the same time?** No. They're mutually exclusive — enabling one will automatically disable the other.
**Do I need to edit my theme or add any code?** No. The integration is fully automatic once the toggle is on.
---
# Show Loox star ratings on Sledge widgets (https://docs.sledge-app.com/guide/integrations/loox)
Sledge can display your **Loox** product ratings directly on the product cards inside Sledge's search, filter, recommendation, and bundle widgets — so shoppers see social proof wherever they browse, not only on product pages.
The best part: once you flip the toggle, it works automatically. **No theme edits or code changes required.**
## Before you start [#before-you-start]
Make sure you have:
* The **Loox ‑ Product Reviews & Photos** app installed on your Shopify store
* Loox reviews already showing correctly on your product pages
* Sledge installed and active
If Loox isn't showing ratings on your own product pages yet, set that up first — Sledge reuses the same data.
## How to enable it [#how-to-enable-it]
1. In your Shopify Admin, open **Sledge**
2. In the left sidebar, click **Settings & Support**
3. Open the **Integration** page
4. Find the **Loox** row and flip the switch **ON**
The toggle saves automatically — you'll see a "Settings saved" confirmation at the bottom of the screen. Ratings will start appearing on Sledge product cards within about a minute.
\> **Note:** Loox and Judge.me cannot both be active at the same time. Turning Loox **ON** will automatically turn Judge.me **OFF**. Only one review provider can be shown at a time.
## Where ratings will appear [#where-ratings-will-appear]
This integration only adds ratings to **Sledge's own product cards** — the ones rendered inside Sledge widgets. It does not change how Loox appears anywhere else on your store.
Once enabled, Loox star ratings show up on product cards in:
* Sledge search results
* Sledge instant search dropdown
* Sledge product filter / collection grids
* Sledge product recommendations
* Sledge bundle listings
Your existing Loox widgets on product pages, homepage, and anywhere else on your theme are not affected — they keep working exactly as before.
## Troubleshooting [#troubleshooting]
**Ratings aren't showing up.** Wait about a minute, then refresh your storefront and clear your browser cache. If you use a CDN or page cache, clear that too.
**Ratings show on product pages but not on Sledge widgets.** Re-open **Sledge → Settings & Support → Integration** and confirm the Loox switch is **ON**.
**Can I turn on Loox and Judge.me at the same time?** No. They're mutually exclusive — enabling one will automatically disable the other.
**Do I need to edit my theme or add any code?** No. The integration is fully automatic once the toggle is on.
---
# How to set position Banner? (https://docs.sledge-app.com/guide/merchandising/how-to-set-position-banner)
**Banner** places one of your existing promotional banners directly into the product grid, at a slot number you choose. Rather than sitting above the page where customers scroll straight past it, the banner occupies a card slot inside the results — so it lands in the middle of browsing, exactly where attention already is.
This action lives inside a **merchandising rule** (a “Strategy”). It doesn’t design the banner — it positions a banner you’ve already built in **Promotion**.
**Before you start** — You need at least one promotion banner already created. Sledge must also be active on your theme.
## Create the rule [#create-the-rule]
1. Go to **Tools → Merchandising → Strategy** and click **Add Strategies** (or open an existing rule).
2. Under **Rule settings**, enter a **Rule name** and choose an **Activation type** — **Always active** or **Set active date**. Scheduling is especially handy here: set the window to match your campaign so the banner appears and disappears on its own.
3. Under **Surfaces**, enable **Collection Page** (**All collections** or **Specific collection**) and/or **Search Page & Instant Search**. At least one surface is required.
## Place your banner [#place-your-banner]
1. Scroll to **Strategies** and turn on **Banner** — *“Control banner placement per surface and display existing banners even if they are not assigned to that surface.”*
2. In the **Banner 1** card, choose your banner from the **Banner** dropdown, then set its **Position**. As the note says: *Position 1 is the very top of the list.* Banners default to **position 2** — so the banner slots in after the first product rather than pushing it down, which usually reads better.
The red arrows below show a real rule: the banner *Banner demostore collection (product card)* is placed at **position 8**, so it lands in the second row of the grid.
3. Click **Add banner** to place another banner at a different slot. If you have none yet, use **Create banner** to make one.
4. Click **Save** and set **Status** to **Enable**. Check the live **Preview** to see where the banner lands.
**Good to know** — The wording “even if they are not assigned to that surface” matters: placing a banner here **overrides** the banner’s own surface settings, so it will show in this collection regardless of where the banner was originally scoped.
## Result [#result]
**Done.** Your banner now occupies a slot in the product grid on that collection or search page — customers meet your promotion while they browse, and clicking it takes them wherever the banner points.
To check it on your storefront, open the collection and look at the grid: the banner tile sits at the position you set (by default, right after the first product).
**Not showing up?** Check the rule’s **Status** is **Enable**, the collection is listed under **Surfaces**, and the banner itself is active. If you scheduled the rule, confirm today falls inside the active window. Storefront changes can take about a minute to sync.
## Related [#related]
* [How to set position Bundle, Discount & Upsell?](/guide/merchandising/how-to-set-position-bundle-discount-upsell)
* [How to set up inject product?](/guide/merchandising/how-to-set-up-inject-product)
* [How to set up pin product?](/guide/merchandising/how-to-set-up-pin)
* [How to set up a promotion Banner?](/guide/promotion/how-to-set-up-a-promotion-banner)
* [How to set up boost product?](/guide/merchandising/how-to-set-up-boost)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to set position Bundle, Discount & Upsell? (https://docs.sledge-app.com/guide/merchandising/how-to-set-position-bundle-discount-upsell)
**Bundle, Discount & Upsell** places one of your existing bundle offers directly into the product grid, at a slot number you choose. Instead of hoping customers find the offer on a product page, you put the deal in front of them while they browse — and because it sits in the grid like a card, it reads as part of the collection rather than an ad.
This action lives inside a **merchandising rule** (a “Strategy”). It doesn’t create the bundle — it positions a bundle you’ve already built in **Bundle, Discount & Upsell**.
**Before you start** — You need at least one bundle already created. Only **Fixed bundle**, **Buy X get Y**, and **Volume discount** can be placed here — the other types (like Free gift or Subscription) only ever render in the cart or on a product page, so they’re not offered.
## Create the rule [#create-the-rule]
1. Go to **Tools → Merchandising → Strategy** and click **Add Strategies** (or open an existing rule).
2. Under **Rule settings**, enter a **Rule name** and choose an **Activation type** — **Always active** or **Set active date**.
3. Under **Surfaces**, enable **Collection Page** (**All collections** or **Specific collection**) and/or **Search Page & Instant Search**. At least one surface is required.
## Place your bundle [#place-your-bundle]
1. Scroll to **Strategies** and turn on **Bundle, Discount & Upsell** — *“Control the placement of discounted products per surface and display existing discounts even if they are not assigned to that surface”*.
2. In the **Discount 1** card, choose your offer from the **Bundle** dropdown, then set its **Position**. As the note says: *Position 1 is the very top of the list.*
3. Click **Add discount** to place another bundle at a different slot. If you have no bundles yet, use **Create bundle, discount & upsell** to make one without leaving the page.
4. Click **Save** and set **Status** to **Enable**.
**Good to know** — The wording “even if they are not assigned to that surface” matters: placing a bundle here **overrides** the bundle’s own surface settings. So a bundle that normally only shows on product pages will still appear in this collection.
## Result [#result]
**Done.** Your bundle now appears as a card in the grid at the position you set — customers see the offer, the saving, and the included products while they browse, and can add the whole bundle in one go.
**Not showing up?** Check the rule’s **Status** is **Enable**, the collection is listed under **Surfaces**, and the bundle itself is active. Remember only Fixed bundle, Buy X get Y, and Volume discount can be placed in a grid. Storefront changes can take about a minute to sync.
## Related [#related]
* [How to set position Banner?](/guide/merchandising/how-to-set-position-banner)
* [How to set up inject product?](/guide/merchandising/how-to-set-up-inject-product)
* [How to set up pin product?](/guide/merchandising/how-to-set-up-pin)
* [How to set up boost product?](/guide/merchandising/how-to-set-up-boost)
* [How to set up pre order bundle?](/guide/merchandising/how-to-set-up-pre-order-bundle)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up A/B Testing for Back in stock? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-a-b-testing-for-back-in-stock)
**A/B testing** lets you run two versions of the same Back in Stock at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Back in Stock the things worth testing are the notify button label, the form wording, or the confirmation message.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Merchandising → Back in Stock**. This feature has a single settings page rather than a list, so you’re already on the record. Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s the notify-me button on a sold-out product page:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Back in Stock from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* [How to set up Back in Stock?](/guide/merchandising/how-to-set-up-back-in-stock)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
* [How to Set Up A/B Testing for Badge Campaign?](/guide/merchandising/how-to-set-up-a-b-testing-for-badge-campaign)
* [How to Set Up A/B Testing for Pre-Order (Single & Multiple)?](/guide/merchandising/how-to-set-up-a-b-testing-for-pre-order-single-multiple)
* [How to set up a badge campaign?](/guide/merchandising/how-to-set-up-a-badge-campaign)
* [How to set up pre order (single / multiple products)?](/guide/merchandising/how-to-set-up-pre-order-single-multiple-products)
---
# How to Set Up A/B Testing for Badge Campaign? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-a-b-testing-for-badge-campaign)
**A/B testing** lets you run two versions of the same Badge Campaign at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Badge Campaign the things worth testing are the badge wording, its colour, or which products carry it.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Merchandising → Badge Campaign** and click into the record you want to test (the example here is *Best seller demo*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s badges on the product cards in a collection:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Badge Campaign from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* [How to set up a badge campaign?](/guide/merchandising/how-to-set-up-a-badge-campaign)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
* [How to Set Up A/B Testing for Back in stock?](/guide/merchandising/how-to-set-up-a-b-testing-for-back-in-stock)
* [How to Set Up A/B Testing for Pre-Order (Single & Multiple)?](/guide/merchandising/how-to-set-up-a-b-testing-for-pre-order-single-multiple)
* [How to set up Back in Stock?](/guide/merchandising/how-to-set-up-back-in-stock)
* [How to set up pre order (single / multiple products)?](/guide/merchandising/how-to-set-up-pre-order-single-multiple-products)
---
# How to Set Up A/B Testing for Merchandising Strategy? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
**A/B testing** lets you run two versions of the same Merchandising Strategy at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Merchandising Strategy the things worth testing are which products you pin or boost, how far they move, or which surfaces the rule runs on.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Merchandising → Strategy** and click into the record you want to test (the example here is *a collection-page rule*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s a collection page, where the rule decides what customers meet first:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Merchandising Strategy from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* [How to set up pin product?](/guide/merchandising/how-to-set-up-pin)
* [How to set up boost product?](/guide/merchandising/how-to-set-up-boost)
* [How to Set Up A/B Testing for Badge Campaign?](/guide/merchandising/how-to-set-up-a-b-testing-for-badge-campaign)
* [How to Set Up A/B Testing for Back in stock?](/guide/merchandising/how-to-set-up-a-b-testing-for-back-in-stock)
* [How to Set Up A/B Testing for Pre-Order (Single & Multiple)?](/guide/merchandising/how-to-set-up-a-b-testing-for-pre-order-single-multiple)
* [How to set up inject product?](/guide/merchandising/how-to-set-up-inject-product)
---
# How to Set Up A/B Testing for Pre-Order (Single & Multiple)? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-a-b-testing-for-pre-order-single-multiple)
**A/B testing** lets you run two versions of the same Pre-order at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Pre-order the things worth testing are the button label, the delivery promise, or how the pre-order terms are explained.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Merchandising → Pre-order** and click into the record you want to test (the example here is *Pre Order 1*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s the pre-order badge and button on the product page:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Pre-order from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* [How to set up pre order (single / multiple products)?](/guide/merchandising/how-to-set-up-pre-order-single-multiple-products)
* [How to set up pre order bundle?](/guide/merchandising/how-to-set-up-pre-order-bundle)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
* [How to Set Up A/B Testing for Badge Campaign?](/guide/merchandising/how-to-set-up-a-b-testing-for-badge-campaign)
* [How to Set Up A/B Testing for Back in stock?](/guide/merchandising/how-to-set-up-a-b-testing-for-back-in-stock)
* [How to set up a badge campaign?](/guide/merchandising/how-to-set-up-a-badge-campaign)
---
# How to set up a badge campaign? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-a-badge-campaign)
A badge campaign sticks a label — “BEST SELLER”, “NEW”, “BFCM” — on the product cards you choose, everywhere those cards appear. Badges guide the eye and lift clicks on the products you want to push.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Create or edit a badge campaign [#create-or-edit-a-badge-campaign]
Go to **Sledge → Tools → Merchandising**, open **Badge Campaign**, and click **Add** (or open an existing one — the example is “Best seller demo”).
### Campaign name and Applies to [#campaign-name-and-applies-to]
**Campaign name** is internal. **Applies to** selects the products that get the badge — **All products**, **Specific products** (the example picks 11 by hand), **Products in specific collections**, or the two **Exclude** modes.
### Country, Active dates, and Inventory conditions [#country-active-dates-and-inventory-conditions]
Beyond country and scheduling, **Inventory conditions** can tie the badge to stock levels: show it regardless (**Any**), only when **In stock** or **Out of stock**, or when available quantity is above / below a number — handy for automatic “Low stock” style badges.
### Badge settings and Badge position [#badge-settings-and-badge-position]
**Badge settings** holds the content: an optional **Icon** and the **Badge label** text (“BEST SELLER”). **Badge position** decides placement on the product card — **Inside image** (with a corner choice: top right, top left, bottom right, bottom left) or **In bottom image**, a strip under the photo.
### Surfaces [#surfaces]
Badges follow their products everywhere you enable them: Collection Page, Product Page, Search Page, Instant Search, Cart Page, and Cart Drawer each have their own switch.
### Status and Preview [#status-and-preview]
The **Preview** shows a real product card with your badge in place. **Create A/B** starts an A/B test. Click **Save** to apply.
## Result [#result]
On the storefront, the badge rides the product card wherever it appears — here “BEST SELLER” on a card in a collection grid:
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How to Set Up A/B Testing for Badge Campaign?](/guide/merchandising/how-to-set-up-a-b-testing-for-badge-campaign)
* [How to set up pre order (single / multiple products)?](/guide/merchandising/how-to-set-up-pre-order-single-multiple-products)
* [How to set up Back in Stock?](/guide/merchandising/how-to-set-up-back-in-stock)
* [How to set up pre order bundle?](/guide/merchandising/how-to-set-up-pre-order-bundle)
* [How to set up pin product?](/guide/merchandising/how-to-set-up-pin)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to set up Back in Stock? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-back-in-stock)
Back in Stock lets customers leave their email on a sold-out product and get an automatic email the moment it’s available again — recovering demand you would otherwise lose. It’s one page: who it applies to, the button, the form, and the email.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Open Back in Stock [#open-back-in-stock]
Go to **Sledge → Tools → Merchandising** and open **Back in Stock**. It’s a single settings page (no list of campaigns).
### Campaign, Applies to, and Country [#campaign-applies-to-and-country]
Name the campaign, then choose which out-of-stock products offer the notification: **All out of stock products**, **Specific products** (the example covers the Olive Piqué Polo Shirt), **Specific collections**, or **Exclude collections**. **Country** limits where the button shows.
### Active dates and Button position [#active-dates-and-button-position]
Scheduling works like every other campaign. **Button position** puts the notify button either **At bottom product button** (under the normal buy buttons) or **At sticky right product card**.
### Form and Confirm message [#form-and-confirm-message]
Every text of the signup flow is editable: the form’s **Header** (“Get notified when it’s back”), **Description**, **Email placeholder**, the **Email error** message, and the consent **Term message**. **Confirm message** is what customers see right after subscribing (“You’re on the list”).
### Email [#email]
The notification email itself: **Branding text** (or a logo), **Email sender name**, then the content — **Email subject & heading**, **Description**, **Button text** (“Shop now”), and **Unsubscriber text**. The subject and description support the `{product_title}` placeholder, which is replaced with the actual product name when the email is sent.
### Previews [#previews]
The right rail previews each piece live: the product page button, the signup form, and the confirmation toast — with mobile and desktop toggles.
The email preview shows the final email with your branding, content, and the product card. Click **Save** to apply changes.
## Result [#result]
Sold-out eligible products show the **Get notified when it’s back** button; customers subscribe through your form, and when stock returns Sledge automatically emails everyone on the list with your configured email.
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How to Set Up A/B Testing for Back in stock?](/guide/merchandising/how-to-set-up-a-b-testing-for-back-in-stock)
* [How to set up a badge campaign?](/guide/merchandising/how-to-set-up-a-badge-campaign)
* [How to set up pre order (single / multiple products)?](/guide/merchandising/how-to-set-up-pre-order-single-multiple-products)
* [How to set up pre order bundle?](/guide/merchandising/how-to-set-up-pre-order-bundle)
* [How to set up pin product?](/guide/merchandising/how-to-set-up-pin)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to set up boost product? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-boost)
**Boost** pushes products up the results without nailing them to a fixed slot. Unlike Pin, you don’t choose exact positions — you either name the products you want lifted, or describe them with conditions (“on sale”, “best sellers”, “new arrivals”) and let Sledge lift whatever matches, automatically, as your catalogue changes.
Boost lives inside a **merchandising rule** (a “Strategy”). One rule can carry several actions at once, so Boost can run alongside Pin, Hide, and the rest.
**Before you start** — Sledge must be active on your theme, and the collection or search page you want to curate should already be working.
## Create the rule [#create-the-rule]
1. Go to **Tools → Merchandising → Strategy** and click **Add Strategies** (or open an existing rule).
2. Under **Rule settings**, enter a **Rule name** and choose an **Activation type** — **Always active** or **Set active date**.
3. Under **Surfaces**, enable **Collection Page** (**All collections** or **Specific collection**) and/or **Search Page & Instant Search** (**All searches** or **Specific keywords**). At least one surface is required.
## Set up Boost [#set-up-boost]
1. Scroll to **Strategies** and turn on **Boost** — *“Increase product ranking based on selected products or attributes.”*
2. Pick how you want to choose products:
* **By Product Items** — hand-pick up to **5 products** to lift. Use **Add more boost** for extra rows.
* **By Attributes and Metrics** — describe them instead. Build condition groups from attributes like *Product type, Vendor, Tag, Price, Inventory, New arrivals, On sale, Best sellers, Most viewed, Most clicked, Highest conversion rate,* and *Highest add-to-cart ratio*, with operators such as *Is, More than,* or *Less than*. Rules inside a group must all match; add another group with **Add new group** for an alternative set.
3. Click **Save** and set **Status** to **Enable**. Watch the live **Preview** to see the new order.
**Good to know** — There is no strength or weight setting; boosted products simply move up. Pin runs first and claims its exact slots, so Boost fills the highest slots that are still free. If a product is both boosted and demoted, **Demote wins**.
## Result [#result]
**Done.** Matching products now rise toward the top of that collection or search page, above products that don’t match — and with the attribute mode, the line-up keeps itself up to date as products go on sale, sell well, or arrive.
**Not showing up?** Check the rule’s **Status** is **Enable** and the collection is listed under **Surfaces**. If you used conditions, make sure products actually match them — a condition group only matches when *every* rule in it is true. Storefront changes can take about a minute to sync.
## Related [#related]
* [How to set up pin product?](/guide/merchandising/how-to-set-up-pin)
* [How to set up demote product?](/guide/merchandising/how-to-set-up-demote)
* [How to set up hide product?](/guide/merchandising/how-to-set-up-hide)
* [How to set up filter product?](/guide/merchandising/how-to-set-up-filter)
* [How to set up inject product?](/guide/merchandising/how-to-set-up-inject-product)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to set up demote product? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-demote)
**Demote** pushes products to the very bottom of a collection or search results without removing them. Use it for clearance leftovers, low-margin lines, or items you must keep listed but don’t want competing for attention — customers can still find and buy them, they just stop taking up prime space.
Demote lives inside a **merchandising rule** (a “Strategy”). One rule can carry several actions at once.
**Before you start** — Sledge must be active on your theme, and the collection or search page you want to curate should already be working.
## Create the rule [#create-the-rule]
1. Go to **Tools → Merchandising → Strategy** and click **Add Strategies** (or open an existing rule).
2. Under **Rule settings**, enter a **Rule name** and choose an **Activation type** — **Always active** or **Set active date**.
3. Under **Surfaces**, enable **Collection Page** (**All collections** or **Specific collection**) and/or **Search Page & Instant Search** (**All searches** or **Specific keywords**). At least one surface is required.
## Set up Demote [#set-up-demote]
1. Scroll to **Strategies** and turn on **Demote** — *“Lower products so they appear further down.”*
2. Choose how to select the products:
* **By Product Items** — hand-pick up to **5 products** to push down. Use **Add more demote** for extra rows.
* **By Attributes and Metrics** — describe them with condition groups instead, using attributes such as *Product type, Vendor, Tag, Price, Inventory,* or metrics like *Most viewed*. Every rule in a group must match; add another group for an alternative set.
3. Click **Save** and set **Status** to **Enable**.
**Good to know** — Demote is strong: matching products sort last *even if the customer changes the sort order*. If a product is caught by both Boost and Demote, **Demote wins** and it stays at the bottom.
## Result [#result]
**Done.** The products you chose now appear at the very end of that collection or search page — usually the last page — while everything else moves up. They remain fully listed and purchasable.
To check it on your storefront, open the collection and jump to the **last page** of results: the demoted products will be sitting there. (Use **Hide** instead if you want them gone from the results entirely.)
**Not showing up?** Check the rule’s **Status** is **Enable** and the collection is listed under **Surfaces**. Remember to look at the last page — demoted products don’t disappear, they move. Storefront changes can take about a minute to sync.
## Related [#related]
* [How to set up hide product?](/guide/merchandising/how-to-set-up-hide)
* [How to set up boost product?](/guide/merchandising/how-to-set-up-boost)
* [How to set up filter product?](/guide/merchandising/how-to-set-up-filter)
* [How to set up pin product?](/guide/merchandising/how-to-set-up-pin)
* [How to set up inject product?](/guide/merchandising/how-to-set-up-inject-product)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to set up filter product? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-filter)
**Filter** is an allowlist: it restricts a collection or search page to *only* the products you approve, and everything else disappears. It’s the mirror image of Hide — instead of naming what to remove, you name what’s allowed to stay. Use it to build a tightly curated edit (a campaign landing page, a seasonal capsule) without creating a new Shopify collection.
Filter lives inside a **merchandising rule** (a “Strategy”). One rule can carry several actions at once.
**Before you start** — Sledge must be active on your theme, and the collection or search page you want to curate should already be working.
## Create the rule [#create-the-rule]
1. Go to **Tools → Merchandising → Strategy** and click **Add Strategies** (or open an existing rule).
2. Under **Rule settings**, enter a **Rule name** and choose an **Activation type** — **Always active** or **Set active date**.
3. Under **Surfaces**, enable **Collection Page** (**All collections** or **Specific collection**) and/or **Search Page & Instant Search** (**All searches** or **Specific keywords**). At least one surface is required.
## Set up Filter [#set-up-filter]
1. Scroll to **Strategies** and turn on **Filter** — *“Restrict results to show only products that match your defined conditions”*.
2. Choose how to define the allowlist:
* **By Product Items** — pick the products that are allowed to show (up to **5**). Use **Add more filter** for extra rows.
* **By Attributes and Metrics** — describe them with condition groups instead (for example, only products with a given *Tag*, or only those *On sale*). Every rule in a group must match; add another group for an alternative set.
3. Click **Save** and set **Status** to **Enable**.
**Handle with care** — Filter is the most aggressive action. Anything outside your allowlist vanishes from that page, so result counts can collapse hard. If you only want to remove a few items, use **Hide** instead; if you only want to change the order, use **Boost** or **Demote**.
## Result [#result]
**Done.** That collection or search page now shows only the products on your allowlist — the result count matches the size of your list, and nothing else appears.
To check it on your storefront, open the collection and confirm the **result count** equals the number of products you allowed, and that only those cards are in the grid.
**Not showing up?** Check the rule’s **Status** is **Enable** and the collection is listed under **Surfaces**. If the page looks empty, your allowlist is probably too narrow — the allowed products must also genuinely belong to that collection. Storefront changes can take about a minute to sync.
## Related [#related]
* [How to set up hide product?](/guide/merchandising/how-to-set-up-hide)
* [How to set up demote product?](/guide/merchandising/how-to-set-up-demote)
* [How to set up boost product?](/guide/merchandising/how-to-set-up-boost)
* [How to set up pin product?](/guide/merchandising/how-to-set-up-pin)
* [How to set up inject product?](/guide/merchandising/how-to-set-up-inject-product)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to set up hide product? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-hide)
**Hide** removes products from a collection or search results completely — they simply aren’t there, and the result count drops. Use it for items you don’t want surfaced while browsing (discontinued lines, staff-only SKUs, region-specific stock) without unpublishing them in Shopify.
Hide lives inside a **merchandising rule** (a “Strategy”). One rule can carry several actions at once.
**Before you start** — Sledge must be active on your theme, and the collection or search page you want to curate should already be working.
## Create the rule [#create-the-rule]
1. Go to **Tools → Merchandising → Strategy** and click **Add Strategies** (or open an existing rule).
2. Under **Rule settings**, enter a **Rule name** and choose an **Activation type** — **Always active** or **Set active date**.
3. Under **Surfaces**, enable **Collection Page** (**All collections** or **Specific collection**) and/or **Search Page & Instant Search** (**All searches** or **Specific keywords**). At least one surface is required.
## Set up Hide [#set-up-hide]
1. Scroll to **Strategies** and turn on **Hide** — *“Hide selected products from customer-facing results.”*
2. Choose how to select the products:
* **By Product Items** — hand-pick up to **5 products** to hide. Use **Add more hide** for extra rows.
* **By Attributes and Metrics** — describe them with condition groups instead (for example, hide everything from a given *Vendor*, or anything *Out of Stock*). Every rule in a group must match.
3. Click **Save** and set **Status** to **Enable**.
**Important** — Hide only affects *browsing*. The product is not unpublished: a customer with a direct link to the product page can still open and buy it. To take it off your store entirely, unpublish it in Shopify instead.
## Result [#result]
**Done.** The products you chose are gone from that collection or search page, and the result count at the top drops to match. Everything else moves up to fill the gap.
To check it on your storefront, open the collection and compare the **result count** before and after enabling the rule — that number is the quickest confirmation Hide is working. (Use **Demote** instead if you want them kept but pushed to the bottom.)
**Not showing up?** Check the rule’s **Status** is **Enable** and the collection is listed under **Surfaces**. If you used conditions, confirm the products really match them. Storefront changes can take about a minute to sync.
## Related [#related]
* [How to set up demote product?](/guide/merchandising/how-to-set-up-demote)
* [How to set up filter product?](/guide/merchandising/how-to-set-up-filter)
* [How to set up boost product?](/guide/merchandising/how-to-set-up-boost)
* [How to set up pin product?](/guide/merchandising/how-to-set-up-pin)
* [How to set up inject product?](/guide/merchandising/how-to-set-up-inject-product)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to set up inject product? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-inject-product)
**Inject product** drops a product into a collection or search results *even when it doesn’t belong there* — at a slot number you choose. Unlike Pin (which can only reorder products already in the collection), Inject reaches across your whole catalogue. It’s the fix for cross-selling into a category, and the classic rescue for a search that would otherwise return nothing.
Inject lives inside a **merchandising rule** (a “Strategy”). One rule can carry several actions at once.
**Before you start** — Sledge must be active on your theme, and the collection or search page you want to curate should already be working.
## Create the rule [#create-the-rule]
1. Go to **Tools → Merchandising → Strategy** and click **Add Strategies** (or open an existing rule).
2. Under **Rule settings**, enter a **Rule name** and choose an **Activation type** — **Always active** or **Set active date**.
3. Under **Surfaces**, enable **Collection Page** (**All collections** or **Specific collection**) and/or **Search Page & Instant Search** (**All searches** or **Specific keywords**). At least one surface is required.
## Set up Inject product [#set-up-inject-product]
1. Scroll to **Strategies** and turn on **Inject product** — *“Add products from other collections at a chosen position”*.
2. Each row is one slot: pick a product with **Select product**, and set the **position** it should land in. The picker searches your **entire catalogue** — not just this collection — which is the whole point of the action.
3. Click **Add more inject product** for extra slots. There’s no limit on how many you add.
4. Click **Save** and set **Status** to **Enable**. Use the live **Preview** to check the placement.
**Good to know** — Pin claims its exact slots first. If a pin already owns the number you asked for, your injected product takes the next free slot rather than being dropped. A great use case: point a rule at a **search keyword** that returns nothing and inject a few curated products, so customers get suggestions instead of a dead end.
## Result [#result]
**Done.** The product you injected now appears in that collection or search page at your chosen slot, sitting among the normal results — even though it isn’t part of the collection.
**Not showing up?** Check the rule’s **Status** is **Enable** and the collection or keyword is listed under **Surfaces**. If it landed somewhere unexpected, a Pin is probably holding that slot — Sledge moved it to the next free one. Storefront changes can take about a minute to sync.
## Related [#related]
* [How to set up pin product?](/guide/merchandising/how-to-set-up-pin)
* [How to set up boost product?](/guide/merchandising/how-to-set-up-boost)
* [How to set position Bundle, Discount & Upsell?](/guide/merchandising/how-to-set-position-bundle-discount-upsell)
* [How to set position Banner?](/guide/merchandising/how-to-set-position-banner)
* [How to set up filter product?](/guide/merchandising/how-to-set-up-filter)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to set up pin product? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-pin)
**Pin** lets you place chosen products in exact positions at the top of a collection or search results — position 1 is the very first card a customer sees. Use it to put your hero products, new drops, or highest-margin items where they get seen first, instead of leaving that to the default sort order.
Pin lives inside a **merchandising rule** (a “Strategy”). One rule is scoped to where it applies, and can carry several actions at once — so you can pin *and* boost *and* hide on the same rule.
**Before you start** — Sledge must be active on your theme, and the collection or search page you want to curate should already be working.
## Create the rule [#create-the-rule]
1. Go to **Tools → Merchandising → Strategy** and click **Add Strategies** (or open an existing rule).
2. Under **Rule settings**, enter a **Rule name** you’ll recognise later (for example, *“Winter boots – prioritize best sellers”*). Choose an **Activation type**: **Always active**, or **Set active date** to schedule a start and end.
3. Under **Surfaces**, choose where the rule applies:
* **Collection Page** — then **All collections**, or **Specific collection** and **Add collections** to pick them.
* **Search Page & Instant Search** — then **All searches**, or **Specific keywords** with a **Match** of *Contains* or *Exact*.
4. You must enable at least one surface — the Strategies section stays greyed out until you do.
## Set up Pin [#set-up-pin]
1. Scroll to **Strategies** and turn on **Pin** — *“Manually place selected products at the top of results on the selected surfaces”*.
2. Each row is one slot: pick a product with **Select product**, and the number beside it is the **position** it will hold. Position 1 = the first card in the grid.
3. Drag the handle on the left to reorder slots, click **Add more pin** for extra slots, or the bin icon to clear one. Three slots always show — you don’t have to fill them all.
4. Click **Save**. Set **Status** to **Enable** on the right so the rule goes live, and check the live **Preview** panel as you work.
**Good to know** — Pin is applied *first*, so it claims its exact slot numbers before any other action. If Boost or Inject product is also on, they fill the gaps your pins left. The same product can’t sit in two slots — Sledge skips the duplicate.
## Result [#result]
**Done.** Your pinned products now hold the exact top slots you chose on that collection or search page, above the normal sort order — for every customer, every visit.
**Not showing up?** Check the rule’s **Status** is **Enable**, that the collection you’re looking at is listed under **Surfaces**, and that the pinned product is actually in that collection. If dates are set, confirm the rule is inside its active window. Storefront changes can take about a minute to sync.
## Related [#related]
* [How to set up boost product?](/guide/merchandising/how-to-set-up-boost)
* [How to set up inject product?](/guide/merchandising/how-to-set-up-inject-product)
* [How to set up demote product?](/guide/merchandising/how-to-set-up-demote)
* [How to set up hide product?](/guide/merchandising/how-to-set-up-hide)
* [How to set up filter product?](/guide/merchandising/how-to-set-up-filter)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to set up pre order bundle? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-pre-order-bundle)
**Pre-order bundle** puts an existing bundle offer on pre-order, so customers can buy the whole set before it’s available. It’s the way to run a launch or restock as a pre-sell without rebuilding the bundle: the bundle you link already supplies the products, the pricing, and where it shows — this campaign only adds the pre-order behaviour on top.
## How it differs from Pre-order [#how-it-differs-from-pre-order]
Both features share the same payment, country, dates, and notes options. The difference is what you point them at:
* **Pre-order** targets **products** you pick, has its own discount %, its own visibility rule (out of stock / in stock / always), and its own **Surfaces**.
* **Pre-order bundle** targets **one bundle**. There’s no discount field (the bundle’s own pricing applies), no visibility rule, and no Surfaces section — placement follows the *linked bundle’s* settings, so the bundle stays the single source of truth.
**Before you start** — You need a bundle already created. Only **Fixed bundle**, **Buy X get Y**, and **Volume discount** can be used; the other types never render where a pre-order bundle needs to appear.
## Create the campaign [#create-the-campaign]
1. Go to **Tools → Merchandising → Pre Order Bundle** and click **Add pre order bundle**. Existing campaigns show which **Bundle** they’re linked to.
2. Under **Pre order campaign**, enter a **Campaign name** (internal only).
3. Under **Bundle & Discounts**, click **Select bundle & discount** and choose **one** bundle. If you have none yet, **Create bundle** lets you build one without leaving the page — pick *Fixed bundle*, *Buy X get Y*, or *Volume discount*, and it’s linked automatically when you save.
4. Use **Country** and **Active dates** to limit where and when it runs.
The red arrows below show these first four settings on a real campaign — the bundle *Fix Blush Rose* is already linked, and the **Preview** on the right updates as you go:
5. Under **Payment**, choose **Full payment** or **Partial payment**. With partial, set **Amount pay now** (the deposit) and a **Due date** for the balance.
6. Under **Notes (cart, checkout, email)**, write the **Pre order note** that follows the order into cart, checkout, and the order email, and set the **Pre order button label** (default *Pre-order*) — this is the text customers click.
7. Check the **Preview**, click **Save**, and set **Status** to **Enable**.
**Good to know** — The preview stays empty until you pick a bundle, because the bundle supplies everything it renders. And since there’s no Surfaces section here, if the bundle isn’t showing somewhere you expect, change that on the *bundle*, not on this campaign.
## Result [#result]
**Done.** The bundle now appears with a pre-order call to action instead of a normal add-to-cart. Below is the live storefront: the linked bundle renders as a **Bundle & Save** panel — *Save 10%*, $207.90 struck through, **$187.11** to pay, with all three products listed — and the red arrow points to the **Pre Order** button your campaign added.
Your **Pre order note** isn’t shown in the panel — it travels with the items into the cart, checkout, and order confirmation email.
**Not showing up?** Check **Status** is **Enable**, a bundle is actually selected, and the bundle itself is active. If it appears without the pre-order button, the campaign is off or outside its **Active dates**. Placement problems are fixed on the linked bundle’s own surface settings. Storefront changes can take about a minute to sync.
## Related [#related]
* [How to set up pre order (single / multiple products)?](/guide/merchandising/how-to-set-up-pre-order-single-multiple-products)
* [How to set up a badge campaign?](/guide/merchandising/how-to-set-up-a-badge-campaign)
* [How to set up Back in Stock?](/guide/merchandising/how-to-set-up-back-in-stock)
* [How to set position Bundle, Discount & Upsell?](/guide/merchandising/how-to-set-position-bundle-discount-upsell)
* [How to Set Up Pre-Order for Fix Bundle?](/guide/bundles/how-to-set-up-pre-order-for-fix-bundle)
* [How to Set Up A/B Testing for Pre-Order (Single & Multiple)?](/guide/merchandising/how-to-set-up-a-b-testing-for-pre-order-single-multiple)
---
# How to set up pre order (single / multiple products)? (https://docs.sledge-app.com/guide/merchandising/how-to-set-up-pre-order-single-multiple-products)
Pre-order lets customers buy selected products before they’re available — typically when stock has run out and a restock is coming. The Add to cart button becomes a pre-order button, optionally with its own discount and payment terms.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Create or edit a pre-order campaign [#create-or-edit-a-pre-order-campaign]
Go to **Sledge → Tools → Merchandising**, open **Pre Order Single / Multiple Products**, and click **Add** (or open an existing campaign — the example is “Pre Order 1” for the Ivory Grace Belted Blouse).
### Campaign, Country, Active dates, and Products [#campaign-country-active-dates-and-products]
Name the campaign, choose the countries and schedule, then use **Add products** to pick the products this pre-order covers — one product or many.
### Discount & visibility, and Payment [#discount--visibility-and-payment]
* **Pre order discount** — a percentage off applied when the product is bought as a pre-order (10% in the example; the preview shows the struck-through price).
* **When show pre order button** — the trigger: **Product is out of stock** (the classic case), **Product is in stock**, or **Always show button**.
* **Payment** — **Full payment** up front, or **Partial payment** to take a deposit now and the rest later.
### Notes and Surfaces [#notes-and-surfaces]
**Pre order note** is a short line shown in cart, checkout, and the confirmation email — set expectations (“ships in 4–6 weeks”). **Pre order button label** is the button text itself (“Pre Order Now”). **Surfaces** control where the button appears: Collection Page, Product Page, Search Page, and Instant Search.
### Status and Preview [#status-and-preview]
The **Preview** renders the product card in pre-order state — discounted price and the pre-order button. **Create A/B** starts an A/B test. Click **Save** to apply.
## Result [#result]
When the trigger condition is met (for example the product sells out), its Add to cart button becomes **Pre Order Now** across the surfaces you enabled, the discount applies at checkout, and your note follows the order into cart, checkout, and email.
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How to Set Up A/B Testing for Pre-Order (Single & Multiple)?](/guide/merchandising/how-to-set-up-a-b-testing-for-pre-order-single-multiple)
* [How to set up pre order bundle?](/guide/merchandising/how-to-set-up-pre-order-bundle)
* [How to set up Back in Stock?](/guide/merchandising/how-to-set-up-back-in-stock)
* [How to set up a badge campaign?](/guide/merchandising/how-to-set-up-a-badge-campaign)
* [How to Set Up Pre-Order for Fix Bundle?](/guide/bundles/how-to-set-up-pre-order-for-fix-bundle)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# Merchandising (https://docs.sledge-app.com/guide/merchandising)
---
# How to Enable Sledge Core and Complete the Initial Setup ? (https://docs.sledge-app.com/guide/onboarding/how-to-enable-sledge-core-and-complete-the-initial-setup-1)
**Sledge Core** is the app embed that connects Sledge to your theme. It’s a single switch in your theme settings, and it’s the one thing every other feature depends on.
Nothing else works until it’s on. Your search, filters, bundles, recommendations, cart drawer, wishlist, and reviews can all be configured perfectly in the admin and still show nothing on the storefront, because Sledge Core is what actually loads them onto your pages. Turn it on once and it stays on.
The quickest way to do it is the setup wizard, which walks you through five steps — switching Sledge Core on, telling Sledge what you sell, reviewing your benchmarks, choosing where Sledge runs, and activating your first tools. This guide follows that wizard from start to finish.
**Before you start** — You need a published theme and permission to edit it. The whole run takes about five minutes, and you can leave at any point with **Remind me later** — the wizard remembers where you stopped.
## Step 1 — Switch on Sledge Core [#step-1--switch-on-sledge-core]
1. Open the Sledge app and go to **Onboarding**. You’ll land on *Welcome to your Growth Engine!* at **Step 0/5**.
2. The first card is **Enable the app embed in Shopify**. Click **Enable in theme**.
3. Shopify opens your theme editor with the **App embeds** panel already filtered to **Sledge Core**, and the toggle already switched on for you.
4. **Click Save in the top-right.** This is the step merchants miss most often — the deep link turns the toggle on, but nothing reaches your storefront until you save the theme.
5. Go back to the Sledge tab. The card now reads **App embed enabled — Sledge is active on your theme**, and the progress bar moves to **Step 1/5**.
**Prefer to do it by hand?** Go to **Online Store → Themes**, click **Customize** on your live theme, open the **App embeds** panel (the apps icon in the left toolbar), find **Sledge Core**, switch it **on**, and click **Save**. Type “Sledge” in the search box to filter the list. Sledge Core has no settings of its own — it only needs to be on.
## Step 2 — Tell Sledge what you sell [#step-2--tell-sledge-what-you-sell]
1. Under **What best describes your store?**, pick the category that fits — **Fashion & Apparel**, **Home & Living**, **Beauty & Skincare**, **Food & Beverage**, **Sports & Outdoor**, **Electronics & Gadgets**, **Automotive**, **Toys & Kids**, or **Other**.
2. This isn’t cosmetic. Your answer decides which benchmarks you’re shown next and which tools the wizard recommends first, so pick the closest match rather than *Other* if one fits.
3. Click **Continue**.
## Step 3 — Review your benchmarks [#step-3--review-your-benchmarks]
1. Sledge shows what stores in your category typically achieve — average order value, conversion rate, and repeat purchase rate. For Fashion & Apparel that’s roughly **$100–$150** AOV, **1.2–2.0%** conversion, and **20–25%** repeat purchases.
2. Below that, **Your biggest opportunities** lists the gaps worth closing first, each tagged **High** or **Medium** priority, with a shortcut button to set it up.
3. Read the **Disclaimer**: these are industry averages from independent research, not Sledge-specific promises. Treat them as a reference point, not a target you’re failing to hit.
4. Click **Continue**.
## Step 4 — Choose where Sledge runs [#step-4--choose-where-sledge-runs]
1. Under **Choose where Sledge runs in your store**, switch on the surfaces you want. Each one explains exactly what it changes:
* **Instant Search** *(Recommended)* — real-time suggestions as customers type. Sledge captures every query, including the ones that return nothing.
* **Search Page** *(Recommended)* — full results with smart ranking and filters, so customers refine instead of bouncing.
* **Collection Page** *(Recommended)* — filtering, smart sorting, and recommendations where most browsing traffic lands.
* **Cart Drawer** *(Recommended)* — slide-in cart with recommendations, free-shipping progress, and upsells before checkout.
* **Wishlist** — customers save products and come back when they’re ready to buy.
2. Leaving all five on is the sensible default — they’re the highest-traffic parts of a store. You can change any of them later.
3. Click **Activate selected surfaces**.
**Note** — the other surfaces (Homepage, Product Page, Checkout, and so on) aren’t in the wizard. You configure those per feature in **Tools** once setup is done.
## Step 5 — Activate your quick wins [#step-5--activate-your-quick-wins]
1. Sledge picks the three tools with the biggest impact for your category and shows what each one would switch on. For Fashion & Apparel that’s **Product Filter**, **Wishlist**, and **Product Recommendations**.
2. Click **Setup automatic** on a card and Sledge configures it with sensible defaults — for Product Filter that’s category filter, price range slider, color swatch, and brand filter, all built from your own catalogue.
3. Do the same on the other two cards. Use **View config** first if you want to see exactly what will be applied, or **See full settings** to open that tool’s full settings page instead.
4. Once a card is set up it changes to **Edit setup** with a **View storefront** link, so you can check the result immediately.
5. Click **Continue** to finish.
## Result [#result]
**Done.** The wizard confirms *Sledge is set up and ready — your store is now connected. Tools are active and Sledge is collecting data from the first customer visit.* From here, **View dashboard** takes you into the app.
On the storefront, the tools you activated are now live. Below, a collection page is running the Sledge filter panel down the left, Sledge search across the top, and wishlist hearts on every product card with a running count in the header.
## Not showing up? [#not-showing-up]
Work through these in order — the first two cause most cases.
* **Did you click Save in the theme editor?** Switching the Sledge Core toggle on isn’t enough on its own. Reopen the theme editor and confirm the toggle is still on.
* **Are you looking at the theme you edited?** If your store has several themes, the embed has to be on in the one that’s **published**. Enabling it on a draft or a duplicate changes nothing for customers.
* **Is the individual feature enabled?** Sledge Core loads the tools; each tool still has its own **Status** switch under **Tools**.
* **Is the surface switched on?** A feature only renders on the surfaces you enabled — check the feature’s **Surfaces** section.
* **Give it a minute.** Storefront changes take about a minute to sync. Reload with a hard refresh before assuming it’s broken.
* **Is your store password-protected?** A locked storefront shows the password page, not your theme — so no Sledge widgets appear. Enter the password first, then check.
## Related [#related]
* [Understanding your Sledge Dashboard: revenue, growth intelligence, and live signals](/guide/onboarding/understanding-your-sledge-dashboard-revenue-growth-intelligence-and-live-signals)
* [Growth Opportunities by Goals: working through the playbook outcome by outcome](/guide/growth-opportunities/growth-opportunities-by-goals-working-through-the-playbook-outcome-by-outcome)
* [Growth Opportunities by Customer Journey: fixing your store stage by stage](/guide/growth-opportunities/growth-opportunities-by-customer-journey-fixing-your-store-stage-by-stage)
* [How do I set up Instant Search?](/guide/search/how-to-set-up-instant-search)
* [How do I set up a filter group?](/guide/filter/how-to-set-up-filter-group)
* [How to set up cart drawer?](/guide/cart-drawer/how-to-set-up-cart-drawer)
---
# Onboarding & Dashboard (https://docs.sledge-app.com/guide/onboarding)
---
# Understanding your Sledge Dashboard: revenue, growth intelligence, and live signals (https://docs.sledge-app.com/guide/onboarding/understanding-your-sledge-dashboard-revenue-growth-intelligence-and-live-signals)
The **Dashboard** is the first screen you see when you open Sledge, and it’s built to answer three questions in the order a merchant actually asks them: *is Sledge making me money?*, *what should I do next?*, and *what are customers doing right now?*
It isn’t a report you need to study. Treat it as a weekly check-in — the numbers tell you whether things are working, and the cards below them tell you where to spend your next half hour.
**Before you start** — Sledge Core must be active on your theme, otherwise there’s nothing to measure and every panel stays empty. Figures here cover Sledge-attributed activity only, so they will always be smaller than your total Shopify numbers.
## Revenue and the headline metrics [#revenue-and-the-headline-metrics]
At the top, **Revenue from Sledge this period** shows what Sledge has earned, the number of orders behind it, and the change against the previous week. If your plan carries a revenue allowance, the bar underneath shows how much of it you’ve used.
Below that, a date selector (for example **Last 7 days**) controls four headline metrics:
* **Revenue** — money from orders Sledge contributed to.
* **Orders** — how many of those orders there were.
* **Conversion rate** — the share of sessions that became orders.
* **Impressions** — how often your Sledge widgets were actually seen.
Read **Impressions** together with **Revenue**. High impressions with low revenue means customers are seeing your widgets but not acting on them — an offer or placement problem. Low impressions means they’re barely being seen at all, which is usually a coverage problem: not enough surfaces switched on.
## Growth Intelligence — what Sledge thinks you should fix [#growth-intelligence--what-sledge-thinks-you-should-fix]
This is the part worth reading properly. Sledge studies your own order data and raises findings written as plain observations about your store, not generic advice.
The counters summarise what it found: how many findings there are, how many are **High** or **Medium** priority, and how many are **unlocked** versus **locked** on your plan. **Daily intelligence** shows the countdown to the next refresh.
Each finding card carries a priority tag, when it was raised, the observation itself, and two actions. Real examples from this store:
* *“62 products have zero sales in the last 90 days”* — out of 72 products, 62 have never sold. The suggested fix is merchandising, to give those products visibility. The card’s button is **Set up merchandising**.
* *“77% of your orders contain only 1 product”* — average order value is $54 against a global average of $145. The button here is **Set up cart drawer**, because that’s where you add a second item to a basket.
The button takes you straight to the feature that addresses it, so the finding and its fix are one click apart. **Ignore** dismisses a finding you’ve considered and decided against — use it, because a tidy list keeps the remaining findings meaningful.
**Go to growth opportunities** opens the full playbook, where these findings sit alongside the complete set of best practices.
## Live signals from your store [#live-signals-from-your-store]
The last panel reports what customers are doing right now — searches, filters, cart activity as they happen.
On a new or quiet store it reads *“Sledge is live and listening”* with a note that signals appear once customers interact with your search, filters, and cart. That message is a healthy state, not an error: it confirms Sledge is connected and waiting for traffic. Signals need real visits before they can show anything, and they need widgets on the surfaces customers actually use — if search and filtering aren’t switched on, there is nothing for Sledge to listen to.
## How to use the Dashboard week to week [#how-to-use-the-dashboard-week-to-week]
1. Check **Revenue** and the trend arrow. Rising is good; flat with high impressions means your offers need work.
2. Read any **High** priority finding under Growth Intelligence and act on one of them.
3. Use the finding’s button rather than hunting for the setting yourself — it lands you in the right place.
4. **Ignore** anything that genuinely doesn’t apply to your store, so the list stays honest.
5. Open **Analytics** when you want the detail behind a number, and **Growth Opportunities** when you want the full checklist rather than the top few findings.
**Everything showing zero?** Check that Sledge Core is enabled on your published theme and that at least one feature is switched on under **Tools** — Sledge can only report on surfaces where it’s actually running. A brand-new store also needs traffic before any panel fills in, and orders can take a few minutes to appear. If findings look thin, that’s expected early on: Growth Intelligence reads your order history, so it gets sharper as orders accumulate.
## Related [#related]
* [How to Enable Sledge Core and Complete the Initial Setup ?](/guide/onboarding/how-to-enable-sledge-core-and-complete-the-initial-setup-1)
* [Growth Opportunities by Goals: working through the playbook outcome by outcome](/guide/growth-opportunities/growth-opportunities-by-goals-working-through-the-playbook-outcome-by-outcome)
* [Growth Opportunities by Customer Journey: fixing your store stage by stage](/guide/growth-opportunities/growth-opportunities-by-customer-journey-fixing-your-store-stage-by-stage)
* [How do I set up Instant Search?](/guide/search/how-to-set-up-instant-search)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How do I set up a filter group?](/guide/filter/how-to-set-up-filter-group)
---
# How to Set Up A/B Testing for Banner? (https://docs.sledge-app.com/guide/promotion/how-to-set-up-a-b-testing-for-banner)
**A/B testing** lets you run two versions of the same Promotion Banner at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Promotion Banner the things worth testing are the artwork, the headline, or where the banner sits in the grid.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Promotion → Banner** and click into the record you want to test (the example here is *Banner Cozy Knitwear*). Click **Create A/B** in the **Preview** toolbar.
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s a collection page where the banner runs inline with the products:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Promotion Banner from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* [How to set up a promotion Banner?](/guide/promotion/how-to-set-up-a-promotion-banner)
* [How to Set Up A/B Testing for Global Countdown?](/guide/promotion/how-to-set-up-a-b-testing-for-global-countdown)
* [How to Set Up A/B Testing for Product Countdown?](/guide/promotion/how-to-set-up-a-b-testing-for-product-countdown)
* [How to set up Global Countdown?](/guide/promotion/how-to-set-up-global-countdown)
* [How to set up Product Countdown?](/guide/promotion/how-to-set-up-product-countdown)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up A/B Testing for Global Countdown? (https://docs.sledge-app.com/guide/promotion/how-to-set-up-a-b-testing-for-global-countdown)
**A/B testing** lets you run two versions of the same Global Countdown at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Global Countdown the things worth testing are the headline, the urgency wording, or how long the clock runs.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Promotion → Global Countdown**. On the list, find the row you want to test and click **Create A/B** on that row.
Sledge opens the record with the variants already armed. (For Global Countdown this is the only route — opening the record first and looking for the button there won’t start a test.)
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s the countdown bar above your theme header:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Global Countdown from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* [How to set up Global Countdown?](/guide/promotion/how-to-set-up-global-countdown)
* [How to Set Up A/B Testing for Banner?](/guide/promotion/how-to-set-up-a-b-testing-for-banner)
* [How to Set Up A/B Testing for Product Countdown?](/guide/promotion/how-to-set-up-a-b-testing-for-product-countdown)
* [How to set up Product Countdown?](/guide/promotion/how-to-set-up-product-countdown)
* [How to set up a promotion Banner?](/guide/promotion/how-to-set-up-a-promotion-banner)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to Set Up A/B Testing for Product Countdown? (https://docs.sledge-app.com/guide/promotion/how-to-set-up-a-b-testing-for-product-countdown)
**A/B testing** lets you run two versions of the same Product Countdown at once and split live traffic between them, so the winner is decided by what customers actually do rather than by opinion.
Sledge copies your current setup into two variants, **A** and **B**. A is an exact clone of what you have now, so it acts as your control; you change B and let real visitors settle it. For Product Countdown the things worth testing are the timer wording, its placement on the product page, or the length of the window.
**Before you start** — Have the record set up and working the way you want it first. A/B is for comparing a change against a known baseline, so there needs to be a baseline. Give the test enough traffic to mean something before you call it — a handful of visitors is noise, not a result.
## Step 1 — Create the test [#step-1--create-the-test]
1. Open **Promotion → Product Countdown**. On the list, find the row you want to test and click **Create A/B** on that row.
Sledge opens the record with the variants already armed. (For Product Countdown this is the only route — opening the record first and looking for the button there won’t start a test.)
2. The **Preview** panel splits into variant tabs **A** and **B**, and three controls appear next to them: **+** adds another variant (up to D), the **%** sets how traffic is divided, and the bin icon deletes a variant.
3. Click the **B** tab and make the one change you want to test. Change *one* thing — if B differs in three ways you won’t know which one moved the numbers.
4. Nothing exists yet at this point. The button now reads **Cancel A/B**, and clicking it throws the whole setup away and returns the record to normal. Use it if you change your mind before starting.
5. Click **Save**. That’s what actually starts the test.
## Step 2 — While the test runs [#step-2--while-the-test-runs]
1. Once it’s live the button changes to **Stop A/B**. That switch from *Cancel* to *Stop* is the reliable sign the test is really running.
2. Customers now get A or B according to your traffic split, and Sledge records visitors, clicks, and revenue against each one. Switch between the tabs any time to see how each variant is configured.
3. Leave it alone while it gathers data. Editing a variant mid-test changes what you’re measuring.
Customers see one variant or the other — here’s the countdown on the product page it targets:
## Step 3 — Pick the winner [#step-3--pick-the-winner]
1. When you have enough data, click **Stop A/B**. Sledge opens the **Stop A/B test** window with a row per variant showing **Visitors**, **CTR**, **Clicks**, **Extra rev.** and **Total rev.**
2. Compare the rows and click **Choose** on the variant that performed best. If the numbers are close, keep the test running rather than picking on noise.
3. Sledge asks you to confirm, and tells you plainly what happens: the other variants are deleted and 100% of traffic goes to the winner.
4. Click **Choose winner**.
**What “winner” actually does** — it copies that variant’s configuration onto your live record and archives the test. Choosing **B** means B’s settings become your Product Countdown from then on. Choosing **A** puts you back exactly where you started, which is the right call when the change didn’t help.
## Result [#result]
**Done.** The winning setup is now live for everyone, the test moves to the archive, and the button returns to **Create A/B** — ready for the next thing you want to try.
## Cancel, Stop, and winner — the difference [#cancel-stop-and-winner--the-difference]
* **Cancel A/B** — only before you save. Discards the variants; nothing was ever live, and no data is recorded.
* **Stop A/B** — ends a running test. It doesn’t decide anything on its own; it opens the window where you pick the winner.
* **Choose winner** — applies that variant to the live record, deletes the others, and archives the test. This is the step that changes your storefront.
## Not showing up? [#not-showing-up]
If **Create A/B** does nothing, check the record is saved and has no validation errors. If you can’t complete **Choose winner**, look for an **Unsaved changes** bar at the top — discard or save those first, then reopen **Stop A/B**. If both variants read zero after a while, the record may be disabled or outside its active dates, so no customer is being served either version. Storefront changes take about a minute to sync.
## Related [#related]
* [How to set up Product Countdown?](/guide/promotion/how-to-set-up-product-countdown)
* [How to Set Up A/B Testing for Banner?](/guide/promotion/how-to-set-up-a-b-testing-for-banner)
* [How to Set Up A/B Testing for Global Countdown?](/guide/promotion/how-to-set-up-a-b-testing-for-global-countdown)
* [How to set up Global Countdown?](/guide/promotion/how-to-set-up-global-countdown)
* [How to set up a promotion Banner?](/guide/promotion/how-to-set-up-a-promotion-banner)
* [How to Set Up A/B Testing for Merchandising Strategy?](/guide/merchandising/how-to-set-up-a-b-testing-for-merchandising-strategy)
---
# How to set up a promotion Banner? (https://docs.sledge-app.com/guide/promotion/how-to-set-up-a-promotion-banner)
A promotion banner is an image tile you place across your store — in collection grids, search results, instant search, or the cart drawer — to push a campaign, a collection, or an announcement. Customers click it and land wherever you point it.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Create or edit a banner [#create-or-edit-a-banner]
Go to **Sledge → Tools → Promotion**, open **Banner**, and click **Add banner** (or click an existing banner to edit it — the example below is the store’s “Banner Cozy Knitwear”).
### Banner title, content & behavior [#banner-title-content--behavior]
* **Banner title** — an internal name so you can identify the banner in your dashboard; customers don’t see it.
* **Add title / Add description / Add button** — optional text and a call-to-action button overlaid on the banner image. Leave them unticked for a purely visual banner.
* **Redirect URL** — where customers go when they click the banner (a collection, a page, a product…). Optional — with no URL the banner is not clickable.
* **Open in New Tab** — open the destination in a new browser tab instead of replacing the current page.
### Upload image [#upload-image]
One banner can carry up to three image versions, each used where its shape fits best: **Vertical (9:16)** for tiles inside product grids, **Horizontal (16:9)** for wide placements, and **Cart Drawer (21:9)** for the drawer. JPG or PNG up to 12 MB; the **Crop** link lets you adjust the framing after upload.
### Country and Active dates [#country-and-active-dates]
**Country** limits the banner to specific countries, or all. **Active dates** controls scheduling — **Right now** runs it immediately, **Scheduled to start later** lets you set start (and end) times, useful for campaigns prepared in advance.
### Surfaces [#surfaces]
Each surface has its own switch and placement controls. On **Collection Page** you choose the **Collection targeting** (all collections or specific ones — the example targets *Timeless Outerwear*) and the **Position**: **At top**, **At bottom**, **First item**, or **Last item (page 1)** — the item positions place the banner as a tile inside the product grid itself. **Search Page** and **Instant Search** add a keyword list so the banner only shows for matching searches, and **Cart Drawer** uses the 21:9 image. A **Custom** layout option lets you set an exact grid position.
### Status and Preview [#status-and-preview]
**Status** (Enable / Disable / Draft / Archive) controls whether the banner is live. The **Preview** panel renders the target surface with your banner in place, with mobile and desktop toggles — and **Create A/B** starts an A/B test of this banner (covered in its own guide). Click **Save** in the save bar to apply changes.
## Result [#result]
On the storefront, the banner appears as a tile inside the targeted collection’s grid — here the “Fall Essentials” banner sits among the products of Timeless Outerwear, linking to the knitwear collection:
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How to set up Global Countdown?](/guide/promotion/how-to-set-up-global-countdown)
* [How to set up Product Countdown?](/guide/promotion/how-to-set-up-product-countdown)
* [How to Set Up A/B Testing for Banner?](/guide/promotion/how-to-set-up-a-b-testing-for-banner)
* [How to Set Up A/B Testing for Global Countdown?](/guide/promotion/how-to-set-up-a-b-testing-for-global-countdown)
* [How to Set Up A/B Testing for Product Countdown?](/guide/promotion/how-to-set-up-a-b-testing-for-product-countdown)
* [How to set position Banner?](/guide/merchandising/how-to-set-position-banner)
---
# How to set up Global Countdown? (https://docs.sledge-app.com/guide/promotion/how-to-set-up-global-countdown)
The Global Countdown is a slim countdown bar shown across your storefront — “Black Friday Sale! Sale ends in 16:39:22” — building urgency for a store-wide campaign. It runs everywhere Sledge is active, independent of any single product.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Create or edit a global countdown [#create-or-edit-a-global-countdown]
Go to **Sledge → Tools → Promotion**, open **Global Countdown**, and click **Add** (or open an existing one — the example is the store’s “Demo store” countdown).
### Name, content & behavior [#name-content--behavior]
* **Countdown name** — internal only, for your dashboard.
* **Title / Subtitle** — the text customers see on the bar (“Black Friday Sale!” / “Sale ends in:”). The timer renders after the subtitle.
* **Call to action** — what clicking does: **Make entire bar clickable** (with a **Link** destination), a separate button, or no action at all.
* **Close icon** — tick to let customers dismiss the bar.
### Country and Active dates [#country-and-active-dates]
**Country** limits who sees the bar; **Active dates** starts it right now or on a schedule.
### Countdown timer [#countdown-timer]
The heart of the feature — **Timer type**:
* **Countdown to date** — everyone counts down to one fixed end date, e.g. the real end of your sale.
* **Fixed minutes** — each visitor gets their own timer of N minutes from when they arrive (the example runs 1000 minutes). Classic urgency mechanic.
* **Daily recurring timer** — restarts every day, e.g. “order before midnight”.
### Surfaces [#surfaces]
One switch — **Global** — because this bar renders store-wide at the top of the page.
### Design [#design]
Typography (size, weight, transform) for title and subtitle, and colours for every part of the bar: title, subtitle, the countdown numbers, the number cards, card background and border.
### Status and Preview [#status-and-preview]
**Status** makes it live; the **Preview** shows the bar exactly as the library renders it, timer ticking. **Create A/B** starts an A/B test. Click **Save** to apply.
## Result [#result]
Customers see the countdown bar pinned across the top of your storefront until the timer runs out (with Fixed minutes, each visitor’s timer is their own — so it eventually disappears for returning visitors whose timer has expired).
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How to set up Product Countdown?](/guide/promotion/how-to-set-up-product-countdown)
* [How to set up a promotion Banner?](/guide/promotion/how-to-set-up-a-promotion-banner)
* [How to Set Up A/B Testing for Global Countdown?](/guide/promotion/how-to-set-up-a-b-testing-for-global-countdown)
* [How to Set Up A/B Testing for Product Countdown?](/guide/promotion/how-to-set-up-a-b-testing-for-product-countdown)
* [How to Set Up A/B Testing for Banner?](/guide/promotion/how-to-set-up-a-b-testing-for-banner)
* [How to set up cart drawer?](/guide/cart-drawer/how-to-set-up-cart-drawer)
---
# How to set up Product Countdown? (https://docs.sledge-app.com/guide/promotion/how-to-set-up-product-countdown)
A Product Countdown is a timer shown on specific product pages — “Limited offer, Hurry up!” — creating urgency for exactly the products you choose, unlike the store-wide Global Countdown.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Create or edit a product countdown [#create-or-edit-a-product-countdown]
Go to **Sledge → Tools → Promotion**, open **Product Countdown**, and click **Add** (or open an existing one — the example targets the Butter Yellow Textured Polo Shirt).
### Name and Product eligibility [#name-and-product-eligibility]
**Countdown name** is internal. **Product eligibility** decides which product pages carry the timer:
* **All products** — every product page.
* **Specific products** — only the products you pick with **Add products** (the example).
* **Products in specific collections** — everything inside chosen collections.
* **Exclude products / Exclude collections** — everything except your exclusions.
### Countdown content [#countdown-content]
**Title** and **Subtitle** are the timer’s text (“Limited offer” / “Hurry up!”); **Call to action** can make the timer clickable, add a button, or stay passive (**No call to action**).
### Country, Active dates, and the timer [#country-active-dates-and-the-timer]
### Surfaces [#surfaces]
The countdown renders on the **Product Page** of eligible products. The “current placement looks correct” checkbox confirms where the widget sits in your theme’s product page layout.
### Status and Preview [#status-and-preview]
**Status** + live **Preview** of the timer, and **Create A/B** for testing variants. Click **Save** to apply.
## Result [#result]
Eligible product pages show the countdown near the product details. Note that a product page can also carry the Global Countdown bar at the top of the page — they are independent widgets.
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How to set up Global Countdown?](/guide/promotion/how-to-set-up-global-countdown)
* [How to set up a promotion Banner?](/guide/promotion/how-to-set-up-a-promotion-banner)
* [How to Set Up A/B Testing for Product Countdown?](/guide/promotion/how-to-set-up-a-b-testing-for-product-countdown)
* [How to Set Up A/B Testing for Global Countdown?](/guide/promotion/how-to-set-up-a-b-testing-for-global-countdown)
* [How to Set Up A/B Testing for Banner?](/guide/promotion/how-to-set-up-a-b-testing-for-banner)
* [How to set up cart drawer?](/guide/cart-drawer/how-to-set-up-cart-drawer)
---
# Promotions (https://docs.sledge-app.com/guide/promotion)
---
# Recommendations (https://docs.sledge-app.com/guide/recommendations)
---
# How do I set up Best Seller recommendations? (https://docs.sledge-app.com/guide/recommendations/set-up-best-seller-recommendations)
The Best Seller strategy recommends your store’s top-selling products, computed from your real sales data — a self-updating “what everyone’s buying” block you can place on any surface.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Open the campaign [#open-the-campaign]
Go to **Sledge → Tools → Product Recommendation** and click **Add**, then pick the **Best Seller** strategy — or open an existing campaign of this strategy from the list. All recommendation strategies share the same campaign form; the sections below walk through it with this strategy’s specifics.
### Campaign name and Discount [#campaign-name-and-discount]
**Campaign name** is internal — customers never see it. The **Discount** card can attach an offer to the recommended products: pick the discount type and value, and optionally show the compare-at price so the saving is visible on the card.
### Strategy Structure [#strategy-structure]
* **Select display** — **Single** shows one recommendation block; **Multiple** lets you stack several strategies in one placement.
* **Strategy** — set to **Best Seller**; this is the logic that picks the products.
* **Title** — the heading customers see above the block (“Best Seller”). The **\** toggle accepts dynamic values, and **Add description** puts an optional line under it.
* **Suggestion source** — **Display best selling product based on your store data** keeps the list automatic, or **Add products manually** pins your own selection.
### Layout [#layout]
How the block renders on your storefront: **Slider** (a horizontal carousel) or **Grid**. **Total products** caps how many products the block shows in total, and **Products per slide** sets how many are visible at once in the slider.
### Surfaces [#surfaces]
Each surface has its own switch: **Homepage**, **404 / Not Found Page**, **Collection Page**, **Product Page**, **Search Page**, **Instant Search**, **Cart Page**, and **Cart Drawer**. Surfaces with placement options expand when enabled — Collection and Search pages let you choose **At top** or **At bottom**, Collection Page adds collection targeting, and Search Page can be limited to specific keywords.
### Design, Status, and Preview [#design-status-and-preview]
**Design** styles the block heading — font size, alignment, transform, and colours for title and description. **Status** (Enable/Disable) controls whether the campaign is live, and the **Preview** panel renders the block with your real store data. Click **Save** in the save bar to apply.
## Result [#result]
Everywhere the campaign is enabled, customers see a “Best Seller” block filled with your genuine top sellers — the preview below is the live render with this store’s data:
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How do I set up Trending recommendations?](/guide/recommendations/set-up-trending-recommendations)
* [How do I set up Collection Best Seller?](/guide/recommendations/set-up-collection-best-seller)
* [How do I set up Merchant's Picks?](/guide/recommendations/set-up-merchants-picks)
* [How do I set up Product by Collection?](/guide/recommendations/set-up-product-by-collection)
* [How do I set up Personalized Picks?](/guide/recommendations/set-up-personalized-picks)
* [How do I set up Shop the Last?](/guide/recommendations/set-up-shop-the-last)
---
# How do I set up Collection Best Seller? (https://docs.sledge-app.com/guide/recommendations/set-up-collection-best-seller)
Collection Best Seller is different from every other strategy: it recommends collections, not products. Customers see collection cards — image and name — and click through to browse, making it a navigation booster for your homepage or 404 page.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Open the campaign [#open-the-campaign]
Go to **Sledge → Tools → Product Recommendation** and click **Add**, then pick the **Collection Best Seller** strategy — or open an existing campaign of this strategy from the list. All recommendation strategies share the same campaign form; the sections below walk through it with this strategy’s specifics.
### Campaign name and Discount [#campaign-name-and-discount]
**Campaign name** is internal — customers never see it. The **Discount** card can attach an offer to the recommended products: pick the discount type and value, and optionally show the compare-at price so the saving is visible on the card.
### Strategy Structure [#strategy-structure]
* **Select display** — Single block or Multiple stacked strategies.
* **Strategy / Title** — set to **Collection Best Seller**.
* **Suggestion source** — automatic best-selling collections from store data, or **Add collection manually** (the example curates six collections by hand). Note there is no Discount card for this strategy — collections can’t carry a discount.
Because the block shows collections, the Layout card counts collections too — **Total collections** and **Collections per slide**:
### Layout [#layout]
How the block renders on your storefront: **Slider** (a horizontal carousel) or **Grid**. **Total products** caps how many products the block shows in total, and **Products per slide** sets how many are visible at once in the slider.
### Surfaces [#surfaces]
Each surface has its own switch: **Homepage**, **404 / Not Found Page**, **Collection Page**, **Product Page**, **Search Page**, **Instant Search**, **Cart Page**, and **Cart Drawer**. Surfaces with placement options expand when enabled — Collection and Search pages let you choose **At top** or **At bottom**, Collection Page adds collection targeting, and Search Page can be limited to specific keywords.
### Design, Status, and Preview [#design-status-and-preview]
**Design** styles the block heading — font size, alignment, transform, and colours for title and description. **Status** (Enable/Disable) controls whether the campaign is live, and the **Preview** panel renders the block with your real store data. Click **Save** in the save bar to apply.
## Result [#result]
Customers see a row of collection cards under your heading; clicking one opens that collection. The preview shows the live render with the curated collections:
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How do I set up Product by Collection?](/guide/recommendations/set-up-product-by-collection)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How do I set up Trending recommendations?](/guide/recommendations/set-up-trending-recommendations)
* [How do I set up Merchant's Picks?](/guide/recommendations/set-up-merchants-picks)
* [How do I set up Personalized Picks?](/guide/recommendations/set-up-personalized-picks)
* [How do I set up Shop the Last?](/guide/recommendations/set-up-shop-the-last)
---
# How do I set up Merchant's Picks? (https://docs.sledge-app.com/guide/recommendations/set-up-merchants-picks)
Merchant’s Picks is your hand-curated selection — “our favourites”, a seasonal edit, a lookbook. You choose every product; nothing is automatic, which is exactly its point.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Open the campaign [#open-the-campaign]
Go to **Sledge → Tools → Product Recommendation** and click **Add**, then pick the **Merchant's Picks** strategy — or open an existing campaign of this strategy from the list. All recommendation strategies share the same campaign form; the sections below walk through it with this strategy’s specifics.
### Campaign name and Discount [#campaign-name-and-discount]
**Campaign name** is internal — customers never see it. The **Discount** card can attach an offer to the recommended products: pick the discount type and value, and optionally show the compare-at price so the saving is visible on the card. The example campaign runs a 10% discount:
### Strategy Structure [#strategy-structure]
* **Select display** — Single block or Multiple stacked strategies.
* **Strategy / Title** — set to **Merchant’s Picks**.
* **Suggestion source** — this strategy is manual by design: the automatic option is greyed out, and **Add products manually** is where you build the list (the example picks six tees).
### Layout [#layout]
How the block renders on your storefront: **Slider** (a horizontal carousel) or **Grid**. **Total products** caps how many products the block shows in total, and **Products per slide** sets how many are visible at once in the slider.
### Surfaces [#surfaces]
Each surface has its own switch: **Homepage**, **404 / Not Found Page**, **Collection Page**, **Product Page**, **Search Page**, **Instant Search**, **Cart Page**, and **Cart Drawer**. Surfaces with placement options expand when enabled — Collection and Search pages let you choose **At top** or **At bottom**, Collection Page adds collection targeting, and Search Page can be limited to specific keywords.
### Design, Status, and Preview [#design-status-and-preview]
**Design** styles the block heading — font size, alignment, transform, and colours for title and description. **Status** (Enable/Disable) controls whether the campaign is live, and the **Preview** panel renders the block with your real store data. Click **Save** in the save bar to apply.
## Result [#result]
Customers see your hand-picked products under your heading — here with the 10% discount applied, so every card shows the reduced price against the compare-at price:
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How do I set up Trending recommendations?](/guide/recommendations/set-up-trending-recommendations)
* [How do I set up Product by Collection?](/guide/recommendations/set-up-product-by-collection)
* [How do I set up Collection Best Seller?](/guide/recommendations/set-up-collection-best-seller)
* [How do I set up Shop the Last?](/guide/recommendations/set-up-shop-the-last)
* [How do I set up Personalized Picks?](/guide/recommendations/set-up-personalized-picks)
---
# How do I set up Personalized Picks? (https://docs.sledge-app.com/guide/recommendations/set-up-personalized-picks)
Personalized Picks recommends different products to each customer, based on their own behavior — what they’ve viewed, added to cart, and bought. Two visitors see two different blocks.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Open the campaign [#open-the-campaign]
Go to **Sledge → Tools → Product Recommendation** and click **Add**, then pick the **Personalized Picks** strategy — or open an existing campaign of this strategy from the list. All recommendation strategies share the same campaign form; the sections below walk through it with this strategy’s specifics.
### Campaign name and Discount [#campaign-name-and-discount]
**Campaign name** is internal — customers never see it. The **Discount** card can attach an offer to the recommended products: pick the discount type and value, and optionally show the compare-at price so the saving is visible on the card.
### Strategy Structure [#strategy-structure]
* **Select display** — Single block or Multiple stacked strategies.
* **Strategy / Title** — set to **Personalized Picks**.
* **Suggestion source** — fully automatic: **Display personalized picks based on your store data** is the only choice (manual is greyed out), because the whole strategy is per-customer.
The example campaign renders on collection pages — its Collection Page surface is on, with a position (**At bottom** / **At top**) and collection targeting:
### Layout [#layout]
How the block renders on your storefront: **Slider** (a horizontal carousel) or **Grid**. **Total products** caps how many products the block shows in total, and **Products per slide** sets how many are visible at once in the slider.
### Surfaces [#surfaces]
Each surface has its own switch: **Homepage**, **404 / Not Found Page**, **Collection Page**, **Product Page**, **Search Page**, **Instant Search**, **Cart Page**, and **Cart Drawer**. Surfaces with placement options expand when enabled — Collection and Search pages let you choose **At top** or **At bottom**, Collection Page adds collection targeting, and Search Page can be limited to specific keywords.
### Design, Status, and Preview [#design-status-and-preview]
**Design** styles the block heading — font size, alignment, transform, and colours for title and description. **Status** (Enable/Disable) controls whether the campaign is live, and the **Preview** panel renders the block with your real store data. Click **Save** in the save bar to apply.
## Result [#result]
Each customer sees recommendations shaped by their own history; new visitors with no history yet see a sensible default. The preview shows the block rendered at the bottom of a collection page:
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How do I set up Recently Viewed?](/guide/recommendations/set-up-recently-viewed)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How do I set up Trending recommendations?](/guide/recommendations/set-up-trending-recommendations)
* [How do I set up Shop the Last?](/guide/recommendations/set-up-shop-the-last)
* [How do I set up Merchant's Picks?](/guide/recommendations/set-up-merchants-picks)
* [How do I set up Product by Collection?](/guide/recommendations/set-up-product-by-collection)
---
# How do I set up Product by Collection? (https://docs.sledge-app.com/guide/recommendations/set-up-product-by-collection)
Product by Collection recommends products drawn from collections you choose — “from our Outerwear range” — unlike Collection Best Seller, which shows the collections themselves.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Open the campaign [#open-the-campaign]
Go to **Sledge → Tools → Product Recommendation** and click **Add**, then pick the **Product by Collection** strategy — or open an existing campaign of this strategy from the list. All recommendation strategies share the same campaign form; the sections below walk through it with this strategy’s specifics.
### Campaign name and Discount [#campaign-name-and-discount]
**Campaign name** is internal — customers never see it. The **Discount** card can attach an offer to the recommended products: pick the discount type and value, and optionally show the compare-at price so the saving is visible on the card.
### Strategy Structure [#strategy-structure]
* **Select display** — Single block or Multiple stacked strategies.
* **Strategy / Title** — set to **Product by Collection**.
* **Suggestion source** — **Display best selling products from this collection** picks automatically from your chosen collections, or **Add collection manually** to select the source collections yourself (the example uses seven).
### Layout [#layout]
How the block renders on your storefront: **Slider** (a horizontal carousel) or **Grid**. **Total products** caps how many products the block shows in total, and **Products per slide** sets how many are visible at once in the slider.
### Surfaces [#surfaces]
Each surface has its own switch: **Homepage**, **404 / Not Found Page**, **Collection Page**, **Product Page**, **Search Page**, **Instant Search**, **Cart Page**, and **Cart Drawer**. Surfaces with placement options expand when enabled — Collection and Search pages let you choose **At top** or **At bottom**, Collection Page adds collection targeting, and Search Page can be limited to specific keywords.
### Design, Status, and Preview [#design-status-and-preview]
**Design** styles the block heading — font size, alignment, transform, and colours for title and description. **Status** (Enable/Disable) controls whether the campaign is live, and the **Preview** panel renders the block with your real store data. Click **Save** in the save bar to apply.
## Result [#result]
The block fills with products pulled from the chosen collections. The preview shows the live render on the 404 surface:
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How do I set up Collection Best Seller?](/guide/recommendations/set-up-collection-best-seller)
* [How do I set up Merchant's Picks?](/guide/recommendations/set-up-merchants-picks)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How do I set up Trending recommendations?](/guide/recommendations/set-up-trending-recommendations)
* [How do I set up Recently Viewed?](/guide/recommendations/set-up-recently-viewed)
* [How do I set up Shop the Last?](/guide/recommendations/set-up-shop-the-last)
---
# How do I set up Recently Viewed? (https://docs.sledge-app.com/guide/recommendations/set-up-recently-viewed)
Recently Viewed shows each customer the products they themselves looked at — a personal breadcrumb trail that makes it easy to return to something they almost bought.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Open the campaign [#open-the-campaign]
Go to **Sledge → Tools → Product Recommendation** and click **Add**, then pick the **Recently Viewed** strategy — or open an existing campaign of this strategy from the list. All recommendation strategies share the same campaign form; the sections below walk through it with this strategy’s specifics.
### Campaign name and Discount [#campaign-name-and-discount]
**Campaign name** is internal — customers never see it. The **Discount** card can attach an offer to the recommended products: pick the discount type and value, and optionally show the compare-at price so the saving is visible on the card.
### Strategy Structure [#strategy-structure]
* **Select display** — Single block or Multiple stacked strategies.
* **Strategy / Title** — set to **Recently Viewed**.
* **Suggestion source** — automatic only (manual is greyed out): the list is the customer’s own browsing history, newest first.
### Layout [#layout]
How the block renders on your storefront: **Slider** (a horizontal carousel) or **Grid**. **Total products** caps how many products the block shows in total, and **Products per slide** sets how many are visible at once in the slider.
### Surfaces [#surfaces]
Each surface has its own switch: **Homepage**, **404 / Not Found Page**, **Collection Page**, **Product Page**, **Search Page**, **Instant Search**, **Cart Page**, and **Cart Drawer**. Surfaces with placement options expand when enabled — Collection and Search pages let you choose **At top** or **At bottom**, Collection Page adds collection targeting, and Search Page can be limited to specific keywords.
### Design, Status, and Preview [#design-status-and-preview]
**Design** styles the block heading — font size, alignment, transform, and colours for title and description. **Status** (Enable/Disable) controls whether the campaign is live, and the **Preview** panel renders the block with your real store data. Click **Save** in the save bar to apply.
## Result [#result]
Once a customer has browsed a few product pages, the block fills with those products (a brand-new visitor sees nothing until they’ve viewed something). The preview shows the live render:
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How do I set up Personalized Picks?](/guide/recommendations/set-up-personalized-picks)
* [How do I set up Shop the Last?](/guide/recommendations/set-up-shop-the-last)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How do I set up Trending recommendations?](/guide/recommendations/set-up-trending-recommendations)
* [How do I set up Product by Collection?](/guide/recommendations/set-up-product-by-collection)
* [How do I set up Merchant's Picks?](/guide/recommendations/set-up-merchants-picks)
---
# How do I set up Shop the Last? (https://docs.sledge-app.com/guide/recommendations/set-up-shop-the-last)
Shop the Last surfaces the last items in stock — products about to sell out — turning scarcity into a reason to buy now.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Open the campaign [#open-the-campaign]
Go to **Sledge → Tools → Product Recommendation** and click **Add**, then pick the **Shop the Last** strategy — or open an existing campaign of this strategy from the list. All recommendation strategies share the same campaign form; the sections below walk through it with this strategy’s specifics.
### Campaign name and Discount [#campaign-name-and-discount]
**Campaign name** is internal — customers never see it. The **Discount** card can attach an offer to the recommended products: pick the discount type and value, and optionally show the compare-at price so the saving is visible on the card.
### Strategy Structure [#strategy-structure]
* **Select display** — Single block or Multiple stacked strategies.
* **Strategy / Title** — set to **Shop the Last**.
* **Suggestion source** — **Display last items in stock based on your store data** keeps it automatic, or **Add products manually** to curate (the example pins six ivory pieces).
The example campaign runs on the **Search Page** restricted to **Specific keywords** — a keyword rule (**Contains “Drip”**) means the block only renders when a customer’s search matches; **Add keyword** stacks more rules:
### Layout [#layout]
How the block renders on your storefront: **Slider** (a horizontal carousel) or **Grid**. **Total products** caps how many products the block shows in total, and **Products per slide** sets how many are visible at once in the slider.
### Surfaces [#surfaces]
Each surface has its own switch: **Homepage**, **404 / Not Found Page**, **Collection Page**, **Product Page**, **Search Page**, **Instant Search**, **Cart Page**, and **Cart Drawer**. Surfaces with placement options expand when enabled — Collection and Search pages let you choose **At top** or **At bottom**, Collection Page adds collection targeting, and Search Page can be limited to specific keywords.
### Design, Status, and Preview [#design-status-and-preview]
**Design** styles the block heading — font size, alignment, transform, and colours for title and description. **Status** (Enable/Disable) controls whether the campaign is live, and the **Preview** panel renders the block with your real store data. Click **Save** in the save bar to apply.
## Result [#result]
When a search matches the keyword rule, the results page shows the “Shop the Last” block under the products. The preview renders that exact state:
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How do I set up Recently Viewed?](/guide/recommendations/set-up-recently-viewed)
* [How do I set up Personalized Picks?](/guide/recommendations/set-up-personalized-picks)
* [How do I set up Trending recommendations?](/guide/recommendations/set-up-trending-recommendations)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How do I set up Merchant's Picks?](/guide/recommendations/set-up-merchants-picks)
* [How do I set up Product by Collection?](/guide/recommendations/set-up-product-by-collection)
---
# How do I set up Trending recommendations? (https://docs.sledge-app.com/guide/recommendations/set-up-trending-recommendations)
The Trending strategy highlights products that are getting attention right now — recent views, carts, and sales — so the block follows what’s hot this week rather than all-time favourites.
## Before you start [#before-you-start]
**Sledge Core must be enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**. Which pages actually show this feature is controlled by its own **Surfaces** section, explained below.
## Open the campaign [#open-the-campaign]
Go to **Sledge → Tools → Product Recommendation** and click **Add**, then pick the **Trending** strategy — or open an existing campaign of this strategy from the list. All recommendation strategies share the same campaign form; the sections below walk through it with this strategy’s specifics.
### Campaign name and Discount [#campaign-name-and-discount]
**Campaign name** is internal — customers never see it. The **Discount** card can attach an offer to the recommended products: pick the discount type and value, and optionally show the compare-at price so the saving is visible on the card.
### Strategy Structure [#strategy-structure]
* **Select display** — Single block or Multiple stacked strategies.
* **Strategy / Title** — set to **Trending**, with the heading customers see.
* **Suggestion source** — automatic trending from your store data, or **Add products manually** to curate the list yourself. The example campaign (“Trending 404”) is curated by hand with the store’s coat collection — manual mode shows the product list under the button.
### Layout [#layout]
How the block renders on your storefront: **Slider** (a horizontal carousel) or **Grid**. **Total products** caps how many products the block shows in total, and **Products per slide** sets how many are visible at once in the slider.
### Surfaces [#surfaces]
Each surface has its own switch: **Homepage**, **404 / Not Found Page**, **Collection Page**, **Product Page**, **Search Page**, **Instant Search**, **Cart Page**, and **Cart Drawer**. Surfaces with placement options expand when enabled — Collection and Search pages let you choose **At top** or **At bottom**, Collection Page adds collection targeting, and Search Page can be limited to specific keywords.
### Design, Status, and Preview [#design-status-and-preview]
**Design** styles the block heading — font size, alignment, transform, and colours for title and description. **Status** (Enable/Disable) controls whether the campaign is live, and the **Preview** panel renders the block with your real store data. Click **Save** in the save bar to apply.
## Result [#result]
The example campaign renders on the 404 page — turning a dead end into a shopping opportunity — and on search results. The preview shows the live render:
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the campaign’s **Status** is Enable, the surface you expect is switched on in **Surfaces**, and Sledge Core is enabled as described above.
## Related [#related]
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How do I set up Merchant's Picks?](/guide/recommendations/set-up-merchants-picks)
* [How do I set up Shop the Last?](/guide/recommendations/set-up-shop-the-last)
* [How do I set up Personalized Picks?](/guide/recommendations/set-up-personalized-picks)
* [How do I set up Collection Best Seller?](/guide/recommendations/set-up-collection-best-seller)
* [How do I set up Product by Collection?](/guide/recommendations/set-up-product-by-collection)
---
# How do I configure review Display Settings? (https://docs.sledge-app.com/guide/reviews/configure-review-display-settings)
Display Settings shapes how review content looks everywhere it appears — how the review list sorts and paginates, and what details each review card reveals. There is no Status here: these settings apply to the other review widgets.
## Before you start [#before-you-start]
Review widgets render on your storefront through Sledge, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Product Review and Sidebar Review are turned on.** Open **Sledge → Tools → Product Review** and check the two switches at the top — **Product Review** renders review content on product pages, and **Sidebar Review** powers the quick-view review drawer. With them off, the features below have nowhere to render.
## Open Display Settings [#open-display-settings]
Go to **Sledge → Tools → Product Review**, and under **Features** click **Display Settings**.
### Review list [#review-list]
* **Default sorting** — the order reviews appear in by default (“Highest rated” in the example; customers can still re-sort).
* **Review limit** — how many reviews load per page of the list (16 in the example).
* **Show reviews with no image** — include text-only reviews in the list.
* **Sorting & limit** — expose the sort control and paging behavior in the list itself.
### Review card [#review-card]
* **Reply name** — the name shown on your replies to reviews (“Sledge” in the example) next to the Admin tag.
* **Show reviewer location** — display the reviewer’s city below their name.
* **Show review date** — display when the review was submitted.
* **Show replier name** — display who replied on your behalf.
### Preview [#preview]
The two preview panels reflect your choices live — the full **review list** (sorting, verified badges, replies) and a single **review card** with the details you toggled on. Click **Save** in the save bar to apply.
## Result [#result]
Every review widget — the product page list, sidebar, and cards — follows these rules: your default sort order, your per-page limit, and exactly the reviewer details you chose to show.
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the feature’s **Status** is Enable, and that Sledge Core, Product Review, and Sidebar Review are switched on as described above.
## Related [#related]
* [How do I set up Product Reviews?](/guide/reviews/set-up-product-reviews)
* [How do I set up Sidebar Reviews?](/guide/reviews/set-up-sidebar-reviews)
* [How do I set up the Happy Customer showcase?](/guide/reviews/set-up-the-happy-customer-showcase)
* [How do I set up the Trust Badge?](/guide/reviews/set-up-the-trust-badge)
* [How do I set up review Snippets?](/guide/reviews/set-up-review-snippets)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
---
# Product Reviews (https://docs.sledge-app.com/guide/reviews)
---
# How do I set up Product Reviews? (https://docs.sledge-app.com/guide/reviews/set-up-product-reviews)
Product Reviews is the core of the review module: the review list customers see on your product pages, plus the moderation queue where you publish, verify, and reply to what customers write.
## Before you start [#before-you-start]
Review widgets render on your storefront through Sledge, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Product Review and Sidebar Review are turned on.** Open **Sledge → Tools → Product Review** and check the two switches at the top — **Product Review** renders review content on product pages, and **Sidebar Review** powers the quick-view review drawer. With them off, the features below have nowhere to render.
## Open Product Reviews [#open-product-reviews]
Go to **Sledge → Tools → Product Review**, and under **Features** click **Product Reviews**.
### Layout [#layout]
How reviews are displayed on the product page: **Grid** (cards in columns) or **List** (stacked full-width, the current choice in the example). Pick with **Choose**.
### Publishing and moderation [#publishing-and-moderation]
* **Enable auto publish** — new reviews go live automatically when they meet the **Minimum rating** (“4 stars & up” in the example). Reviews below the bar wait in the queue for your approval, so criticism never publishes unseen.
* **The moderation table** — every incoming review, filtered by the **All / Publish / Verified** tabs, with search and sort. This is where you publish, verify, and reply to reviews once customers start writing them.
### Empty state [#empty-state]
The **Title** and **Description** shown on a product that has no reviews yet — “Be the first to review” invites the first customer instead of showing an empty box.
### Status and Preview [#status-and-preview]
**Status** turns the widget on; the **Preview** renders the review list exactly as the storefront library draws it — rating summary, sort control, verified badges, and your replies shown under the review with the **Admin** tag.
## Result [#result]
Product pages show the review list in your chosen layout. As reviews come in they flow through the moderation rules you set here — auto-published when they clear the minimum rating, held for approval when they don’t.
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the feature’s **Status** is Enable, and that Sledge Core, Product Review, and Sidebar Review are switched on as described above.
## Related [#related]
* [How do I configure review Display Settings?](/guide/reviews/configure-review-display-settings)
* [How do I set up Sidebar Reviews?](/guide/reviews/set-up-sidebar-reviews)
* [How do I set up review Snippets?](/guide/reviews/set-up-review-snippets)
* [How do I set up the Trust Badge?](/guide/reviews/set-up-the-trust-badge)
* [How do I set up the Happy Customer showcase?](/guide/reviews/set-up-the-happy-customer-showcase)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
---
# How do I set up review Snippets? (https://docs.sledge-app.com/guide/reviews/set-up-review-snippets)
Snippets are one-line review quotes that rotate in a small carousel — a compact dose of social proof for search, collection, and product sections where a full review list would be too much.
## Before you start [#before-you-start]
Review widgets render on your storefront through Sledge, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Product Review and Sidebar Review are turned on.** Open **Sledge → Tools → Product Review** and check the two switches at the top — **Product Review** renders review content on product pages, and **Sidebar Review** powers the quick-view review drawer. With them off, the features below have nowhere to render.
## Open Snippets [#open-snippets]
Go to **Sledge → Tools → Product Review**, and under **Features** click **Snippets**.
### Snippet settings [#snippet-settings]
* **Minimum rating** — only reviews at or above this rating are quoted (“4 stars & up” in the example), so snippets always show your best feedback.
* **Review limit** — how many reviews rotate through the carousel (4 in the example).
* **Display reviews even if they do not include photos** — widen the pool to text-only reviews.
* **Display star ratings with each review** — show the reviewer’s stars next to their quote.
### Status and Preview [#status-and-preview]
**Status** turns snippets on; the **Preview** shows the rotating quote line — reviewer name, stars, and the first line of their review, with arrows to cycle through.
## Result [#result]
Eligible sections show a single rotating review line that cycles through your best-rated reviews — a light-touch trust signal that fits where a full review block wouldn’t.
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the feature’s **Status** is Enable, and that Sledge Core, Product Review, and Sidebar Review are switched on as described above.
## Related [#related]
* [How do I set up Product Reviews?](/guide/reviews/set-up-product-reviews)
* [How do I set up the Trust Badge?](/guide/reviews/set-up-the-trust-badge)
* [How do I configure review Display Settings?](/guide/reviews/configure-review-display-settings)
* [How do I set up Sidebar Reviews?](/guide/reviews/set-up-sidebar-reviews)
* [How do I set up the Happy Customer showcase?](/guide/reviews/set-up-the-happy-customer-showcase)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
---
# How do I set up Sidebar Reviews? (https://docs.sledge-app.com/guide/reviews/set-up-sidebar-reviews)
Sidebar Reviews is a slide-out drawer of review content — customers tap the floating rating tab and get social proof in a quick-view panel without leaving the page they’re on.
## Before you start [#before-you-start]
Review widgets render on your storefront through Sledge, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Product Review and Sidebar Review are turned on.** Open **Sledge → Tools → Product Review** and check the two switches at the top — **Product Review** renders review content on product pages, and **Sidebar Review** powers the quick-view review drawer. With them off, the features below have nowhere to render.
## Open Sidebar Reviews [#open-sidebar-reviews]
Go to **Sledge → Tools → Product Review**, and under **Features** click **Sidebar Reviews**.
### Layout [#layout]
How review content is displayed inside the drawer: **Image grid** (a photo-first mosaic, the current choice), **Card grid**, or **List**.
### Position [#position]
Where the drawer attaches on desktop — **Dock on left** or **Dock on right**. On mobile the drawer always slides up from the bottom, regardless of this setting.
### Display options [#display-options]
* **Show rating average** — surface the aggregated score at the top of the sidebar.
* **Show product info** — reveal the product title and price below each review, so a review can lead the customer straight to the product.
### Status and Preview [#status-and-preview]
**Status** turns the drawer on; the **Preview** shows the floating rating tab that customers click to open it.
## Result [#result]
A rating tab docks to the side you chose; clicking it slides out the review drawer in your chosen layout — social proof available on any page without navigation.
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the feature’s **Status** is Enable, and that Sledge Core, Product Review, and Sidebar Review are switched on as described above.
## Related [#related]
* [How do I set up Product Reviews?](/guide/reviews/set-up-product-reviews)
* [How do I configure review Display Settings?](/guide/reviews/configure-review-display-settings)
* [How do I set up the Trust Badge?](/guide/reviews/set-up-the-trust-badge)
* [How do I set up review Snippets?](/guide/reviews/set-up-review-snippets)
* [How do I set up the Happy Customer showcase?](/guide/reviews/set-up-the-happy-customer-showcase)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
---
# How do I set up the Happy Customer showcase? (https://docs.sledge-app.com/guide/reviews/set-up-the-happy-customer-showcase)
Happy Customer is a store-wide testimonial showcase: one page that aggregates your best reviews — product and store reviews together — with a rating histogram and a Write a Review form.
## Before you start [#before-you-start]
Review widgets render on your storefront through Sledge, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Product Review and Sidebar Review are turned on.** Open **Sledge → Tools → Product Review** and check the two switches at the top — **Product Review** renders review content on product pages, and **Sidebar Review** powers the quick-view review drawer. With them off, the features below have nowhere to render.
## Open Happy Customer [#open-happy-customer]
Go to **Sledge → Tools → Product Review**, and under **Features** click **Happy Customer**.
### Layout [#layout]
How the review cards are displayed: **Grid layout** (the current choice) or **List layout**.
### Display options [#display-options]
**Show product information** — display the product title (with a small thumbnail) inside each review card, so visitors can jump from a testimonial to the product it praises.
### Status and Preview [#status-and-preview]
**Status** turns the showcase on. The **Preview** shows the full experience: the aggregate rating with its star histogram, the **Product Reviews / Store Reviews** tabs, the **Write a Review** button, and the review cards with verified badges and product chips.
## Result [#result]
Customers get a dedicated social-proof showcase collecting your best feedback in one place — reviews across the store, filterable by product or store reviews, with the option to add their own.
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the feature’s **Status** is Enable, and that Sledge Core, Product Review, and Sidebar Review are switched on as described above.
## Related [#related]
* [How do I set up Product Reviews?](/guide/reviews/set-up-product-reviews)
* [How do I configure review Display Settings?](/guide/reviews/configure-review-display-settings)
* [How do I set up the Trust Badge?](/guide/reviews/set-up-the-trust-badge)
* [How do I set up Sidebar Reviews?](/guide/reviews/set-up-sidebar-reviews)
* [How do I set up review Snippets?](/guide/reviews/set-up-review-snippets)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
---
# How do I set up the Trust Badge? (https://docs.sledge-app.com/guide/reviews/set-up-the-trust-badge)
The Trust Badge is a compact rating seal — your average score, stars, and review count — that reinforces credibility wherever it’s shown.
## Before you start [#before-you-start]
Review widgets render on your storefront through Sledge, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Product Review and Sidebar Review are turned on.** Open **Sledge → Tools → Product Review** and check the two switches at the top — **Product Review** renders review content on product pages, and **Sidebar Review** powers the quick-view review drawer. With them off, the features below have nowhere to render.
## Open Trust Badge [#open-trust-badge]
Go to **Sledge → Tools → Product Review**, and under **Features** click **Trust Badge**.
### Layout [#layout]
The badge style shown on the storefront:
* **Large with logo** — score, stars, and a “Powered by Sledge” logo line (the current choice).
* **Large without logo** — score, review count, and stars only.
* **Small with logo** — a compact one-line “4.9/5” variant for tighter spots.
### Status and Preview [#status-and-preview]
The **Preview** renders the badge with your live aggregate score. Note that Trust Badge ships with **Status** set to **Disable** — switch it to **Enable** when you’re ready, or the badge will never appear on the storefront.
## Result [#result]
Once enabled, the badge renders your store’s real aggregate rating in the style you picked, quietly backing up every page it appears on.
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the feature’s **Status** is Enable, and that Sledge Core, Product Review, and Sidebar Review are switched on as described above.
## Related [#related]
* [How do I set up Product Reviews?](/guide/reviews/set-up-product-reviews)
* [How do I set up review Snippets?](/guide/reviews/set-up-review-snippets)
* [How do I set up Sidebar Reviews?](/guide/reviews/set-up-sidebar-reviews)
* [How do I set up the Happy Customer showcase?](/guide/reviews/set-up-the-happy-customer-showcase)
* [How do I configure review Display Settings?](/guide/reviews/configure-review-display-settings)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
---
# How do I set up Instant Search? (https://docs.sledge-app.com/guide/search/how-to-set-up-instant-search)
**Instant Search** is the panel that drops down under your store's search bar. It reacts as the customer types — showing matching products, collections and pages — so they can jump straight to what they want instead of loading a results page first.
This guide covers the whole setup: turning the feature on, then working through the four settings cards one at a time — **Layout**, **With result**, **No result** and **Search on click**.
**Before you start.** Sledge must be enabled in your theme and your products need to have finished syncing. Instant Search reads from your synced catalogue, so an empty or half-synced store will show empty results.
## Step 1 — Turn on Instant Search and Search Result Page [#step-1--turn-on-instant-search-and-search-result-page]
Go to **Tools → Search**. The first card holds two switches, and you need *both* of them.
* **Instant Search** — the drop-down panel itself. This is what shows suggestions while the customer is still typing.
* **Search Result Page** — the full results page the customer lands on when they press Enter or click through from the panel.
Leaving **Search Result Page** off is the most common mistake here. The panel would work, but the moment a customer submits their search they drop back onto your theme's default results page and lose everything Sledge ranked for them. Turn both on.
These two switches **save the moment you flip them** — there is no Save button on this page. When you turn one on, a short confirmation appears with a **Preview** button that opens your live storefront in a new tab, and a **Skip** button if you would rather carry on. The setting is already saved either way.
## Step 2 — Open the Instant Search settings [#step-2--open-the-instant-search-settings]
Scroll down to the **Features** list on the same page and click **Instant Search**.
The settings page is split in two: your settings on the left, and a **Preview** on the right that redraws every time you change something. The preview shows unsaved edits, so you can try a setting, look across, and decide before committing.
Use the two small icons at the top of the Preview to switch between the **mobile** and **desktop** view — the desktop icon opens it full screen. The **View storefront** button at the top right opens your real store with instant search active.
Unlike the previous page, this one **does not save automatically**. A bar appears at the top as soon as you change anything, and your edits only go live when you click **Save**.
## Step 3 — Layout [#step-3--layout]
*Choose how Instant Search appears and how results are arranged.*
Pick one of three shapes. The thumbnail on the left of each row shows how the panel is built, and the one you are currently using is marked with a green **Current layout** badge and a greyed-out **Chosen** button. Click **Choose** on any other row to switch.
* **Full width** — the panel stretches across the whole window, with a sidebar on one side and a grid of products filling the rest. Best for stores with a large catalogue and several result types switched on.
* **Two columns** — a narrower panel, still with a sidebar next to the results. A good middle ground.
* **One column** — everything stacked in a single column, with no sidebar. The simplest and least intrusive option, and the closest to what most themes do by default.
Under **Advance settings** you choose which side the sidebar sits on — **Left** or **Right**. The note underneath, *This configuration for desktop*, is there because the sidebar only exists on desktop; on mobile the panel is always a single stacked column, so this choice has no effect there.
## Step 4 — With result [#step-4--with-result]
*Control the search experience and capture customer intent signals (queries, clicks, interactions).*
This card decides what appears in the panel **while the customer is typing and there are matches**. Each row is a type of content, with its own switch. Turn a row on and its settings appear underneath.
The six rows are **Display product**, **Display collection**, **Display popular suggestion**, **Display page**, **Display blog** and **Display article** — matching products, collections, suggested search terms, pages, blogs and blog articles respectively.
Every row that is switched on gives you the same two fields:
* **Title** — the small heading shown above that group in the panel. This is customer-facing, so write it the way your customers speak. *Products*, *Collection* and *Page* are the defaults.
* **Number of display result** — how many items of that type to show. Keep these numbers low. The panel is meant to be scanned in a second or two, and 3–6 products with 2–3 collections reads far better than a wall of everything.
Two rows add something extra:
* **Display product** shows an information banner with a **Global setting** link. The *content* of each product card — image, price, swatches, ratings — is set once for the whole app in **Settings & Support → Global setting**, not here.
* **Display popular suggestion** adds an **Add search suggestion** button. Use it to hand-pick the phrases you want promoted while customers type.
Here is the result in the preview after typing *polo* — the *Products* heading comes from the Title field, and the number of cards from the count.
**At least one row must stay on.** If you switch all six off, Save is blocked and a red banner appears reading *"Enable at least one result type to show search results."* Each count also has to be 1 or more.
## Step 5 — No result [#step-5--no-result]
*Configure what customers see when there are no matching results.*
A dead end is where searches turn into lost sales. This card lets you put something useful in front of the customer instead of an empty panel. Both rows are off until you turn them on.
**Search term suggestions** — offers alternative phrases to try. **Label** is the heading customers see. **Suggestion source** decides where the terms come from:
* **Display search term suggestions based on your store data** — Sledge picks them automatically from what people actually search for in your store. Set it and forget it.
* **Add search term** — you type the list yourself. Choose this when you want to steer customers towards specific products or a seasonal push. An **Add search term** button appears so you can build the list.
**Display most popular products** — shows products instead of leaving the panel blank. **Label** is again the heading, and **Product list** works the same way as above: **Display best selling products based on your store data** keeps itself up to date automatically, while **Add product manually** reveals an **Add products** button and lets you pick exactly which products to fall back to.
The preview below shows the result for a query with no matches — the message, the built-in search tips, and the popular products underneath.
## Step 6 — Search on click [#step-6--search-on-click]
*Choose what customers see when they click the search bar before typing.*
This card fills the panel in the moment **before the customer has typed anything**. An empty box asks the customer to do all the work; a few suggestions here often turn a hesitant click into a search. Three rows, all off by default.
* **Display recent searches** — each customer's own previous searches, so returning visitors can pick up where they left off. Set the **Title** and **Number of display result**. There is no source option here, because the list is personal to each customer.
* **Display popular search** — trending terms shown as clickable chips. **Suggestion source** is either **Display search term suggestions based on your store data** (automatic) or **Search term**, which gives you an **Add search term** button to curate the list by hand.
* **Display most popular products** — a row of products to browse before searching at all. Again either automatic best sellers, or **Add product manually** with an **Add products** button so you can push a specific range.
The example above uses hand-picked terms and hand-picked products. This is what the customer sees the instant they click the search bar:
## Save your changes [#save-your-changes]
Click **Save** in the bar at the top of the page. If the button does not respond, check the two rules from Step 4: at least one **With result** row has to be on, and every **Number of display result** field has to be 1 or more. The page scrolls to whichever field is blocking the save.
## Not showing up? [#not-showing-up]
* Check both switches on **Tools → Search**. Instant Search being off is the first thing to rule out.
* Confirm you pressed **Save** on the settings page. The preview updates from unsaved edits, so it can look correct while your storefront is still on the old settings.
* Nothing appears before typing? That is **Search on click** — all three rows are off until you turn them on.
* A result type is missing? Check its switch in **With result**, and confirm you have that content in your store. A blog row cannot show blogs if the store has none.
* Fewer items than expected? Check **Number of display result** for that row.
* The sidebar is on the wrong side, or missing? The sidebar only exists on desktop, and **One column** has no sidebar at all.
---
# Search (https://docs.sledge-app.com/guide/search)
---
# How do I set up AI-Powered Synonyms? (https://docs.sledge-app.com/guide/search/set-up-ai-powered-synonyms)
Synonyms let customers find products even when they use different words — a search for “tshirt” can still find your “Polo Shirt”. Sledge builds this in two ways: the **AI Synonym** tab generates synonym and typo variations automatically from your store data, and the **Manual Synonym** tab lets you add your own rules for anything the AI doesn’t cover.
## Before you start [#before-you-start]
Synonyms are applied when Sledge handles the search on your storefront, so two things must already be in place:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does (including synonyms) reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Instant Search and Search Result Page are turned on.** Open **Sledge → Tools → Search** and check the two switches at the top. Synonyms apply to both surfaces: the instant results panel that opens while a customer types, and the full search results page. At least the surface you use must be on — with both off, there is no Sledge search for the synonyms to improve.
## Open AI-Powered Synonyms [#open-ai-powered-synonyms]
Go to **Sledge → Tools → Search**, and under **Features** click **AI-Powered Synonyms**.
The page has two tabs — **AI Synonym** and **Manual Synonym**. Each is explained below.
## The AI Synonym tab [#the-ai-synonym-tab]
On the **AI Synonym** tab, Sledge automatically generates synonym and typo variations from your store data — product names, collections, and brand terms. There is nothing to set up: the list fills on its own and is applied to search right away. AI Synonym is part of the **Pro plan**; on the Free plan this tab shows a locked state with a **Switch plan** button.
Each row shows:
* **Search terms** — the base word the rule is built around.
* **Direction** — AI-generated rules are **Two-way**: every term in the rule finds the others.
* **Synonyms** — the generated variations, including common typos (for example *winter → wintertime, wintter, winter sale*).
* **Status** — a switch per rule. If a generated rule doesn’t fit your store, switch it off; you don’t have to delete it.
Above the table you can filter by **All / Enable / Disable**, search the list, and sort. Selecting rows with the checkboxes opens bulk actions to **Deactivate** or **Delete synonyms**.
## Add a manual synonym [#add-a-manual-synonym]
Open the **Manual Synonym** tab and click **Add manual synonym**. Each numbered card is one synonym rule, with four settings:
### Search term [#search-term]
The word your customers actually type. In the example above, the first rule uses **tshirt** — a word customers use even though the store’s products are named “Polo Shirt”.
### Direction [#direction]
Controls which way the rule applies:
* **One way** — searching the *Search term* also finds products matching the *Synonyms*, but not the reverse. In the example: searching **tshirt** finds “polo shirt” products, but searching **polo** is not affected by this rule. Use this when the search term is a customer word that doesn’t appear in your catalog.
* **Two way** — the search term and every synonym are fully interchangeable; any of them finds the others. In the example: **sweater**, **knitwear**, and **cardigan** all find each other’s products. Use this for words that genuinely mean the same thing in your catalog.
### Synonyms [#synonyms]
The list of words the rule connects to the search term, separated by commas — for example **polo shirt, polo**. Both the Search term and at least one synonym are required before you can save.
### Add suggestion list [#add-suggestion-list]
Tick this to also add the search term to your **Suggestion Dictionary**. The term can then be offered to customers as a suggestion in Instant Search (for example under *Popular searches*) — useful when you want to actively steer customers toward a term you know returns good results.
Use **Add more synonym** at the bottom to add several rules in one go (the trash icon removes a card), then click **Save**.
## Manage your synonyms [#manage-your-synonyms]
Saved rules appear in the **Manual synonym** list. From here you can:
* **Edit a rule** — click its row to open it.
* **Suggestion list** — tick or untick the checkbox directly in the list to add or remove the term from the Suggestion Dictionary.
* **Status** — switch a rule off to stop applying it without deleting it.
* **Filter, search, and sort** — the **All / Enable / Disable** tabs, the search icon, and the sort icon above the table.
* **Bulk actions** — select rows with the checkboxes to **Deactivate** or **Delete synonyms** in one action.
## Import and export [#import-and-export]
To manage rules in bulk, use **Import** and **Export** at the top of the Manual Synonym tab. Import accepts a CSV file where each row is *search term, direction, synonyms* — click **Download CSV template** in the modal for the exact format. Export downloads your current manual rules as a CSV, which is handy as a backup or for copying rules to another store.
## Result [#result]
On the storefront, searching **tshirt** now returns the store’s Polo Shirts — the one-way rule connected a word customers type to products that don’t contain it. And because *Add suggestion list* was ticked, **tshirt** also appears as a suggestion under *Popular searches*.
Not showing up? Give the change about a minute to sync, then try the search again. Also confirm the rule’s **Status** is on, and that Sledge Core, Instant Search, and Search Result Page are enabled as described above.
## Related [#related]
* [How do I set up Stop Words?](/guide/search/set-up-stop-words)
* [How do I set up AI-Smart Search?](/guide/search/set-up-ai-smart-search)
* [How do I set up Field Priority?](/guide/search/set-up-field-priority)
* [How do I set up Redirects?](/guide/search/set-up-redirects)
* [How do I set up Instant Search?](/guide/search/how-to-set-up-instant-search)
* [How do I set up the Search Results Page?](/guide/search/set-up-the-search-results-page)
---
# How do I set up AI-Smart Search? (https://docs.sledge-app.com/guide/search/set-up-ai-smart-search)
AI-Smart Search upgrades how Sledge matches a query to your products. Instead of only matching the exact words a customer types, it can also match by *meaning* — so a query that doesn’t literally appear in your product text can still find the right products. You choose how far that goes with a single Search Mode setting.
## Before you start [#before-you-start]
This feature only takes effect when Sledge handles the search on your storefront, so two things must already be in place:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Instant Search and Search Result Page are turned on.** Open **Sledge → Tools → Search** and check the two switches at the top. At least the surface you use must be on — with both off, there is no Sledge search for this feature to act on.
## Open AI-Smart Search [#open-ai-smart-search]
Go to **Sledge → Tools → Search**, and under **Features** click **AI-Smart Search**. AI-Smart Search is part of the **Pro plan** — on the Free plan the page shows a locked state with a link to switch plans.
### Search Mode [#search-mode]
Controls how queries are matched against your catalog:
* **Keyword Search** — classic word matching only. A product is found when the query’s words (or their synonyms) appear in its fields. The most predictable mode, and the right choice if you want zero surprises in what a query returns.
* **Semantic Search** — matching by meaning only. The query and your products are compared as concepts, so “outerwear for cold days” can find coats even though no product says that. Results are broader and less literal.
* **Hybrid Search (Recommended)** — both at once: exact keyword matches rank first-class, and semantic matches fill in for queries your product text doesn’t cover literally. This is the recommended mode for most stores.
### Semantic search strength [#semantic-search-strength]
This select appears only when **Hybrid Search** is chosen, and controls how much the semantic side influences results in the blend:
* **Light** — keyword matches dominate; semantic matches only assist when keywords find little. The safest setting to start with.
* **Balanced** — an even blend of keyword and semantic relevance.
* **Strong** — semantic similarity weighs heavily, giving the most conceptual results.
### AI-Conversational Search [#ai-conversational-search]
A separate switch below the divider. When enabled, free-form sentences a customer types into the search bar — like “show me blue shirts under $50” — are transformed into a structured set of search parameters (query, filters, criteria) instead of being matched word-for-word. Leave it off if you prefer every query to be treated literally.
When you change any of these settings, a save bar appears at the top — click **Save** to apply, or **Discard** to revert.
## Result [#result]
Searches on your storefront now use the mode you chose. With Hybrid on, exact queries (product names, SKUs) behave as before, while conceptual queries that used to return nothing start surfacing relevant products. If results ever feel too loose, lower the semantic strength — if too literal, raise it.
Not showing up? Give the change about a minute to sync, then try the search again. Also confirm that Sledge Core, Instant Search, and Search Result Page are enabled as described above.
## Related [#related]
* [How do I set up AI-Powered Synonyms?](/guide/search/set-up-ai-powered-synonyms)
* [How do I set up Personalization?](/guide/search/set-up-personalization)
* [How do I set up Field Priority?](/guide/search/set-up-field-priority)
* [How do I set up Instant Search?](/guide/search/how-to-set-up-instant-search)
* [How do I set up the Search Results Page?](/guide/search/set-up-the-search-results-page)
* [How do I set up Stop Words?](/guide/search/set-up-stop-words)
---
# How do I set up Field Priority? (https://docs.sledge-app.com/guide/search/set-up-field-priority)
When a customer’s search matches several products, *where* the match happens matters: a match in a product’s title should usually count for more than a match buried in its description. Field Priority lets you choose exactly which product fields are searched and in what order of importance.
## Before you start [#before-you-start]
This feature only takes effect when Sledge handles the search on your storefront, so two things must already be in place:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Instant Search and Search Result Page are turned on.** Open **Sledge → Tools → Search** and check the two switches at the top. At least the surface you use must be on — with both off, there is no Sledge search for this feature to act on.
## Open Field Priority [#open-field-priority]
Go to **Sledge → Tools → Search**, and under **Features** click **Field Priority**. The whole feature is one table:
### The field list [#the-field-list]
Each row is a product field Sledge can search: **Title**, **Description**, **Product type**, **Vendor**, **Tags**, and **SKU**. Fields at the **top** of the list have the higher priority — in the example above, a query that matches a product’s Title outranks one that only matches its Tags.
### Rank / Priority — drag to reorder [#rank--priority--drag-to-reorder]
Grab the handle on the left of a row and drag it up or down. The **Rank/Priority** number updates automatically; 1 is the most important field. Put the fields your customers actually search for (usually Title) at the top.
### Status — enable or disable a field [#status--enable-or-disable-a-field]
The switch on the right controls whether the field is searched at all. Disable fields that create noise for your store — for example, turn off **Description** if long descriptions cause loosely-related products to appear, or off **SKU** if your SKUs are internal codes customers never type. At least one field must stay enabled — if you disable them all, Sledge shows an *“Enable at least one field.”* banner and blocks the save.
When you change the order or a status, a save bar appears at the top — click **Save** to apply, or **Discard** to revert.
## Result [#result]
Search relevance on your storefront now follows your order. The change is most visible on queries that match different products in different fields: products matching in a high-priority field rise to the top, and disabled fields stop producing matches entirely.
Not showing up? Give the change about a minute to sync, then try the search again. Also confirm that Sledge Core, Instant Search, and Search Result Page are enabled as described above.
## Related [#related]
* [How do I set up AI-Smart Search?](/guide/search/set-up-ai-smart-search)
* [How do I set up AI-Powered Synonyms?](/guide/search/set-up-ai-powered-synonyms)
* [How do I set up Stop Words?](/guide/search/set-up-stop-words)
* [How do I set up the Search Results Page?](/guide/search/set-up-the-search-results-page)
* [How do I set up Instant Search?](/guide/search/how-to-set-up-instant-search)
* [How do I set up Personalization?](/guide/search/set-up-personalization)
---
# How do I set up Personalization? (https://docs.sledge-app.com/guide/search/set-up-personalization)
Personalization tailors search results to each customer based on what they have searched, clicked, added to cart, and bought. Two customers typing the same query can see the same products in a different order — each sorted toward what that person is most likely to want.
## Before you start [#before-you-start]
This feature only takes effect when Sledge handles the search on your storefront, so two things must already be in place:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Instant Search and Search Result Page are turned on.** Open **Sledge → Tools → Search** and check the two switches at the top. At least the surface you use must be on — with both off, there is no Sledge search for this feature to act on.
## Open Personalization [#open-personalization]
Go to **Sledge → Tools → Search**, and under **Features** click **Personalization**.
### Enable personalization [#enable-personalization]
The master switch at the top. When it’s off, everyone sees the same default ranking and the settings below have no effect.
### Strength [#strength]
How strongly a customer’s history is allowed to re-order their results:
* **Light** — a gentle nudge; results stay close to the default ranking.
* **Balanced** — a middle ground, and a sensible default.
* **Strong** — history weighs heavily; results can differ a lot per customer. Use conservative settings if you want results to stay predictable.
### Apply to [#apply-to]
Who gets personalized results: **All customers** (anyone with any history, even from the current visit) or **Returning customers only** (first-time visitors always see the default ranking).
### Lookback window [#lookback-window]
How far back behavior counts: **Last 7 days**, **Last 30 days**, or **Last 90 days**. A short window follows what the customer is shopping for right now; a long window builds a more stable taste profile.
### Signals [#signals]
Choose which behaviors are allowed to influence ranking. Each can be toggled independently:
* **Search history** — what the customer has searched for before.
* **Product clicks** — products they opened from search or listings.
* **Add to cart** — products they added to the cart, a stronger interest signal than a click.
* **Purchases** — what they actually bought, the strongest signal of all.
### Fallback [#fallback]
What a customer sees when they have *no* usable history (for example a brand-new visitor when Apply to is set to All customers):
* **Use default ranking** — plain relevance order, exactly as if personalization were off.
* **Boost store trending products** — lean on what is trending across your whole store.
* **Boost recently popular products** — favor products that have been popular lately.
### Privacy [#privacy]
Personalization should be transparent and respect customer privacy — only enable signals you can support in your storefront, and consider updating your store’s privacy policy if you track behavior for personalization.
When you change any setting, a save bar appears at the top — click **Save** to apply, or **Discard** to revert.
## Result [#result]
As customers browse and buy, their search results gradually reorder toward their interests — a customer who keeps viewing polo shirts will see polos climb in mixed results. The effect needs some history to become visible, so test it after browsing a few products rather than on a fresh incognito window (that’s exactly what a new visitor’s fallback is for).
Not showing up? Give the change about a minute to sync, then try the search again. Also confirm that Sledge Core, Instant Search, and Search Result Page are enabled as described above.
## Related [#related]
* [How do I set up AI-Smart Search?](/guide/search/set-up-ai-smart-search)
* [How do I set up Instant Search?](/guide/search/how-to-set-up-instant-search)
* [How do I set up the Search Results Page?](/guide/search/set-up-the-search-results-page)
* [How do I set up Field Priority?](/guide/search/set-up-field-priority)
* [How do I set up AI-Powered Synonyms?](/guide/search/set-up-ai-powered-synonyms)
* [How do I create a suggestion dictionary?](/guide/search/set-up-the-suggestion-dictionary)
---
# How do I set up Redirects? (https://docs.sledge-app.com/guide/search/set-up-redirects)
Sometimes the best answer to a search isn’t a list of products — it’s a specific page. A redirect sends a search query straight to a URL you choose: “polos” to your polo collection, “shipping” to your shipping policy, a campaign word to a landing page. The customer presses Enter and lands on the page instead of a results list.
## Before you start [#before-you-start]
This feature only takes effect when Sledge handles the search on your storefront, so two things must already be in place:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Instant Search and Search Result Page are turned on.** Open **Sledge → Tools → Search** and check the two switches at the top. At least the surface you use must be on — with both off, there is no Sledge search for this feature to act on.
## Open Redirect [#open-redirect]
Go to **Sledge → Tools → Search**, and under **Features** click **Redirect**, then click **Add redirect**.
## Add a redirect rule [#add-a-redirect-rule]
### Search query [#search-query]
The term that triggers the redirect. Matching is **exact** — the rule fires when a customer submits exactly this query (“polos” above), not when the word merely appears somewhere in a longer search.
### Redirect URL [#redirect-url]
The full destination URL, including `https://` — a collection, a page, a product, or any other address. In the example the query “polos” goes to the store’s *Modern Polos* collection.
### Enable redirect [#enable-redirect]
Whether the rule is live. You can create rules disabled and switch them on later — handy for campaign terms you only want active during the campaign.
### Open destination in new tab [#open-destination-in-new-tab]
By default the redirect replaces the current page. Tick this to open the destination in a new browser tab instead — useful when the destination is outside your store.
Click **Save** in the save bar to create the rule.
## Manage your redirects [#manage-your-redirects]
Saved rules appear in the Redirect list showing the **Search query**, the **Redirect to** URL, and a **Status** switch to turn each rule on or off without deleting it. Click a row to edit it. The **All / Enable / Disable** tabs filter by status, the icons on the right search and sort the list, and selecting rows with the checkboxes opens bulk actions to **Deactivate** or delete several rules at once.
## Result [#result]
On the storefront, a customer who types **polos** and presses Enter skips the results page entirely and lands on the Modern Polos collection:
Not showing up? Give the change about a minute to sync, then try the search again. Also confirm that Sledge Core, Instant Search, and Search Result Page are enabled as described above.
## Related [#related]
* [How do I set up Stop Words?](/guide/search/set-up-stop-words)
* [How do I set up AI-Powered Synonyms?](/guide/search/set-up-ai-powered-synonyms)
* [How do I set up the Search Results Page?](/guide/search/set-up-the-search-results-page)
* [How do I set up Instant Search?](/guide/search/how-to-set-up-instant-search)
* [How do I set up Field Priority?](/guide/search/set-up-field-priority)
* [How do I create a suggestion dictionary?](/guide/search/set-up-the-suggestion-dictionary)
---
# How do I set up Stop Words? (https://docs.sledge-app.com/guide/search/set-up-stop-words)
Stop words are common filler words — “the”, “for”, “from” — that carry no meaning in a search. Left alone, they can dilute results: a search for “shirts for men” shouldn’t rank products by how well they match the word “for”. Add them as stop words and Sledge ignores them during matching, keeping results focused on the words that matter.
## Before you start [#before-you-start]
This feature only takes effect when Sledge handles the search on your storefront, so two things must already be in place:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing Sledge does reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Instant Search and Search Result Page are turned on.** Open **Sledge → Tools → Search** and check the two switches at the top. At least the surface you use must be on — with both off, there is no Sledge search for this feature to act on.
## Open Stop Word [#open-stop-word]
Go to **Sledge → Tools → Search**, and under **Features** click **Stop Word**, then click **Add Word**.
## Add stop words [#add-stop-words]
### Stop word [#stop-word]
Type the word to ignore. You can add several at once by separating them with commas — “the, for, from” above creates three stop words in one save. Use **Add another stop word** for extra fields if you prefer one per field, then click **Save**.
## Manage your stop words [#manage-your-stop-words]
All stop words appear in one list. From here you can:
* **Edit** — click a word to open and change it.
* **Delete** — select words with the checkboxes and use the **Delete stop words** bulk action.
* **Search and sort** — the icons above the list, useful once the list grows long.
* **Import / Export** — manage the list in bulk as a CSV file. Import accepts a CSV of words (click **Download CSV template** in the modal for the format), and Export downloads your current list — handy as a backup or for copying to another store.
## Result [#result]
On the storefront, a search for **“the polo”** now behaves exactly like a search for “polo” — the stop word is ignored and the polo shirts rank on the word that matters:
Not showing up? Give the change about a minute to sync, then try the search again. Also confirm that Sledge Core, Instant Search, and Search Result Page are enabled as described above.
## Related [#related]
* [How do I set up AI-Powered Synonyms?](/guide/search/set-up-ai-powered-synonyms)
* [How do I set up Field Priority?](/guide/search/set-up-field-priority)
* [How do I set up Redirects?](/guide/search/set-up-redirects)
* [How do I set up AI-Smart Search?](/guide/search/set-up-ai-smart-search)
* [How do I set up the Search Results Page?](/guide/search/set-up-the-search-results-page)
* [How do I set up Instant Search?](/guide/search/how-to-set-up-instant-search)
---
# How do I set up the Search Results Page? (https://docs.sledge-app.com/guide/search/set-up-the-search-results-page)
The Search Results Page is the full page customers land on after they search. Configure which result types appear and what customers see when nothing matches.
**Before you start** — Sledge must be active on your theme. See *Turn on Sledge*.
## Steps [#steps]
1. Go to **Tools → Search** and turn **Search Result Page** on.
2. Open **Tools → Search → Search Page**.
3. Under **With result**, choose which result types appear — **Products**, **Collections**, **Pages**, **Blogs**, and **Articles**. Set each one’s **Title** and how many to show, and pick the card details (image, description).
4. Under **No result**, set what customers see when a search returns nothing — a message, **Search tips**, **Search term suggestions**, and **Most popular products** to keep them shopping.
5. Click **View storefront** to check it in place, then **Save**.
## Result [#result]
**Done.** Your search results page now shows the result types you enabled, and guides customers with tips and popular products when a search comes up empty.
**Not showing up?** Confirm **Search Result Page** is turned on in **Tools → Search**, and that Sledge is active on your theme. Storefront changes can take about a minute to sync.
## Related [#related]
* [How do I set up Instant Search?](/guide/search/how-to-set-up-instant-search)
* [How do I set up Field Priority?](/guide/search/set-up-field-priority)
* [How do I set up Redirects?](/guide/search/set-up-redirects)
* [How do I set up AI-Smart Search?](/guide/search/set-up-ai-smart-search)
* [How do I set up Personalization?](/guide/search/set-up-personalization)
* [How do I set up Stop Words?](/guide/search/set-up-stop-words)
---
# How do I create a suggestion dictionary? (https://docs.sledge-app.com/guide/search/set-up-the-suggestion-dictionary)
The **Suggestion Dictionary** is your own list of search phrases. Sledge offers these phrases to customers as clickable shortcuts — before they type, while they type, and when a search returns nothing.
It is worth being precise about what it does, because this is the part merchants most often get wrong: the dictionary **does not change which products a search finds**. It changes **which words Sledge puts in front of the customer**. Think of it as writing the menu, not rewriting the recipe.
## Before you start [#before-you-start]
Two things must already be switched on, or nothing you add here will reach your storefront.
### 1. Sledge Core must be enabled in your theme [#1-sledge-core-must-be-enabled-in-your-theme]
Sledge Core is the app embed that loads Sledge on your storefront. Without it no Sledge feature renders at all. If you have not done this yet, follow **How to Enable Sledge Core and Complete the Initial Setup** first, then come back here.
You can tell it is missing: a yellow **Enable Sledge Core** banner appears at the top of the app with an **Enable Now** button.
### 2. Instant Search and Search Result Page must be on [#2-instant-search-and-search-result-page-must-be-on]
Go to **Tools → Search** and check the two switches in the first card.
**Instant Search** is the drop-down panel under your search bar — that is where suggestions actually appear, so this one is essential. **Search Result Page** is the full results page a customer lands on after clicking a suggestion; leave it off and they drop onto your theme's default page instead. Turn both on. They save the moment you flip them.
## Step 1 — Open the Suggestion Dictionary [#step-1--open-the-suggestion-dictionary]
Go to **Tools → Search**, scroll to the **Features** list, and click **Suggestion Dictionary**. On a new store the list is empty.
Click **Add new** to create your first entry.
## Step 2 — Add your search terms [#step-2--add-your-search-terms]
The add form starts with a single numbered block, **#1 Suggestion dictionary**.
Each block has exactly two fields:
* **Suggestion** — the phrase itself. This is customer-facing text that appears exactly as you type it, so write it the way a customer would search: *Polo Shirt*, not *polo-shirt-mens-cotton*. Use the words your customers use, not your internal product codes.
* **Priority** — **Normal** (the default), **High**, or **Low**. This is a sort order, not a weight. The panel only has room for a handful of suggestions, so High entries fill those slots first, then Normal, then Low. If two entries share a priority, the older one wins. Use High for the few phrases you actively want to push.
Click **Add more suggestion dictionary** to add another block. You can build your whole starting list in one go — each block becomes its own entry. The red bin icon removes a block, and it only appears once you have more than one.
Click **Save** in the bar at the top of the page. Save stays greyed out until at least one **Suggestion** field has text in it.
**Watch for blank blocks.** If you add three blocks but only fill in two, the empty one is still submitted and will be rejected with *"Suggestion cannot be empty"*. Remove blocks you are not using before saving.
## Step 3 — Read the list [#step-3--read-the-list]
After saving you return to the list, with one row per entry.
Three columns:
* **Search terms** — the phrase you entered.
* **Priority** — High, Normal or Low, as set on the entry.
* **Status** — the switch that decides whether this entry reaches your storefront at all. Switching it off keeps the entry in your list but stops Sledge serving it, which is the safe way to retire a seasonal phrase you will want back later. This saves immediately.
Click anywhere on a row to open that entry for editing. There are no per-row edit or delete buttons — the row itself is the link.
## Step 4 — Edit, deactivate or delete [#step-4--edit-deactivate-or-delete]
Opening a row gives you the same two fields, this time on their own.
Change the phrase or its priority and click **Save**. Note there is no Status control on this screen — if an entry is switched off, you turn it back on from the switch on the list page.
To work on several entries at once, tick the checkboxes on the left. The header row turns into a bulk action bar.
* **Deactivate** — switches off every selected entry in one go.
* **Delete suggestions** — removes them permanently, after a confirmation. There is no undo, so prefer Deactivate unless you are certain.
There is no bulk *Activate*. To switch entries back on, use the individual Status switches on the list.
## Result [#result]
Open your storefront and click the search bar. Here a customer has typed *polo*, and the curated entry **Polo Shirt** is offered under **Popular searches**, above the product results.
Clicking that phrase runs it as a search — which is the whole point. You are handing the customer a better-phrased query than the one they were halfway through typing.
## Where your suggestions appear [#where-your-suggestions-appear]
Entries can surface in three places, all of them part of Instant Search:
* **While the customer types** — entries containing what they have typed so far, highest priority first. This is the main one, and it is what the screenshot above shows.
* **Before they type anything** — in the *Popular searches* block of the empty search panel.
* **When a search finds nothing** — under *Search term suggestions*, to give the customer somewhere to go instead of a dead end.
**Important.** For the last two, your dictionary is used only when that block's source is set to **store data**. If you have typed a manual term list into Instant Search settings instead, that manual list wins and the dictionary is ignored there. Check **Tools → Search → Instant Search** if your terms are not showing up where you expect.
## How this differs from the other search tools [#how-this-differs-from-the-other-search-tools]
Four features under Tools → Search sound similar and do very different jobs:
* **Suggestion Dictionary** — offers phrases *to* the customer. Presentation only; never changes which products match.
* **AI-Powered Synonyms** — makes two different words find the same products, such as *sofa* and *couch*. Changes results.
* **Redirect** — sends a matching query straight to a page instead of showing results at all.
* **Stop Word** — the opposite of this feature: words to ignore, so filler words do not dilute relevance.
One connection worth knowing: a synonym can be added to the suggestion list from the Synonyms screen. If you see an entry here you do not remember creating, it probably arrived that way.
## Not showing up? [#not-showing-up]
* Check the **Status** switch on the list. A deactivated entry is never sent to the storefront.
* Confirm **Instant Search** is on under Tools → Search. Suggestions live inside that panel — with it off, there is nowhere for them to appear.
* Give it about a minute. New entries sync to your storefront shortly after saving rather than instantly.
* Suggestions are matched against what the customer has typed. An entry only appears while typing if it contains that text — *Wool Coat* will not surface for someone typing *polo*.
* Only a few suggestions fit in the panel. If you have many entries, low-priority ones may simply be below the cut — raise the ones that matter to **High**.
* Not appearing before typing, or on a no-result search? Those blocks may be set to a manual term list in Instant Search settings, which overrides the dictionary.
---
# Settings & Support (https://docs.sledge-app.com/guide/settings)
---
# How do I keep Sledge indexing my Shopify catalog? (https://docs.sledge-app.com/guide/settings/indexing-keeping-sledge-in-sync-with-your-shopify-catalogue-automatically-and-on-demand)
Indexing is how Sledge keeps its copy of your Shopify catalogue fresh — the data behind search, filters, and recommendations. It runs automatically; this page lets you watch it and trigger it by hand when needed.
## Before you start [#before-you-start]
These settings shape what Sledge renders on your storefront, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **The Collections page surface is turned on.** Open **Sledge → Tools → Product Filter** and check the **Collections page** switch — collection pages are where these settings are most visible, since Sledge renders the product grid there.
## Open Indexing [#open-indexing]
Go to **Sledge → Settings & Support** and open **Indexing**.
### Manual indexing and Indexing status [#manual-indexing-and-indexing-status]
Sledge indexes product changes automatically about 1–2 minutes after you make them. If the storefront still shows stale data — an old price, a product that should have appeared — click **Start indexing** to run a manual index immediately. **Indexing status** next to it shows when the last indexing run happened.
### Indexing history [#indexing-history]
Every indexing run, filterable by **All / Auto indexing / Manual indexing**. Each row shows the **Indexing type** (for example the daily sync), **Triggered by** (Auto or Manual), **Started at**, **Duration**, and **Status** — *Completed* or *Failed*. An occasional failed run recovers on the next sync; repeated failures are worth reporting to support.
## Result [#result]
Catalogue changes — new products, price updates, stock changes — flow into Sledge search and filters within minutes automatically, and you have a one-click manual index plus a full history when you need to verify or force a sync.
Not showing up? Give the change a minute to sync, then reload the page, and confirm Sledge Core and the Collections page switch are on as described above.
## Related [#related]
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
* [How do I configure the product list?](/guide/settings/product-list-controlling-search-sorting-and-stock-rules-in-every-grid)
* [How do I set up skeleton loaders?](/guide/settings/skeleton-loaders-keeping-your-layout-steady-while-products-load)
* [How do I set up a filter group?](/guide/filter/how-to-set-up-filter-group)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How to set up cart drawer?](/guide/cart-drawer/how-to-set-up-cart-drawer)
---
# How do I configure the product card? (https://docs.sledge-app.com/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
The product card is the single product tile Sledge renders everywhere — in filtered collection grids, search results, recommendations, and the wishlist. This page decides what every one of those tiles shows, store-wide.
## Before you start [#before-you-start]
These settings shape what Sledge renders on your storefront, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **The Collections page surface is turned on.** Open **Sledge → Tools → Product Filter** and check the **Collections page** switch — collection pages are where these settings are most visible, since Sledge renders the product grid there.
## Open Product Card [#open-product-card]
Go to **Sledge → Settings & Support**, open **Global setting**, and click **Product Card**. The **View storefront** button at the top right opens your store to check the result.
### Card content [#card-content]
*
**Show vendor** — display the brand or vendor name on each card.
* **Show image** — display the product image at the top of each card.
* **Show price** — display the product price.
* **Show sales price** — when a product is on sale, also show the struck-through compare-at price.
* **Show SKU** — display the product SKU (off in the example; usually an internal code).
* **Use locale number format** — format prices based on the store’s locale settings, so decimal and thousands separators match what your customers expect.
* **Show add to cart button** — put an Add to Cart button on the card. **Cart URL** optionally points it at a specific cart page, and **Redirect customers to the cart page after adding an item** sends them straight to cart instead of staying on the grid.
### Product Attributes to Retrieve [#product-attributes-to-retrieve]
**Product attributes** selects which fields Sledge fetches for each card (Title, Vendor, Image, Price, Sales price, Tags, SKU, Product URL in the example) — a card can only display what is retrieved, and fetching only what you use keeps the grid fast. **Discount type** controls which discount formats the card understands (Percentage, Fixed amount).
The panel on the right renders live product cards with your current toggles — vendor line, image, price — with mobile and desktop views.
## Result [#result]
Every Sledge product tile across your store follows these rules — the same card everywhere a product appears: filter results, search, recommendations, and the wishlist.
Not showing up? Give the change a minute to sync, then reload the page, and confirm Sledge Core and the Collections page switch are on as described above.
## Related [#related]
* [How do I configure the product list?](/guide/settings/product-list-controlling-search-sorting-and-stock-rules-in-every-grid)
* [How do I set up skeleton loaders?](/guide/settings/skeleton-loaders-keeping-your-layout-steady-while-products-load)
* [How do I keep Sledge in sync with my Shopify catalogue?](/guide/settings/indexing-keeping-sledge-in-sync-with-your-shopify-catalogue-automatically-and-on-demand)
* [How do I set up Product Reviews?](/guide/reviews/set-up-product-reviews)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How to set up cart drawer?](/guide/cart-drawer/how-to-set-up-cart-drawer)
---
# How do I configure the product list? (https://docs.sledge-app.com/guide/settings/product-list-controlling-search-sorting-and-stock-rules-in-every-grid)
The product list is the grid around the cards — the toolbar, sorting, paging, and stock rules used by instant search, the search page, collection pages, and the wishlist. One page controls them all.
## Before you start [#before-you-start]
These settings shape what Sledge renders on your storefront, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **The Collections page surface is turned on.** Open **Sledge → Tools → Product Filter** and check the **Collections page** switch — collection pages are where these settings are most visible, since Sledge renders the product grid there.
## Open Product List [#open-product-list]
Go to **Sledge → Settings & Support**, open **Global setting**, and click **Product List**.
### List behavior [#list-behavior]
* **Show search bar** — a search field above the product list.
* **Show loading icon when filtering** — a loading indicator while filters update the products.
* **Show out of stock products** — include sold-out items in the list.
* **Move Sold Products to the end of product listing** — keep sold-out items visible but push them after everything in stock.
* **Show total products** — the product count above the list.
* **Show switch view** — let customers flip between list and grid layout.
### Sort [#sort]
The **Sort** switch turns the sort control on. **Sort options list** picks which options customers can choose (Availability, Best selling, Featured, Newest, Oldest, Name A–Z / Z–A, Lowest / Highest price), and **Default sort** sets what the list opens with. Three refinements below: **Set featured as collection default sort** (collections open in your curated order), **Set newest as last published**, and **Show selected sort on mobile**.
### Limit [#limit]
The **Limit** switch exposes the per-page selector. **Limit list** defines the choices (12, 24, 36, 48, 120 — **Add custom** adds your own), and **Default limit** is what the list starts at. Below it, **Hide products by tags** can exclude products matching selected hidden tags from every list.
### Preview [#preview]
The preview renders a full collection grid with your settings — toolbar with Filter and sort, search bar, per-page selector, and view switcher.
## Result [#result]
Every Sledge product grid — instant search, the search page, collection pages, and the wishlist — behaves the same way: your sort options, your paging, your stock rules.
Not showing up? Give the change a minute to sync, then reload the page, and confirm Sledge Core and the Collections page switch are on as described above.
## Related [#related]
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
* [How do I set up skeleton loaders?](/guide/settings/skeleton-loaders-keeping-your-layout-steady-while-products-load)
* [How do I keep Sledge in sync with my Shopify catalogue?](/guide/settings/indexing-keeping-sledge-in-sync-with-your-shopify-catalogue-automatically-and-on-demand)
* [How do I set up a filter group?](/guide/filter/how-to-set-up-filter-group)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How to set up cart drawer?](/guide/cart-drawer/how-to-set-up-cart-drawer)
---
# How do I set up skeleton loaders? (https://docs.sledge-app.com/guide/settings/skeleton-loaders-keeping-your-layout-steady-while-products-load)
Skeleton loaders are the grey placeholder blocks shown while products load. Instead of a blank space or a layout jump, customers see the shape of the grid immediately — then products fade in.
## Before you start [#before-you-start]
These settings shape what Sledge renders on your storefront, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **The Collections page surface is turned on.** Open **Sledge → Tools → Product Filter** and check the **Collections page** switch — collection pages are where these settings are most visible, since Sledge renders the product grid there.
## Open Skeleton [#open-skeleton]
Go to **Sledge → Settings & Support**, open **Global setting**, and click **Skeleton**. These settings apply to all Sledge features on your store.
### Settings [#settings]
* **Enable skeleton** — show loading skeleton placeholders while data is loading. Turning it off means content areas stay empty until data arrives.
* **Main color** — the placeholder colour (#E5E7EB in the example, a light grey). Match it to your theme’s background tones so the loading state feels native.
### Preview [#preview]
The preview shows the skeleton grid exactly as customers see it during loading — image blocks, text lines, and price stubs in place of the real cards.
## Result [#result]
While any Sledge widget fetches data — a filtered collection, search results, recommendations — customers see your skeleton placeholders instead of a blank area, and the layout doesn’t jump when products arrive.
Not showing up? Give the change a minute to sync, then reload the page, and confirm Sledge Core and the Collections page switch are on as described above.
## Related [#related]
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
* [How do I configure the product list?](/guide/settings/product-list-controlling-search-sorting-and-stock-rules-in-every-grid)
* [How do I keep Sledge in sync with my Shopify catalogue?](/guide/settings/indexing-keeping-sledge-in-sync-with-your-shopify-catalogue-automatically-and-on-demand)
* [How to set up cart drawer?](/guide/cart-drawer/how-to-set-up-cart-drawer)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How do I set up a filter group?](/guide/filter/how-to-set-up-filter-group)
---
# Wishlist (https://docs.sledge-app.com/guide/wishlist)
---
# How to set up the Wishlist view? (https://docs.sledge-app.com/guide/wishlist/set-up-the-wishlist-view)
Wishlist view controls what customers see when they open their wishlist — whether it’s a slide-out drawer or a full page, where the wishlist counter sits in your store, and which surfaces show the wishlist heart.
## Before you start [#before-you-start]
The wishlist renders on your storefront through Sledge, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Wishlist is turned on.** Open **Sledge → Tools → Wishlist** and check the **Wishlist** switch at the top — it activates the whole wishlist experience on your storefront.
## Open Wishlist view [#open-wishlist-view]
Go to **Sledge → Tools → Wishlist**, and under **Features** click **Wishlist view**.
### Wishlist experience [#wishlist-experience]
**Choose one** decides how the wishlist opens: **Wishlist page** (a full page at `/apps/sledge/wishlist` , the current choice) or the **flyout drawer** — a side-out panel that stays in context while customers browse. Note the info banner: the product list and product card styling used here are configured in **Settings & Support → Global setting**, not on this page.
### Counter position [#counter-position]
Where the wishlist counter (the saved-items number) appears:
* **None (show in nav)** — no floating bubble; the counter sits next to your existing nav link (the current choice — see the heart badge in the storefront header below).
* **Left / Right** — a floating bubble on that edge of the viewport.
* **Bottom left / Bottom right** — a fixed bubble positioned above chat or app widgets.
### Surfaces [#surfaces]
Which surfaces show the wishlist heart on product cards: **Collection Page**, **Product Page** (with a placement confirmation), **Search Page**, **Instant Search**, and **Cart Drawer** — each with its own switch.
### Status and Preview [#status-and-preview]
**Status** turns the view on; the **Preview** renders the wishlist page as the storefront library draws it — heading, product search, **Clear all wishlist**, the per-page selector, and the sort control, filled with saved products.
## Result [#result]
On the storefront, customers open their wishlist from the heart in your navigation (the counter shows their saved count) and land on the wishlist page — their saved products with hearts to un-save, search, sorting, and a Clear Wishlist action:
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the feature’s **Status** is Enable, and that Sledge Core and the Wishlist switch are on as described above.
## Related [#related]
* [How do I set up Wishlist actions?](/guide/wishlist/set-up-wishlist-actions)
* [How to set up cart drawer?](/guide/cart-drawer/how-to-set-up-cart-drawer)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
* [How do I configure the product list?](/guide/settings/product-list-controlling-search-sorting-and-stock-rules-in-every-grid)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)
* [How do I set up Recently Viewed?](/guide/recommendations/set-up-recently-viewed)
---
# How do I set up Wishlist actions? (https://docs.sledge-app.com/guide/wishlist/set-up-wishlist-actions)
Wishlist actions controls how customers save products — whether they must log in, how the save button behaves, and the confirmation they see after saving.
## Before you start [#before-you-start]
The wishlist renders on your storefront through Sledge, so make sure of the following first:
1. **Sledge Core is enabled on your theme.** Sledge Core is the app embed that loads Sledge on your storefront — without it, nothing you configure here reaches your customers. You enable it during onboarding (**Enable in theme**), or any time via **Online Store → Themes → Customize → App embeds → Sledge Core**.
2. **Wishlist is turned on.** Open **Sledge → Tools → Wishlist** and check the **Wishlist** switch at the top — it activates the whole wishlist experience on your storefront.
## Open Wishlist actions [#open-wishlist-actions]
Go to **Sledge → Tools → Wishlist**, and under **Features** click **Wishlist actions**.
### User access [#user-access]
* **Require login** — customers must sign in before saving. Logged-in wishlists follow the customer across devices; with this off, the wishlist lives in the browser. When it’s on, guests see a “Login required” prompt instead of a save.
* **Single toggle** — one heart button both adds and removes: tap to save, tap again to un-save.
* **Variant level** — save a specific size or colour rather than the product in general, so “M, Sage” is what lands in the wishlist.
### Notification [#notification]
The confirmation shown right after an item is added:
* **Show toast** — pop a small confirmation so customers know the save worked.
* **Message** — the toast’s text (“Add to wishlist” in the example).
* **Toast placement** — where it appears: **Bottom left**, **Bottom center**, or **Bottom right**.
### Surfaces [#surfaces]
Where the save action is available: **Collection Page**, **Product Page** (with placement confirmation), **Search Page**, and **Instant Search** — each with its own switch.
### Status and Previews [#status-and-previews]
**Status** turns the actions on. The preview panels render each piece live: the product card with its heart button, the **Require login** prompt guests would see, and the **Show toast** confirmation with your message and placement.
## Result [#result]
Customers tap the heart on any enabled surface to save a product — the toast confirms it, the counter in your navigation ticks up, and the item appears in their wishlist ready for a later purchase.
Not showing up? Give the change a minute to sync, then reload the page. Also confirm the feature’s **Status** is Enable, and that Sledge Core and the Wishlist switch are on as described above.
## Related [#related]
* [How to set up the Wishlist view?](/guide/wishlist/set-up-the-wishlist-view)
* [How to set up cart drawer?](/guide/cart-drawer/how-to-set-up-cart-drawer)
* [How do I configure the product card?](/guide/settings/product-card-choosing-what-every-product-tile-shows-across-your-store)
* [How do I configure the product list?](/guide/settings/product-list-controlling-search-sorting-and-stock-rules-in-every-grid)
* [How do I set up Recently Viewed?](/guide/recommendations/set-up-recently-viewed)
* [How do I set up Best Seller recommendations?](/guide/recommendations/set-up-best-seller-recommendations)