Feature Loyalty UI

Owned by da Mota Viana, Duarte Manuel
Last updated: Jun 11, 2024 by Lopes da Costa, Valentina
7 min read

Order-Level Content → Loyalty → Loyalty Configs → Feature Loyalty UI

Contents

Overview

What is Feature Loyalty UI?

This is where the Loyalty program visuals (UI) are configured. From the Loyalty logo, to background images, icons for progress bars, tier visuals, or the Loyalty QR Code page.

The level of customization allowed is big, meaning there are several configurations you can explore.

Examples

 

Editing Feature Loyalty UI

Rewards Logo

The Rewards Logo is the loyalty program logo that shows in various different places across the app.

When a customer is signed out, they see the logo in the home page, account page and sign up page:

When a customer is signed in, they see the logo in the home page, account page and loyalty history page:

Rewards Logo Inverted

No Reward Points Empty State

This empty state shows when a user logs in, has 0 loyalty points, and navigates to their loyalty account history page (/rewards/history)

 

Not Enrolled Empty State

Not Enrolled Empty State Mobile

 

No Rewards Available Empty State

 

Loyalty Banner Configuration

 

Call to Action Buttons

Button on the Homepage - Authenticated

 

Button on the Homepage - Unauthenticated

 

 

Button on Rewards page

 

 

Background Setting

Learn More Icon

Banner Progress Bar Icon

Opt In Modal

Opt In Modal - Error

Opt In Modal - Loading

Swap Modal Content

Short Code Confirmation Modal Content

Override Short Code Modal Content

Surprise and Delight Modal Content

Loyalty Dashboard

 

Loyalty Not Available at this Restaurant

Loyalty Not Available at Delivery Mode

Loyalty Not Authenticated

Featured Rewards

International Rewards Widget Type

 

Enabling the Loyalty Notifications Widget

This section will be a walkthrough on how you can enable the Widget on the Rewards Detail Page.

  1. Navigate to the Feature Loyalty UI Tab on Sanity
    Order-Level Content ➡️ Loyalty ➡️ Loyalty Configs ➡️ Feature Loyalty UI

  2. Scroll Down to the Loyalty Dashboard Section where you will see a section for Widgets

  3. This section is where you will add the Loyalty Notifications Widget. This is a Sorted Widget list, which means that the widgets will appear in the order in which they are configured.

  4. To add the Loyalty Notifications Widget, Click on Add Item and then Select Loyalty Notifications

  5. Next, you will simply complete the fields in the pop-up

    • Click on Enable Notifications Widget Radio Button

    • Enter Title of the Section - This is what the Name of the Section will be on the FE

    • And then Select the Incentives you would like to show in the section. NOTE: Only incentives with Notifications Turned On will be shown in the Drop Downs. (This is covered in the section below)

  6. Once configured, you can hit Publish and the Widget will now show on the FE.