Loyalty landing page
Learn how to create an SEO-friendly Loyalty page for your Shopify store, showcasing rewards, points, and tiers to boost customer engagement and loyalty
Who can use the Loyalty Page?
Basic features are available for Free users.
Enhanced features are available for Professional, Advanced, and Enterprise plans.
Your theme needs to support OS 2.0 app blocks
When setting up your loyalty program, you may choose to have both a dedicated Loyalty Page and a simple floating widget. While the widget is convenient, itβs not always SEO-friendly. A fully customized Loyalty Page not only enhances SEO but also provides a solid destination for targeting your ads, email campaigns, and social posts.
With Joy Loyaltyβs embedded content, you can tailor your Loyalty Page to meet your needs and drive engagement. Letβs explore how to set it up for maximum effectiveness.
Jumpstart your Loyalty Page
To kick things off, please navigate to the 'Embedded Content' on your left menu. Once there, click on 'Generate Loyalty Page' to create our page in Shopify.
A blank Loyalty Page will be generated and located at /pages/joy-loyalty-page
. You will then be redirected to your Online Store editor.
You can go to Shopify pages and find the Edit website SEO section to change this page's handle if you want to.
Case #1: If you have already created a loyalty page named 'loyalty-page' using the Shopify theme but have not yet clicked 'Generate Page' in the embed content, clicking 'Generate Page' will convert the loyalty page you previously created into the new 'joy-loyalty' page."
Case #2: If you have already generated a loyalty page and then create a new page and set it up based on 'joy-loyalty,' this new page will automatically convert into the loyalty page that you previously generated.
Add your content
Here, click on 'Apps' in the left menu and add the first 'Hero Banner Block'. You also have the option to use your own themeβs Hero banner instead of ours. While our banner is designed to suit most Loyalty Page needs, using your own banner may be better if you want a slideshow or a more interactive experience.
Once the Joy Hero Banner block is added, you can find all the settings on your right menu in which you can customize the following:
Banner image: It is recommended that you design your banner.
Buttons: Change your primary and secondary buttons' content, color, and links.
Layout: Change your content alignment to the left, center, or right depending on the banner background image.
To create a fully functional and effective Loyalty Page, we recommend including the following blocks: "Joy How it Works," "Joy Ways to Earn," and "Joy Ways to Redeem." A well-structured Loyalty Page typically follows this layout: a Hero Banner at the top, followed by sections for How it Works, Ways to Earn, and Ways to Redeem. Optionally, you can add an Inline Banner for a call-to-action (CTA) and a FAQs section to provide additional clarity and drive engagement.
These Ways to Earn, and Ways to Redeem will dynamically display the content according to your program settings.
Customizing icons
Use our icons
In each block setting, you can find the "Icon color" input to change the color of our default icons according to your brand color.
Use your self-designed icons
In the Embedded content menu, go to Loyalty blocks to browse for Ways to redeem
and Ways to earn
blocks. You can upload your icons to our app or you can paste your own hosted URL that can be used for the loyalty page.
Besides these two blocks, if you want to customize the How it works
block, then the custom icon inputs are built-in. You can upload it right in the Shopify theme editor.
Further customization
Some blocks may allow you to manage their advanced settings inside the Joy Loyalty Program application. For instance, with the βJoy Way to redeemβ block, you can head back to your Joy Loyalty Program to set up the displaying order of programs in the 'Way to Earn' block.
Navigate to 'Embedded content', then 'Loyalty blocks' (on your left menu) and you will find the 'Way to earn' block. In this example, you can set up the order of each way to redeem, or toggle their display ON or OFF.
Also, the Joy: FAQs block would require you to set up your FAQs list inside our apps. If you want to use your own theme FAQs blocks combined with Shopify Meta Objects then it would be fine as well.
Feel to to add any of your theme blocks like Video, Collage, etc to create a seamless loyalty landing page for your site.
Change your SEO
As mentioned earlier, you can update your page handle, title, and meta description directly within Shopify. Hereβs how to do it:
Go to Shopify Admin β Online Store β Pages β Select your landing page.
Click on Edit website SEO.
Update the page handle, title, and meta description as needed.
Click Save to apply your changes.
Once all is settled, make sure to submit your page to Google Indexing.
Add your page navigation
Be sure to add your Loyalty Program page to your storeβs navigation so customers can easily find it. This not only improves user experience but also boosts SEO by adding valuable internal links to your site. Go to Shopify Admin > Online Store > Navigation to update the menu to your liking.
And thatβs it! Youβve created an engaging Loyalty Page for your customers. Remember, the key to a successful Loyalty Program is making sure your page is both inviting and easy to navigate. Keep refining it to meet your customers' needs.
Discover Joy
Need help? Check out Frequently Asked Questions.π
Last updated