Follow these steps to set up a powerful referral program page on your Shopify store at ease and see sales soaring.

First, download our app to explore it!



At Bloop Rewards & Referrals admin panel, you can access 3 main parts: Dashboard, Referrer List and Referral Programs

1. Dashboard allows you to quickly get an overview of your referral program performance. The figures include:

  • Total Referrers
  • Referral Revenue
  • Successful Referrals

2. Referrer List contains the information of referrers and referees accordingly. 

3. Referral Programs section enables you to set up your bespoke referral program.

Step-by-step Instruction

Step 1: Set up rewards for Referrer & Referee 


  1. Expand  Referral Programs > Select General Settings
  2. Switch Off -> On to make the Referral Program page visible on your Shopify storeon-off-status
  3. Choose the Reward Types.
  4. Write down the wanted Discount Amount.
  5. Setup coupon expiration date at Active Dates (if any).
  6. Select Minimum Requirements and write down the wanted Minimum level (if any).

Step 2: Branding (This will be applied for both referral page & popup)

* Leverage a ready-to-use template


  1. Choose a template from Ready-to-use Templates.
  2. Click apply-button
  3. Go to your Shopify Admin > Expand Online Store Section > Click Navigation > Click Menus > Choose Footer Menu/ Main Menu  > Add file “referral-program”.


      4. Click Save Menu > Go to your storefront to check the result. 

* Create a new Storefront Template
  1. Rename the template.
  2. Paste image URL in the box under Image.
  3. Type Title and Description. 
  4. Turn on sharing channels. 
  5. Review changes on the visual display on the right.
  6. Click Save Changes.
* Referral Popup:

The referral popup’s content will be the same as the referral page. You can change the color of its background and text.


Note: You can show both the referral page & referral popup on your Shopify store, or choose to show one of them. Please expand Referral Program Page/Pop-up > Scroll down to Display Option > Turn on/ off the options. turn-on-off-referral-program-page-and-popup

* Change referee coupon code popup’s content

When you click on the referral sharing link, there would be a popup with a coupon code for the referee. Now, the BLoop app allows you to customize its content to catch their attention effectively.


* Change the post-purchase widget content (paid plan only)

For businesses subscribing to our Basic plan, you can customize and show a referral post-purchase widget at the thank you page (after a customer places an order on your store). This has proven to raise the chance of them joining your program.


Step 3: Use Branding optimization (Optional)

After creating a referral program template, go to Branding optimization > Choose the primary font & color you want.

  • The font will be applied on the referral page/ popup, emails & referee coupon popup.
  • Color will be applied on Header & button of referral page/ popup, coupon code on referee popup.

Step 4: Set up referral social sharing messages


Twitter Message

  1. Edit/ Customize the default text of Twitter Message, Card Title, and Card Description (if wanted).
  2. Paste Image URL in the box under Your Image URL. 
  3. Review changes on the visual display on the right.
  4. Click Save Changes.

Facebook Message

  1. Edit/ Customize the default text of Facebook Title and Facebook Message (if wanted).
  2. Select Custom Image/ Default Image.
  3. If you select Custom Image, paste the Image URL in the box.
  4. Review changes on the visual display on the right.
  5. Click Save Changes.

Whatsapp Message

  1. Edit/ Customize the default text (if wanted).
  2. Review changes on the visual display on the right.
  3. Click Save Changes.

Step 5: Set up Referral Email

From Referral Programs, select Email Notification:

Referee – Referral Sharing Email

  1. Edit/ Customize the sample text (if wanted).
  2. Paste Image URL in the box under Banner Image.
  3. Review changes on the visual display on the right.
  4. Click Save Changes.

Referrer – Successful Referral Notification Email

  1. Edit/ Customize the sample text (if wanted).
  2. Paste Image URL in the box under Banner Image.
  3. Review changes on the visual display on the right.
  4. Click Save Changes.

Step 6: Translations

Use this section if you want to change the hard (fixed) text to whatever you want or your own language.

Step 7: Show Referral Program on Shopify site

See our demo store >>

* Make sure that you:

  • Applied theme to Storefront  Display in Branding: complete “referral-program” file.
  • Switch On in General Configuration: “referral-program”. Page can be shown in your Shopify Admin Store.
  • Go to your Shopify Admin store > Click Menu/ Footer Menu/ Header > Add file “referral-program”: display the referral program on your Shopify ecommerce website.

It can be activated only if you complete all the aforementioned steps.

Step 8: Create an email campaign to invite customers


  1. Customize the content of your invitation email: Go to the Email Notification > Scroll down to Referrer – Invite to join referral program > Change the content as you want.
  2. Go to Referrer List > Click Invite referrer > Upload the contacts you want to invite > Click button Send. Please note that when you click this button, the email you created in the 1st step will be auto-sent, so make sure to set up the email carefully first. 


Step 9: Manage how the referrers are performing to deliver the best marketing strategy

Visit Referral List and see who is interacting with your brand.

In case you have questions or requests, please contact us for free support via email at or chat with us on 24/7 Whatsapp (+84 793 366 094).

We’re here to help you sell more. Loop in with us, Grow together!