How to set the success message shown when all cart tiers are reached

How the message line works

The bar has one message line, above or below it. While a tier is still ahead, it shows that tier's own text, for example “Only $12 left for free shipping” (you write that text in the tier card, see add a tier). Once every tier on the bar is reached, the line switches to the success message. When the design stacks the bars (see design), each bar has its own message line.

The success message belongs to a design. Open Design, pick the design, then the Success message tab. Each design can have its own message. The same tab is also on the Goals & Discounts page.

Write the message

In the Default success message card, type your text in Default message, for example “🎉 Congratulations! You've unlocked {goals}.”

• {goals} is replaced by the names of the tiers the shopper unlocked, for example “free shipping, a free tote bag and 10% off”.
• Default link word is the word placed before the last name (“and” by default). Change it if your message is not in English.
• When several discount tiers are reached, only the latest one of each kind (percentage or amount) is listed, since it replaces the lower ones.
• The editor accepts bold, italics, colours and line breaks. When the text holds formatting, the eraser (Clear formatting) and </> (Edit HTML) buttons turn black as a reminder.

Two preview buttons help you check the result: Show first goal message shows the bar as it looks with an empty cart, and Show Congratulations message shows it with every tier reached.

Show or hide the message

There are two separate switches:

• Show success message, at the top of the tab, shows or hides the whole message line: the tier texts and the final message.
• Show success message inside the Default success message card hides only the final message. The tier texts keep showing while tiers are ahead.

Position and style

• Position: Before the bar or After the bar.
• Text align: Start, Center or End.
• Font size, Line height, Header text color, Top margin and Bottom margin.
• Always show decimals: when ticked, the amount left in the tier texts keeps its decimals even when it is round (“$5.00 left” rather than “$5 left”).
• Round amounts to whole numbers: when ticked, every amount of the bar drops its cents and Always show decimals is greyed out. Thresholds and the amount left are rounded up, the cart total and discounts rounded down; tiers still unlock at their exact threshold, and AI assistants and screen readers still read the exact amounts. See design.

Hide the bar once every tier is reached

Under All goals reached, tick Hide the progress bar when all goals are reached to show only the success message at that point. The bar comes back if the cart drops below a tier. If the success message is empty, the bar stays visible so the shopper never sees an empty block.

Give each bar its own success message

With stacked bars, a line switches to a success message as soon as every tier of its bar is reached, while the other bars keep counting. By default it is the design's success message, with {goals} listing only that bar's tiers.

To write a message for one bar, open Goals & Discounts, tab Bars, open the bar, then fill Bar success message in the Success message card, for example “Free shipping unlocked!”. Translate it from the icon at the end of the field. Leave it empty to use the design's message. Bars chained on one line show the message of the last bar on the line. Side by side, this message is not used: the design's message shows once every tier of every bar is reached.

Translate the message

The message and the Default link word are translated from their own fields: click the translate icon at the end of the field, then Translate across markets or Adapt a market. Each design keeps its own translations. The design created at install already has the message in your main language and translated into your store's other languages. A design that still has the default English message, unchanged and untranslated, shows it in the shopper's language, on the storefront and at checkout. Once you edit the text, it shows exactly as you wrote it, so translate it yourself. When your store has several designs, the title of the Default success message card shows the name of the design you are editing.

Pick a language in the preview's Language selector to check the translated message. A message translated earlier in Shopify's Translate & Adapt app was copied to your designs, so you have nothing to redo. See translations for the other texts of the bar.

At checkout

The checkout block has its own switch, Show final success message, with its own alignment, on the Checkout page. At checkout, the message follows the customer's language, with the same translations as the storefront. See checkout.