> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.wikiguide.link/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Setting Up the Loyalty Page in Store Front Widgets

Learn how to access and **manage your Loyalty Page widgets,** including the Referral Landing Page, Loyalty Page landing page, and **Rewards Page Block.**

### Step 1: Navigate to Store Front Widgets
1. Click **Store Front Widgets** from the left sidebar menu.
2. Select the **Loyalty Page** tab at the top of the page.


![](https://storage.crisp.chat/users/helpdesk/website/-/a/9/5/5/a9552c769f21a000/image_1cuyx5z.png)

### Step 2: Set Up the Referral Landing Page
In the **Referrals** section, you'll see the **Referral Landing Page** widget preview — a dedicated page for friends visiting your store via a referral link.
1. If you want to translate the widget content, click **Translation**.
2. Otherwise, click **Add To Theme** to publish this section directly to a store page.


![](https://storage.crisp.chat/users/helpdesk/website/-/a/9/5/5/a9552c769f21a000/image_1hosj81.png)

### Step 3: Customize and Publish the Section
After clicking **Add To Theme**, Shopify opens the theme editor with the **Referral landing page** section already added under your **Page** template.
1. In the left sidebar, you'll see the **Referral landing page** block listed under the Page template. You can **drag this block** up or down to reposition it wherever you want on the page.
2. Once you're happy with the placement, click **Save** in the top-right corner to publish your changes.


![](https://storage.crisp.chat/users/helpdesk/website/-/a/9/5/5/a9552c769f21a000/image_u2i0qn.png)

### Step 4: Set Up the Loyalty Page Landing Page
Once published, the **Referral Landing Page** status changes to **Live**, and you now have the option to **Open Theme Editor** if you need to make further edits later.
Next, move to the **Loyalty page** section below:
1. Under **Loyalty page**, find the **Landing page** widget (already marked **Live**) — this promotes your loyalty program with a dedicated page.
2. Click **Customize** to open the theme editor and adjust this section's design and placement.



![](https://storage.crisp.chat/users/helpdesk/website/-/a/9/5/5/a9552c769f21a000/image_13bgh7w.png)

### Step 5: Customize Your Loyalty Page Design
Clicking **Customize** opens the Loyalty Page editor, where you can preview and configure the page before publishing:
1. Choose a **theme style** for your loyalty page — options include **Bold**, **Clean**, **Luxury**, **Minimal**, and **Playful**.
2. Use the **Logged out** / **Logged in** toggle at the top to preview how the page looks for each customer state.
3. Use the **Desktop** / **Mobile** toggle to preview the page on different devices.
4. Scroll down to adjust additional settings like **Page width** (Container or Full width) and **Header and footer** (Shopify theme or LoyaltyPalms branded).
5. Once you're satisfied with the design, click **Save** in the top bar to publish your changes.


![](https://storage.crisp.chat/users/helpdesk/website/-/a/9/5/5/a9552c769f21a000/image_10agfsx.png)

### Step 6: Preview Your Live Loyalty Page
Once your changes are saved, return to the **Store Front Widgets** screen. Under the **Loyalty page** section, click **View Page** to open your published loyalty page and confirm it looks and works as expected on your live store.


![](https://storage.crisp.chat/users/helpdesk/website/-/a/9/5/5/a9552c769f21a000/image_pg3139.png)

After clicking **View Page**, your live loyalty page opens in a new browser tab. You can copy this URL from the address bar (e.g., **yourstore.myshopify.com/apps/lp?pb=0**) and use it to promote your rewards program — t**hrough email campaigns, social media, your website menu, or anywhere else you want to drive customer sign-ups.**


![](https://storage.crisp.chat/users/helpdesk/website/-/a/9/5/5/a9552c769f21a000/image_lyvtd2.png)

### Step 7: Add the Rewards Page Block
The last section under **Loyalty page** is the **Rewards page block**, which lets you embed the full loyalty program page directly into an Online Store page template.
1. Click **Add To Theme** next to **Rewards page block**.
2. Click on Translate if you want different language.


![](https://storage.crisp.chat/users/helpdesk/website/-/a/9/5/5/a9552c769f21a000/image_1r5kwnx.png)


### Step 8: Click on Add To themes
* This opens the theme editor, where you can drag and position the block on your chosen page .
* Click **Save** once you're done to publish it live.


![](https://storage.crisp.chat/users/helpdesk/website/-/a/9/5/5/a9552c769f21a000/image_1y9wbw4.png)

### Step 9: Confirm All Sections Are Live
Once published, the **Rewards page block** status updates to **Live**, with **Translation** and **Open Theme Editor** options now available for future edits.


![](https://storage.crisp.chat/users/helpdesk/website/-/a/9/5/5/a9552c769f21a000/image_80s9.png)

At this point, all three sections — **Referral Landing Page**, **Landing page**, and **Rewards page block** — should show a **Live** status, confirming your Loyalty Page setup is fully active on your storefront.