Add Referral Widget on Shopify Stor

Follow these steps to integrate the Referral Widget into your Shopify store and kickstart your referral program.

Step 1: Create a Dedicated Referral Page

1. In your Shopify Admin, go to: Online Store → Pages

   
2. Click Add Page.

3. Enter a name for your page, like: Refer and Earn

1. Switch to HTML view by clicking the </> icon in the top-right of the content editor. Paste the following code into the editor:

<script type="text/javascript" defer src="https://app.referralrocket.io/widget/widgetIndex.js"></script>


<div class="hype_widget" campaign-id="YOUR-CAMPAIGN-ID"></div>

1. 🔁 Important: Replace YOUR-CAMPAIGN-ID with your actual campaign ID.

1. Ensure Visibility is turned on so the page is accessible to visitors.

1. Click Save to publish the page.

---

Step 2: Add the Referral Page to Your Store Menu

Make it easy for customers to access your referral program by adding it to your store's navigation menu.

1. In your Shopify Admin, go to: Content → Menus

   
2. Choose the menu where you'd like to add the page — for example, Main Menu.

3. Click Add menu item.

1. Enter a link label like Refer and Earn.

2. In the Link field, select Pages.

   
3. Then, choose the referral page you created (e.g., Refer and Earn).

   
4. Click Add, then Save menu to apply the changes.

---