Introduction
A dedicated on-site page for your loyalty program is the perfect place to explain how your rewards and referral system works. It serves as a central hub where both customers and potential customers can learn about the benefits of your program.
In this article, we’ll walk you through how to create a landing page for your Points, Rewards, and Referrals program using the Shopify Theme Editor.
Benefits
Explain how the Loyalty program works.
Clearly outline the benefits of the program on a dedicated page.
Motivate both current and potential customers to earn points and redeem rewards.
Enable members to easily track their accumulated points and rewards.
Walkthrough Video
Create a Loyalty page
Follow these steps to create a dedicated loyalty page for your store:
1. Go to Loloyal Admin > Brand Style > Loyalty Page > Get Your Loyalty Page, then click Generate a New Page.
2. Fill in the required fields:
Page Title
SEO Page Title
SEO Page Description
URL and Handle (enter your desired link in the last field)
3. In the pop-up prompt, click Generate a New Page to complete the setup.
4. Once the page is created, click Edit in Theme Editor in the Get Your Loyalty Page section to customize it using Shopify's theme editor.
💡 Tip: If you’ve already created the page you'd like to use, you can skip this step.
Accessing the Landing Page Template Sections
Follow the steps below to add, edit, or remove sections for your Loyalty, Rewards, and Referrals landing page using the Shopify Theme Editor:
1. Go to Shopify Admin > Online Store > Themes > your theme > Customize > Pages > Select the page you want to edit > Add section > APP, then search for "Loloyal" in the template selector.
2. Add the "Loloyal: Hello Banner" section first. Hover your mouse under that section until you see the “Add block” icon. Click it to add more sections.
3. Click each section to customize its background, text, buttons in the editor sidebar, and even add custom CSS to better match your store’s branding.
4. Once everything is set, click Save to apply your changes
Adding Menu Items to Store Navigation
Make it easy for customers to find your loyalty program by adding the landing page to your store's navigation menu.
Steps:
1. Log in to your Shopify Admin, go to Content > Menus, and choose the menu where you'd like to add the page:
Main menu
Footer menu
Customer account main menu
2. Click Add menu item, then select and add your loyalty landing page.
3. Click Save to apply the changes.
💡 Tip: For easier access after customers log in, we recommend adding the loyalty page to the customer-account-main-menu.
Change SEO details
In your Shopify Admin, go to Online Store > Pages, then select your loyalty landing page.
Click Edit and update the SEO fields as needed (page title, description, and URL handle).
Click Save to apply your changes.
Hide or delete a page
In your Shopify Admin, go to Online Store > Pages, and select your loyalty landing page.
To hide the page, set the visibility to Hidden. To remove it entirely, click More actions > Delete page.
Click Save to apply any changes.
Advanced Setup: Use Shopify’s Multicolumn Section to Explain Your Loyalty Program
You can use Shopify’s Multicolumn section to clearly introduce how your loyalty, rewards, and referrals program works. This flexible layout helps highlight key benefits and steps in a visually engaging way.
Walkthrough Video
How to Do It:
In your Shopify Admin, go to Online Store > Themes > your theme > Customize.
Select the page where you want to add the content, or create a new one.
Click Add section, then choose Multicolumn.
Use each column to showcase different parts of your loyalty program, such as:
How to earn points
How to redeem rewards
VIP tier benefits
Referral program overview
Customize each column with images, headings, and brief descriptions to make it easy for customers to understand.
Insert Loloyal links to trigger specific sections of the widget panel when clicked.
Use the following links for each section:
Loyalty Home:
#loloyal-homeWays to Earn:
#loloyal-waystoearnWays to Redeem:
#loloyal-waystoredeemReferrals:
#loloyal-referralVIP:
#loloyal-vip
👉 Tip: Please make sure to click the link in the prompt to confirm the link is applied correctly.
7. Click Save to publish your changes.
✅ Sample Result After Setup
Once complete, your customers will see a neatly organized section that clearly explains your loyalty program, making it easier to understand and more appealing to join.
💡 Tip: Keep your messaging clear and concise. Using visuals or icons can help customers quickly grasp how your program works.