Articles on: Loyalty on the Storefront

Customer Account Loyalty Page

This placement is only applicable if you are using (New) Customer accounts. If you're using Legacy customer accounts add this block: //TODO article

If you're using Legacy customer accounts, add this block instead: Legacy Customer Account: Account balance, ways to earn & redeem

Overview

You can create a dedicated page for the loyalty program in customer accounts. On this page your customers can see their loyalty point balance, redeem rewards and earn points. You can link to this page from other places within customer accounts, your storefront and emails.

How it works?

This dedicated page has 4 sections:

Loyalty program card: Shows the customer's point balance and their progress
Existing rewards: Shows rewards that were redeemed but not used yet. This section is hidden if there are no unused rewards
Redeem rewards: Shows the rewards that you've set up in the app admin
Earn points: Shows the ways to earn earn points

Existing rewards

****

In this section the customer can can see the rewards they previously redeemed but haven't used yet. By clicking the "View discount code" button they can copy the discount code to use it on a purchase.

Redeem rewards

If the customer has enough loyalty points for a reward they can redeem it by clicking the "Redeem" button, this will generate a discount code for them that they can use on their next purchase.

To further motivate customers to make purchases they can see a progress bar on rewards that they can't purchase yet showing the number of loyalty points needed to reach the reward.

Earn points

In this section customers can see the ways they can earn points. Ways to earn that were already completed are marked with a checkmark.

They can also earn points here by completing social media actions and add their birthday here if birthday rewards are configured.

How to set up?

To show a dedicated page for the loyalty program in the customer account you'll need to add the "Loyalty Account Page" app block in the checkout editor:

Go to Shopify Settings > Checkout and click the "Customize" button to open the checkout editor

On the left click the "Apps" icon and click the "+" sign next "Loyalty Account Page" app block
Select the "Accounts" placement

(Optional) You can add the page to the Customer account menu by clicking "Add to menu" on the top left

Save the changes

In the checkout editor the blocks will appear to be loading due to the limitations of the preview. However they will work as expected if you check it on the storefront

Change texts

You can change the texts of the "Loyalty Account Page" app block in the app admin on the "Customize storefront > Loyalty Account Page" page.

Updated on: 08/01/2025

Was this article helpful?

Thank you!