The Redeem Rewards block lets customers spend their points on a reward without leaving the Account Sidebar. They pick a reward, confirm, and receive their discount code in place.
This block is visible to all customers. Guests will see the rewards available to redeem but need to sign in before they can spend points.
How to Configure the Redeem Rewards Block
From your Shopify admin, open the Mage Loyalty app.
In the left menu, click Account Sidebar.
Click the Blocks tab.
Find the Redeem Rewards block and click on it to expand its settings.
Make sure the block toggle is turned on.
Fill in the Section Title, pick a Display Style, and choose whether to enable Display product rewards only (see Field Reference below).
Click Save.
Note
Only rewards that are active in your loyalty program will appear. To manage your rewards, go to Loyalty → Rewards.
Field Reference
Field | What It Does | Example |
Section Title | The heading shown above the block on the storefront. | "Redeem your points" |
Display Style | How the rewards are presented. Choose Scroll for a swipeable row of reward cards, or Dropdown for a compact single-select picker. | "Scroll" |
Display product rewards only | When on, hides discount-based rewards (percentage off, fixed amount, free shipping) and shows only free-product rewards. Useful if you want the sidebar to feel more like a product catalogue. | Off |
Common Mistakes to Avoid
Common Mistake
Turning on "Display product rewards only" when you have no free product rewards configured: the block will appear empty. Make sure you have at least one active free-product reward before enabling this toggle.
Common Mistake
Using a vague section title: titles like "Rewards" or "Block" don't tell customers what they can do. Use action-oriented copy like "Redeem your points".
Common Mistake
Choosing Dropdown when you only have one or two rewards: the dropdown adds an extra click for no benefit. Use the Scroll display style when your reward catalogue is small.
CSS Reference
If you're styling the Redeem Rewards block from your theme stylesheet or the sidebar's custom CSS field, these are the most useful classes the block exposes.
Class | What it targets |
| The outer section wrapper. |
| The section title (your Section Title text). |
| Empty state shown when no rewards are available. |
| A reward's name in the scroll layout. |
| Points-cost / status label for each reward. |
| Reward image thumbnail. |
| Placeholder tile shown when a reward has no image. |
| Wrapper around the dropdown (dropdown display style only). |
| The dropdown control itself. |
| The currently-selected reward shown inside the dropdown control. |
| The open dropdown menu listing all available rewards. |
| A single row inside the open dropdown menu. |
| The chevron indicator on the dropdown control. |
| Container for the discount code shown after a successful redemption. |
| The discount code text itself. |
| Hint text shown beneath the discount code. |
Troubleshooting
The block is enabled but shows "No rewards available"
Confirm you have at least one active reward under Loyalty → Redeeming Points.
If Display product rewards only is on, make sure at least one free product reward is active.
A customer can't redeem a reward
Customers must be signed in to redeem. Guests can see the block but cannot spend points.
Check the customer has enough points for the reward they're trying to redeem.
Still need help or can't find the answers you're looking for? Reach out to the Mage Loyalty team through our live chat support.