All Collections
Onsite
Add a Loyalty Dashboard to your Customer Account Page
Add a Loyalty Dashboard to your Customer Account Page

Set up a personalized loyalty account dashboard with Rivo theme extensions.

Laurence Leech avatar
Written by Laurence Leech
Updated over a week ago

Introduction

Enhance your customer account page by integrating a Loyalty Dashboard, designed using the latest Shopify theme extension best practices. This dashboard provides a seamless, user-friendly experience that enables customers to easily track their loyalty program activities and progress directly within their account interface. With no coding required, setting up is straightforward, allowing you to quickly deliver a personalized and engaging loyalty experience. Let's get started!

✨ The Loyalty Account Dashboard is available on the Scale & Plus plans. See pricing β†’ If you are not on either of these plans and would like access, please get in touch with support.


How to add the dashboard

πŸ“ Note: Rivo's account dashboard is compatible with Shopify classic customer accounts only.

To add the dashboard to your account page:

  1. From your Shopify Admin go to Online Store > Themes

  2. On your theme, click Customize

  3. In the top-center dropdown, go to Classic customer accounts > Customer account

  4. Log in on the centre page view to see so you can preview the dashboard

  5. In the left-side menu, underneath Template > Account, click Add section > Apps

  6. Select the Rivo Account Dashboard app section


Available dashboard blocks

There are 5 separate blocks that can be added to the account dashboard:

  • Loyalty Member Card

  • Referral Block

  • Activity Block

  • Rewards Block

  • VIP Tier Block

Each of these blocks can be enabled by clicking into the Rivo Account Dashboard section and checking the appropriate box. E.g. to enable the Referral Block, check the
​Referral Block Enabled checkbox.


Loyalty Member Card

Displays the customer's name with a greeting, their points and their VIP tier, where applicable. To enable this block, inside the Rivo Account Dashboard section, check the Member Card Enabled checkbox. Available customizations for this block are:

  • Background Color

  • Font Color

  • Background Image

  • Logo Image


Referral Block

Displays the customer's unique referral link and links to email friends and to obtain their own referral stats. To enable this block, inside the Rivo Account Dashboard section, check the Referral Block Enabled checkbox. Available customizations for this block are:

  • Background Color

  • Font Color


Activity Block

Displays a table of the customer's recent program activity. To enable this block, inside the Rivo Account Dashboard section, check the Activity Block Enabled checkbox. Available customizations for this block are:

  • Background Color

  • Font Color

  • Table Heading Background Color

  • Table Heading Font Color


Rewards Block

Displays info on the customer's current rewards, including optional unused rewards and progress indicator. To enable this block, inside the Rivo Account Dashboard section, check the Activity Block Enabled checkbox. There are optional additions to this display:

  • Rewards Progress Enabled - a progress bar that displays progress toward the next reward.

  • Unused Rewards Enabled - display a user's unused rewards so they can apply them directly on the account page.

  • Rewards Arrow Icon Enabled - displays an arrow on the unused rewards cards.

The available customizations for this block are:

  • Progress Bar Color


VIP Tier Block

Displays info on the customer's current tier, with a progress bar indicating their progress to the next tier. To enable this block, inside the Rivo Account Dashboard section, check the VIP Tier Block Enabled checkbox.


Account Dashboard Settings

To update the text on the account dashboard elements and update settings including button class names:

  1. From your Rivo dashboard, go to Programs > Loyalty > Onsite

  2. Select Account Dashboard

  3. Modify the text fields with your desired content. Ensure that dynamic placeholders (e.g., <span rivo-x-data rivo-x-text="$store.customer?.first_name"></span>) remain unchanged, as they automatically populate essential personalized data for your customers on the front-end.

  4. To find info on how to update the button class names, you can consult this guide.


Common Questions

What if I don't see the option to add sections to my account page?

Please reach out to us at [email protected] and we will take a look and help you get set up!

Did this answer your question?