Shopify appAndOr Discount, Checkout Rules

Show your deals. Grow your revenue.

Most Shopify discounts only show up at checkout. AndOr shows your deals on your product pages, collections and cart. Then it nudges shoppers to the next tier, so they add more and your average order value grows.

Built on Shopify Functions. Set up in two steps.

  • 1Discount
  • 2Storefront widgets
  • 3Upsell offer

A product page for a stoneware mug, taken apart into its three promotion parts: the discount (up to 15% off), the storefront widgets (tier cards: 2 mugs save 10%, 3 mugs save 15%), and the upsell offer ("Add 1 more and save 15%").

The widgets your promotions need. See all widgets

What shoppers see

Deals your shoppers can't miss.

AndOr on the product page, in related products and in the cart drawer.

  • A free shipping bar and an upsell offer right in the cart drawer, plus suggestions that complete the look. Shoppers add them in one click.

    Upsell offers
Changes every few seconds
A shopper on a sofa looking at her phone
What you can grow

Raise average order valuewith the deals you run.

AndOr shows each deal on your store, nudges shoppers to add more, and reports what every promotion and offer adds.

AndOr Analytics
Average order value$86.40
Conversion rate7.4%
Added revenue$4,212
Adds to cart1,048
Average order value, last 30 days
For every kind of store

Made for what you sell.

The features that fit each kind of store.

The problem

Shoppers can't buy a deal they can't see.

Most Shopify discounts only show up at checkout. Until then your product pages show full price, and shoppers have no reason to add more. AndOr adds the two missing parts from one promotion.

Your adminYour store

Volume discount

Promotion · All products

Live
1
DiscountBuy 2 save 10%, buy 3 save 15%. Applied at checkout.
2
Storefront widgetsSale price and tier cards on the product page
3
Upsell offer"Add 1 more and save 15%" under the tiers
Revenue from upsell offers
$2,847
Add rate
33%
Visits
1,204

Switch a part off to see what shoppers lose.

Stoneware mug

$28.00Up to 15% off

Add 1 more and save 15%

Add to cart
  1. 1
    Discount

    Volume tiers, bundles, Buy X get Y, gifts and order goals, applied by Shopify Functions at checkout.

  2. 2
    Storefront widgets

    Sale prices, badges, countdowns and banners put the deal where shoppers decide.

  3. 3
    Upsell offer

    Tiers, bundles, gifts and goals give every cart a reason to grow. You see the revenue each one adds.

2 Storefront widgets

Your deals, in plain sight.

Sale prices, savings badges, countdowns and banners show your discounts on product, collection and cart pages. They read your live discounts, so what shoppers see is exactly what checkout charges.

--andor-color-accent: #B4441E; --andor-radius: 8px;
3 Upsell offers

Give every cart a reason to grow.

Volume pickers, goal suggestions, bundles, Buy X get Y and free gifts turn a discount into a bigger order. Show them on the product page, the cart page or the cart drawer. Try them here. They work the same way on your store.

--andor-color-accent: #B4441E; --andor-radius: 8px;
  • Add 1 more and save 15%

    Volume picker

    Tier cards that set the quantity and show what the next tier saves.

    Setup and docs for Volume picker
  • You're $27.00 away from 10% off your order

    • Cedar candle$34.00
    • Canvas tote$32.00
    • Clay bowl$36.00

    Goal suggestions

    A progress bar to the next reward, with products that close the gap.

    Setup and docs for Goal suggestions
  • Frequently bought together

    • This item: Stoneware mug$28.00
    • Clay bowl$36.00Add
    • Cedar candle$34.00Add

    Bundle price: $98.00 $83.30

    Add bundle to cart

    Bundle

    Frequently bought together, with the bundle price checkout will charge.

    Setup and docs for Bundle
  • Claim 50% off in your cart.

    Clay bowl$36.00 $18.00Claim

    Buy X get Y

    A Claim button in the cart that names the discount that wins.

    Setup and docs for Buy X get Y
  • You unlocked a free gift

    Canvas tote$32.00 FreeAdd gift

    Free gift

    A gift slot that only offers gifts this cart really gets free.

    Setup and docs for Free gift
See it live

One product page. Every promotion.

Pick a promotion, then shop the page like a customer would. Add to cart, open the drawer, claim the deal, choose the gift. This is what your shoppers will see.

Field Pottery

Stoneware mug

$28.00Buy 2+ and save 10%. Buy 3+ and save 15%.
Glaze

Add 1 more and save 10%

1

Free returns within 30 days. Ships in 2 days.

This promotion

  1. 1
    DiscountBuy 2 save 10%, buy 3 save 15%
  2. 2
    Storefront widgetsTier cards and a savings line
  3. 3
    Upsell offerThe next saving under the tier cards

Storefront events

  1. Shop the page to see events.
Free gifts

Gifts that get added on their own.

Give a free gift when the cart reaches a goal. AndOr can add it for the shopper, or let them pick their own.

  • Free gift, added for you. The gift lands in the cart when the cart qualifies.
  • Tiered rewards. Free shipping, free gifts and money off at different cart amounts. One progress bar shows every reward.
  • Shoppers choose. A Choose gift button opens a window with every gift and its variants.
How gifts work
Tiered rewards with free shipping, gift and discount tiers
Free gift unlocked card with an Add gift button
Goal bar with free shipping, free gift and 10% off steps
Analytics

Track performance.

See the revenue your offers add, day by day.

  • Added revenue. The extra money your offers bring in.
  • Add rate. How often shoppers add the item you suggest.
  • Results per offer. See which offer works best, and which placement.
  • Works with your own widgets too. Discount results come from your orders, and your theme can credit orders to an offer.
Explore analytics
AndOr analytics cards with added revenue highlighted
Added revenue over time compared to the previous period
Match your brand

Customizable to match your brand.

Pick your brand color, a layout and a style. Widgets use your theme's fonts, so they look like they were always part of your store.

Six widgets in different brand colors and layouts
For theme developers and agencies

Go further, down to the last pixel.

Start from a style preset, then tune color, corners, type and layout for each widget. Copy the CSS, the theme settings and the Liquid into the theme.

Style preset

Accent #B4441E

Typeface

Picker layout

Most popular tag

Goal

Track

Buttons

Size

Weight

<andor-tiers>

Stoneware mug

$28.00

Add 1 more and save 15%

:root {
  --andor-color-accent: #B4441E;
  --andor-radius: 4px;
}

Paste into your theme's CSS or the app embed's Custom CSS box.

One tag per widget. With the app embed on, paste a tag anywhere in your theme and AndOr fills it in.

  • <andor-tiers></andor-tiers>Volume picker or table
  • <andor-goal></andor-goal>Order goal bar
  • <andor-price></andor-price>Sale price
  • <andor-badge></andor-badge>Savings badge
  • <andor-discount-callout></andor-discount-callout>Callout line
Built into Shopify

Feels native. Because it is.

AndOr builds on what Shopify already does well, so promotions feel like part of your store, not an add-on.

  • Native to Shopify checkoutDiscounts run inside checkout, so the price shoppers see is the price they pay.
  • Fast pagesWidgets load only where they show. Pages without one stay light.
  • Looks like your themeApp blocks you place in the theme editor. They take your fonts and colors.
  • Your wordsEdit the text shoppers see, so every message sounds like your store.

Works in your language. The app and the storefront widgets are translated into 22 languages.

Build on it

Place it, style it, script it.

No shadow DOM, no iframes, no CSS fights. Widgets render in your theme's own markup and fire plain DOM events, so you can build anything on top. Recipes for Dawn and Horizon included.

Measure itBuilt your own widget? Credit its orders to an AndOr offer and see the revenue it brings.
sections/main-product.liquid
{%- # Inside the product form. The embed must be on. -%}
<andor-tiers></andor-tiers>
assets/theme.css
:root {
  --andor-color-accent: #2C5E4A;
  --andor-radius: 14px;
}
.andor-tiers__card[aria-checked="true"] {
  box-shadow: 0 0 0 2px currentColor;
}
assets/theme.js
document.addEventListener('andor:tier:change', (e) => {
  const { currentTier, source } = e.detail;
  // source: "picker" or "table"
  console.log(source, currentTier?.quantity);
});

Clay bowl

$36.00

Storefront events
  1. andor:widget:mountThe sale price is on the page.

Read the developer guide

FAQ

Questions merchants ask.

Anything else? The docs cover setup, themes and each widget.

Read the docs
Does AndOr slow down my store?

No. Widgets read data already stored on Shopify, on your own store. Discounts run inside Shopify checkout.

Where do discounts run?

Inside Shopify checkout, through Shopify Functions, the same way Shopify's own discounts run.

Which themes work?

Online Store 2.0 themes. Widgets are theme app blocks you place in the theme editor. AndOr is tested on Dawn and Horizon.

Can shoppers pick their own free gift?

Yes. Turn on "Let shoppers choose their gift". A Choose gift button opens a window with every gift and its variants.

Where do I see results?

On the Analytics page. See added revenue, add rate and results for every promotion, upsell offer and placement.

What happens when two discounts can't be combined?

Shopify applies the best one at checkout, and AndOr tells the shopper which one wins.

I use Shopify Scripts. Can I move to AndOr?

Yes. Payment and shipping logic moves to AndOr checkout rules, and line item discounts move to AndOr discounts. Both run on Shopify Functions.

Do checkout rules work in my retail store?

No. Checkout rules apply to the Shopify online checkout only, not to Shopify POS.

Start adding revenue today.

  1. 1Turn on the app embed
  2. 2Create your first promotion
Install on Shopify