> For the complete documentation index, see [llms.txt](https://help.dollarlabs.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.dollarlabs.io/dollarback-store-credit/widgets-and-storefront/checkout-and-thank-you-widgets.md).

# Checkout & thank-you widgets

{% hint style="info" %}
**Plan:** the two checkout blocks require **Shopify Plus** (Shopify only allows checkout customization on Plus). The two thank-you page blocks work on all Shopify plans.
{% endhint %}

{% embed url="<https://dollarlabs.neetorecord.com/watch/c8d6c712c04f95c6091c>" %}

\_This article's section starts at 11:06 in the video.\_

Four blocks cover the purchase moment: two in checkout (what this order earns, and a chance to redeem rewards) and two on the thank-you page (confirmation of the credit earned, and a referral invite). When you're done here, all four are placed and speaking your brand's language.

## At a glance

| Touchpoint                  | Surface               | What it shows                                                                              | You can customize                                                                                            |
| --------------------------- | --------------------- | ------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------ |
| Checkout cashback           | Checkout block (Plus) | Cashback the order will earn; order-goal progress; discount reward notices                 | Message templates per state                                                                                  |
| Checkout reward marketplace | Checkout block (Plus) | Balance plus redeemable rewards (order / product / shipping); redeem and copy-code actions | Heading, balance label, per-reward-type templates, minimum-order note, button labels, success/error messages |
| Thank-you cashback          | Thank-you block       | Credit earned on the order just placed, expiry note, goal-earned message                   | Title, heading, body/expiry/loading messages                                                                 |
| Thank-you referral          | Thank-you block       | Referral invite with copyable link, in separate guest and logged-in states                 | Headings, body copy, button and clipboard text                                                               |

## Prerequisites

* A live cashback program; for the marketplace block, at least one active reward; see [Set up the reward marketplace](/dollarback-store-credit/spending-store-credit-and-rewards/set-up-the-reward-marketplace.md).
* For the checkout blocks: a Shopify Plus store.

## Step 1. Place the blocks in the checkout editor

1. In Shopify admin, go to **Settings → Checkout** and open the checkout editor for your published checkout profile.
2. On the **Checkout** page of the editor, add the app blocks **Checkout Cashback Banner** and **Checkout Reward Marketplace** where you want them (the order summary column is a common spot).
3. Switch the editor's page selector to the **Thank you** page and add **Thank You Cashback** and **Thank You Referral**.
4. Save. On non-Plus stores, skip step 2; only the thank-you page accepts blocks.

## Step 2. Customize each block's messages

Each block has its own editor under **DollarBack admin → Customization**, in the **Checkout** group. Variables in curly braces fill in per order.

**Cashback at checkout**

| Field                           | Variables                                       |
| ------------------------------- | ----------------------------------------------- |
| Cashback earned message         | `{amount}`                                      |
| Order-goal progress message     | `{remainingAmount}`, `{nextAmount}`             |
| Order-goal tier reached message | `{amount}`, `{remainingAmount}`, `{nextAmount}` |
| Order-goal max reached message  | `{amount}`                                      |

The goal messages give checkout a last-second upsell: "Add {remainingAmount} more to earn {nextAmount} back" can still change the order.

**Checkout reward marketplace**

| Field                                  | Variables             |
| -------------------------------------- | --------------------- |
| Section heading, Balance label         | (none)                |
| Reward template (order discount)       | `{amount}`, `{value}` |
| Reward template (product discount)     | `{amount}`, `{value}` |
| Reward template (free shipping)        | `{amount}`            |
| Minimum-order note                     | `{minAmount}`         |
| Redeem button, Copy code button        | (none)                |
| Success message, Generic error message | (none)                |

Redeeming here mints the discount code on the spot; the customer copies it and applies it in the same checkout.

**Thank you page cashback**

| Field              | Variables     |
| ------------------ | ------------- |
| Confirmation title | `{amount}`    |
| Cashback heading   | `{amount}`    |
| Expiration message | `{expiresAt}` |
| Loading text       | (none)        |

**Thank you page referral**

| Field                                                           | Variables                 |
| --------------------------------------------------------------- | ------------------------- |
| Referral heading                                                | (none)                    |
| Referral message                                                | `{amount}`                |
| Copy button label                                               | (none)                    |
| Logged-out title / Logged-out message / Logged-out button label | `{amount}` in the message |

The referral block has two states: signed-in customers see their code and a copy button; guests see the logged-out copy prompting them to create an account first.

## Verify it works

1. Place a test order as a signed-in customer with some credit.
2. In checkout, confirm the cashback banner shows the right amount and the marketplace lists your rewards.
3. On the thank-you page, confirm the earned amount, the expiry note, and the referral invite with a copyable code.

## Common issues

* The checkout blocks aren't available in the editor: the store isn't on Shopify Plus, or the blocks weren't added to the published checkout profile.
* The marketplace shows no rewards: no reward is active, or the customer's balance is below every reward's cost. See [Set up the reward marketplace](/dollarback-store-credit/spending-store-credit-and-rewards/set-up-the-reward-marketplace.md).
* A redeemed code won't apply: check the store-wide combination rules. See [A reward discount code isn't working](/dollarback-store-credit/troubleshooting-and-faq/reward-discount-code-isnt-working.md).
* The cashback amount at checkout differs from what lands: discounts and caps apply at calculation. See [How cashback is calculated](/dollarback-store-credit/earning-cashback-programs/how-cashback-is-calculated.md).

## Related articles

* [Customer account blocks](/dollarback-store-credit/widgets-and-storefront/customer-account-blocks.md)
* [Set up the reward marketplace](/dollarback-store-credit/spending-store-credit-and-rewards/set-up-the-reward-marketplace.md)
* [Discount combination rules](/dollarback-store-credit/spending-store-credit-and-rewards/discount-combination-rules.md)
* [How customers share referral links](/dollarback-store-credit/referral-program/how-customers-share-referral-links.md)