# How to let shoppers choose their free gift in a pop-up or with a button

> When a gift tier offers several products or variants, a gift chooser pop-up lets the shopper pick. It opens on its own or from a “Choose a gift” button.

Updated 2026-09-25 · https://www.yaco.studio/docs/gift-chooser

## When the gift chooser appears

The gift chooser is a pop-up (modal) listing the gifts a shopper has unlocked. It is used when a gift tier offers more than one product or variant. How it appears is set per tier, in the tier card under **Auto add gift to cart** (see [free gift](https://www.yaco.studio/docs/free-gift)):

| Option | What the shopper sees |
|---|---|
| **Auto show Gift modal** | The chooser opens by itself when the tier is reached. A gift with a single variant is simply added to the cart. |
| **Show "Choose a gift" button** | A button under the bar opens the chooser. Only for tiers with several gifts. |
| **Show gift list in the progress bar** | No pop-up: the gifts are listed inside the bar and added in one click. |
| **Disable modal & button** | Yaco Progress Bar adds nothing. Use it when another app adds the gift. |

When several gift tiers are reached at once, a single pop-up opens with one section per tier.

## What happens when the shopper closes it

**No thanks**, the Escape key or a click outside the pop-up close it for the current browsing session. It does not open again on its own until a new tier is reached. The **Choose a gift** button, if shown, stays available to reopen it.

Closing is not a refusal; the only lasting refusal is removing the gift from the cart. To make the choice mandatory, tick **Hide 'No thanks' button**.

## Where to change its look and texts

**1. Design › Gift interface** (in the app):

- **"Choose a gift" button**: **Show Gift button**, **Allow changing the gift after selection** (the button stays visible and reopens the chooser), CSS classes to reuse your theme's button style, font size, colours, border and padding.
- **Gift modal**: **Title font size (desktop)**, **Title font size (mobile)**, **Bold title**, **Group variants by product** (one card per product with a variant menu instead of one card per variant) and **Hide 'No thanks' button**.
- Gift list style, and custom CSS for the pop-up and the list.

**2. Theme editor**: in the Shopify admin, open **Online Store › Customize**, then **App embeds › Yaco Progress Bar**. The **Gift modal** section holds the colours (pop-up background, gift card background and border, add-to-cart button colours) and the default texts: **Title**, **Subtitle template**, **Gift list title**, **2+ Gifts list title**, **"Free" label**, **"Sold out" label**, **"Gift no longer available" message**, **"Add to cart" button** and **"No thanks" button**. The **Choose a gift button** section holds the button's **Button label**.

**3. The tier card**: **Gift button text** sets the button label for that tier, and the **Gift modal texts** card overrides the title, subtitle and list titles for that tier. Use **{price}** in the subtitle for the tier threshold and **{quantity}** in the list title for the number of gifts to pick. These texts apply when the pop-up shows only that tier. When it groups several tiers, the texts from the theme editor are used. Empty fields fall back to the theme editor texts too.

## Sold-out gifts

The chooser checks stock again each time gifts are offered, at most once a minute:

- a gift that sells out is marked **Sold out** and can no longer be picked;
- a gift already selected that sells out is removed from the selection, with the **"Gift no longer available" message**;
- the number of gifts on offer follows real stock: a tier promising 2 gifts offers only 1 if only one unit is left, and the title adjusts.

No limit applies when a variant does not track inventory or can be sold out of stock. To check stock, the app asks for Shopify's permission to read product inventory, and only reads the quantities of your gift products.

## Translating the chooser

Tier texts are translated from their own fields (see [translations](https://www.yaco.studio/docs/translations)). Texts set in the theme editor are translated in Shopify's **Translate & Adapt** app.

If a gift never reaches the cart, see [gift not added](https://www.yaco.studio/docs/gift-not-added).