F12 Labs
EN
Contact
DiscountlyInstall on Shopify
Documentation

Discountly documentation / Checkout

Checkout extensions (Shopify Plus)

Discountly's two checkout extensions for Shopify Plus stores. The free-gift code field (how a gift code adds its item, when the field shows, backups, removing the code, its settings) and the volume price display under each checkout line, with how to add both and troubleshooting.

Discountly has two optional extensions for Shopify's checkout:

Extension What it does
Free-gift code field Lets shoppers enter a code for a Buy X get Y or free gift discount. The field adds the free item, then applies the code
Volume price display Under each discounted line, shows the original price struck through and the price the shopper pays per item

Both need Shopify Plus. Shopify only lets Plus stores add apps to the information, shipping and payment steps: "Checkout UI extensions for the information, shipping, and payment steps are available only to stores on a Shopify Plus plan" (Shopify: checkout UI extensions). They come with every Discountly plan. Gift codes only matter on Starter and Pro, since that's where Buy X get Y and free gifts are.

On other Shopify plans, Store setup labels the Checkout group Shopify Plus only, and Buy X get Y and free gift discounts are automatic only.

Add them to checkout

Discountly can't see whether you've placed them, so Store setup always shows Not tracked for both.

  1. On Discountly's Discounts page, scroll to Store setup and click Open checkout editor. Or, in Shopify, go to Settings → Checkout and click Edit next to your checkout configuration.
  2. Open the Sections sidebar and click Add block in the order summary.
  3. Pick Discountly checkout gift for the free-gift code field. It sits under the list of items. Pick Discountly volume price for the volume price display. It appears under each item.
  4. Click Save.

These are Shopify's steps; see Shopify: checkout apps.

The free-gift code field

Why gift codes need their own field

A Buy X get Y or free gift discount makes an item free. With an automatic discount, Discountly's cart embed puts the item in the cart before checkout. With a code, nothing knows to add the item until the shopper types the code, and that happens at checkout, after the cart embed has done its work.

Shopify's own Discount code box can't help: it accepts or refuses a code, but doesn't add items. A code whose only effect is a free item that isn't in the cart yet has nothing to apply to.

Discountly's field fixes that. When a shopper enters a gift code there, the field:

  1. Adds the free item to the order.
  2. Applies the code, which now has something to make free.

So shoppers enter gift codes in this field, not in Shopify's Discount code box. The field's help text says so by default.

Set up a gift code

  1. Create a Buy X get Y or free gift discount.
  2. Choose Discount code instead of Automatic discount, and enter the code, for example FG-TOTE. On Shopify Plus the choice is open for these two types.
  3. Save it live.
  4. Add the free-gift code field to checkout, as above.
  5. Share the code. Tell customers to enter it in the gift code field, after ticking the box above it.

Codes aren't case-sensitive: fg-tote works for FG-TOTE.

What shoppers see

The field only shows when the cart qualifies for at least one of your live gift codes. If nothing in the cart could earn a free item, there's nothing to show, and the field stays hidden so shoppers don't confuse it with the Discount code box.

When it shows:

  1. A checkbox: Have a code for a free gift offer (FG-XXXX)?
  2. Ticking it opens Free item code and an Apply button, with the help text "Enter your code to add your free item. Regular discount codes go in the Discount code field below."
  3. The shopper enters the code and clicks Apply. The free item appears in the order summary at $0, and the field hides itself.

Messages the shopper may see:

Message Why
Sorry, this free gift is currently out of stock. The cart qualifies, but the gift and its backup are both out of stock. The code isn't applied
This code's terms aren't met by your cart yet. Shopify refused the code, for example because the cart doesn't reach the discount's minimum
Couldn't apply the promo code. Shopify refused the code after the item was added. The item is taken out again

A regular discount code entered in this field works too: it's passed to Shopify as if typed in the Discount code box.

When does the cart qualify

The field checks the cart the way the cart embed does:

  • Buy X get Y: the cart has a trigger product. The field doesn't count Customer buys quantity; Shopify checks that when the code is applied. The field can tell this for All products and for discounts that pick specific products or variants with the older Pick specific products or variants mode. See the caveat below for By criteria.
  • Free gift: the cart reaches Minimum order subtotal. The field adds up the cart's items at their current prices, leaving out free items.
  • Eligibility: discounts limited to Customers with tags or Logged-in customers never show the field, since checkout can't check those before the code is applied.

Shopify still makes the final check when the code is applied. If the discount's settings don't allow it, Shopify refuses the code and the field takes the item back out.

Gift codes with criteria targeting

For Buy X get Y gift codes, the field recognises trigger products only when Targeting is All products, or when the logic block uses the older Pick specific products or variants mode. With Specific products chosen By criteria (product type, tag, collection, metafield and so on), the field can't tell which cart items are triggers, so it doesn't show.

If you need a gift code on a criteria-targeted Buy X get Y, test it on a checkout first. If the field doesn't appear, make the discount automatic instead.

Out of stock and backups

Before adding an item, the field checks it's available. If the gift (or Buy X get Y reward) is out of stock, it uses the backup you picked on the discount. If both are out, the shopper sees "Sorry, this free gift is currently out of stock." and the code isn't applied. With Reward target set to Same as trigger products there's no backup: an out-of-stock variant gets no reward.

Removing the code

If the shopper removes the code in Shopify's order summary, the field takes the free item out too. If they change the cart so it no longer qualifies, the item comes out on the next update.

Automatic gifts that stop being free at checkout

The field also tidies up after the cart embed. Sometimes a free item added in the cart loses its discount at checkout: for example, the shopper enters an email that makes another discount apply, one that doesn't combine with the gift. The item would then be charged at full price. When that happens, the field removes the item after a moment.

This only works on checkouts where the field is added. It removes an item only when it has no discount on it at all.

Change the wording

In the checkout editor, click the Discountly checkout gift block to change its three settings. Leave one blank to keep the default.

Setting Default
Toggle label Have a code for a free gift offer (FG-XXXX)?
Code field label Free item code
Help text Enter your code to add your free item. Regular discount codes go in the Discount code field below.

If your codes don't follow an FG- pattern, change Toggle label so the hint matches them.

The volume price display

Shopify's checkout shows each line's price, but not the price per item after a volume discount. The volume price display adds a line under each discounted item:

  • The price before the discount, struck through: the compare-at price if the variant is on sale, otherwise its regular price.
  • The price the shopper pays per item, in red.

For example, a $40 hoodie bought at the 4+ tier for 15% off shows $40.00 $34.00 under the line.

It shows only on lines whose price per item is below the variant's price. Lines with no discount, and items that are only on sale, already read correctly in Shopify's checkout, so they get nothing extra. Free gifts and Buy X get Y rewards are skipped too, so they don't read "$11.99 → $0.00".

There are no settings. It works from any line-level discount that lowers the price per item, not only volume pricing, so a Discountly product discount shows the same way.

Troubleshooting

The gift code field doesn't show.

  • Check the store is on Shopify Plus and the Discountly checkout gift block is saved in your live checkout configuration.
  • Check the discount is live and uses a Discount code. Automatic discounts don't use the field.
  • Check the cart qualifies (trigger product in the cart, or the minimum reached). The field stays hidden otherwise.
  • Limited to tagged or logged-in customers, or a Buy X get Y targeted By criteria? See When does the cart qualify.

The shopper typed the code in the Discount code box and it was refused. That's expected for gift codes. Ask them to tick the gift code box and enter it there.

The free item was added, then removed. Shopify refused the code. Usually the cart doesn't meet the discount's settings: its minimum, schedule, usage limit, or combinations with a code already applied.

The volume price doesn't show. The line has no discount lowering its price per item, or the block isn't in your live checkout configuration. Check the line's total in the order summary is below price × quantity.