Please note that advanced customization of your loyalty program is a feature available on Classic Plan and above. If your panel does not look like the one below, please see our other UI customization options.
Loyalty panel is a legacy interface that is being deprecated. If you still use loyalty panel, we’ll be in touch with you when it’s your time to upgrade.
If you’d like to make the change earlier and take advantage of our new UI, contact us at support@loyaltylion.com.
Please note that if you joined LoyaltyLion after 2022, you will not have access to this UI.
In this article:
Where to find the CSS Editor?
Log into LoyaltyLion
Go to Display > Store components > Loyalty panel
Scroll down to Advanced and Open CSS Editor
In the CSS editor, you can make changes to your loyalty panel, widget and notifications
How to change the font family
Once you have found the element of the text you want to change, simply add the code into the CSS editor using ‘font-family’ as the class. Please see below for an example of this structure.
.lion-loyalty-splash__title {
font-family: sans-serif;
}
How to change the font size
To change the font size, simply add the following code into your CSS editor using ‘font-size’. Please see below for an example of this structure.
.lion-loyalty-splash__title {
font-size: 150px;
}
How to change the font color
To change the color of your font, apply the code: ‘color’ to your element. See below for an example of this structure. You can either use a general colour such as yellow, or add specific HEX code.
.lion-loyalty-splash__title {
color: #37aadf;
}
How to change the thickness of the font
To change the thickness (boldness) of your font, apply the code: 'font-weight' to your element. See below for an example of this structure. You can either apply a numeric value for a specific weight, or enter a general weight (bold, bolder, lighter, normal).
.lion-loyalty-splash__title {
font-weight:bold;
}.lion-loyalty-splash__title {
font-weight:600;
}
Please note, that even though we give you all options to customize your loyalty panel, we do not specialize in customizing loyalty programs for individual clients.