Introduction
Using timely prompts in your store encourages activity, boosts engagement, and increases loyalty-driven sales. Let's dive in and go through how to set these up in your shop within a few minutes!
✨ Loyalty Prompts are available on all paid plans.
Types of prompts
By creating prompts, you open up additional avenues for your customers to actively engage with your Loyalty program.
Boosting member signups
This prompt encourages guests to sign up for your Loyalty program. It will show on the first page view for any new visitor on your store, and any subsequent page they visit unless they click Join Now or close the popup.
Boosting points engagement
This prompt encourages members to spend their points on the /cart
page. It will show when a customer is signed in to their account, is on the cart page, and has points to spend.
Boosting reward engagement
This prompt encourages members to redeem their rewards on the /cart
page. It will show when a customer is signed in to their account, is on the cart page, and has a reward available to use.
📝 Note: As the Points Engagement and Reward Engagement prompts share the same rules, they can’t appear at the same time. If you choose to enable both prompts, the member would see the Points prompt first and they would see the Reward prompt only if they close the first one, change the page, and go back to the /cart
page.
Enabling your prompts
From your Rivo Dashboard, go to Onsite > Prompts
Click on the prompt you want to edit
Within the prompt editor, adjust the following settings:
Title - The header text in the prompt
Body - The text below the title in the prompt
Button - The CTA button text
Icon - Default or upload your own. For a custom icon, the optimal image size is
60x60px
Position - Choose to place the prompt either at the bottom right or bottom left
Custom CSS - Insert CSS codes into the text area to align with your brand's style
Make sure you toggle the switch to
ON
Save changes.
Customizing your prompts with CSS
Use the following CSS selectors to add a unique look and feel to your prompts.
Icon -
.content.preset .icon img
Close button -
.modal__close
Title -
.content.preset .title-text
Body -
.content.preset .body-text
Button -
.content.preset .cta-button
Footer -
.content.preset .footer
Footer link -
.content.preset a
Import fonts
Use the @import
method to add a font from an external CSS file, like Google Fonts. For example:
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@1,300&display=swap');
Use the @font-face
method instead if the font already exists in your Shopify theme. For example:
@font-face {
font-family: 'Your Font';
src: url('https://cdn.shopify.com/s/files/1/1761/2711/t/248/assets/yourfont.woff') format('woff');
}
Prompt analytics
On the Prompts page, you can gain insights into the performance of your prompts. Track the number of prompt views and interactions.
Views - Number of unique views
Clicks - Unique clicks on the CTA button.
Common Questions
How do I remove a prompt?
To remove a prompt, toggle the on/off switch on the prompts settings page.
Why is my prompt icon not updating in the live preview?
To see the updated icon, click the Preview on your store button in the top right corner. The updated icon will show on your website.