The Mage Loyalty app embed must be enabled on your live Shopify theme before referral campaigns can track referral links or show the site-wide popup on your storefront. If you have not done this yet, see: How to Enable the Mage Loyalty App Embed.
A referral campaign is a branded referral block for your store. You choose the friend's reward and the advocate's reward, write the wording for each step, style it to match your brand, and then add it to a page in your theme.
Referral Campaigns require the Growth plan or above.
Before You Start
In Referrals > Settings, set the Referrals Landing URL Path to the page where you will place the campaign. See Referrals Settings.
In the same place, choose your Advocate Reward Timing and Fraud Prevention settings.
Decide how advocates will get their reward code. The referral emails start switched off, so turn on the Referrer Reward Email under Email Templates, or send the code from your email tool. See How the Advocate Receives Their Reward in Referrals - Overview.
How to Create a Campaign
Open Mage Loyalty from your Shopify admin.
Click Referrals in the left menu, then Referral Campaigns.
Click Create Campaign.
Enter a Campaign name and click Create. The campaign editor opens.
New campaigns start switched off, with the site-wide popup switched on. The campaign name is only for you. Customers never see it.
General Tab
Setting | What it does |
Campaign Status | Switches the campaign on or off. You can only switch it on once the campaign has both a friend reward and an advocate reward. |
Campaign Name | Internal name, not visible to customers. |
Enable site-wide popup | Shows the claim form as a popup when a friend arrives through a referral link, even on pages without the campaign block. On by default. If the app embed is off, a warning with an Open Theme Editor button appears. |
Friend Reward | The discount the referred friend receives. Click Add Friend Reward to create it. |
Advocate Reward | The reward the advocate receives after their friend's order. Click Add Referrer Reward to create it. |
Embed Code | The campaign's 6-digit Display code. You enter this in your theme to show the campaign. |
Rewards can be a Discount (a fixed amount or a percentage), Free Shipping or a Free Product. The reward pages have the same settings as Basic Referrals rewards, which are explained in Configuring a Basic Referral Reward. To change or remove a reward later, use the Manage menu next to it. Save any other changes first.
Pages Tab
A campaign has four steps. Pick a step at the top of the Pages tab to edit its wording. Every step has a Title, Subtitle and Footer text, and most have Button text.
Step | What it does |
Signup | The first step, where customers join your referral program. Set the Email placeholder, and the Logged out button text and Logged out button URL shown to logged out visitors when guest referrals are off. Under Form Fields you can turn on Enable first name. |
Share | Shown after joining. Advocates copy or share their unique link here. Choose the Share buttons layout (Inline or Stack), edit the wording of the Share Email Popup, and choose whether to Show "View my referrals" link so logged in advocates can see who they have referred. |
Claim | What friends see when they click a referral link. To show the advocate's first name, use the placeholder shown under the step heading in the editor. Under Form Fields you can turn on Enable email subscription opt-in to invite friends to join your email list. |
Reward | Shows the friend their discount code. Set the Button URL (where the button takes them, such as a collection) and Copy button text. Auto-apply discount (on by default) adds the discount to the friend's cart so they do not need to type the code. |
Every step also has Enable terms and conditions, which adds a checkbox with your own Terms text and Terms URL.
Design Tab
Setting | What it does |
Layout | Card (a single card) or Two Columns (the form on the left and an image or colour on the right). |
Card Alignment | Places the card on the left, centre or right. Card layout only. |
Colors | Colours for the text, card, buttons, inputs and footer. Two Columns also has a Column Color. |
Typography | Text sizes for the title, subtitle, button and footer. |
Min Height | The minimum height of the card. Card layout only. |
Alignment | Left, centre or right alignment for the title, subtitle and footer. |
Background Image / Column Image | An optional image. See Adding an Image to Your Referral Campaign. |
Disable inline styling | Ignores the design settings above so you can style the block entirely with your own CSS. |
Advanced Tab
The Custom CSS editor lets you fine-tune the look of the campaign block with your own CSS. See Styling your Referral Campaign.
Previewing Your Campaign
The preview on the right updates as you edit.
Use the step buttons above the preview (Advocate Signup, Advocate Share, Friend Claim, Friend Reward) to see each step.
Switch between Desktop preview and Mobile preview to check both sizes.
Launching Your Campaign
Click Save in the bar at the top of the page.
Add the campaign block to your theme using the Display code. See Embedding a Campaign on Your Store.
Back in the campaign editor, switch Campaign Status on and click Save.
Managing Campaigns
The Referral Campaigns list shows each campaign's status and its Invited, Claims, Converted, Completed and Revenue numbers. Click Manage next to a campaign for these options:
Edit: open the campaign editor.
Copy Display Code: copy the campaign's 6-digit code.
View Referrals: see the campaign's funnel and every referral.
Delete: permanently remove the campaign.
What the numbers in the list count:
Invited: friends invited by email who have not claimed their discount yet.
Claims: every referral in the campaign, including invited friends who have not claimed yet and rejected referrals.
Converted: referrals confirmed after the friend's order, which is usually when the advocate's reward is issued.
Revenue: the total of the friends' first orders on converted referrals.
The Referral funnel on the View Referrals page counts Claims differently: only friends who have received their discount code, leaving out rejected referrals. The two numbers can therefore differ.
If a live campaign is missing its friend or advocate reward, a red warning icon appears next to its name. Add the missing reward, or switch the campaign off.
Referral Stages
On a campaign's View Referrals page, the Stage column shows how far each referral has got:
Stage | What it means |
Awaiting claim | The friend was invited by email and has not claimed their discount yet. |
Awaiting first order | The friend has their discount code but has not placed a paid order yet. |
Reward due (with a date) | The friend has paid. The advocate's reward will be sent on that date, unless the order is cancelled or refunded first. |
Awaiting fulfillment | The friend has ordered and the advocate's reward will be sent once the order is fulfilled. This is the waiting stage when Advocate Reward Timing is set to Send on fulfillment. |
Completed | The advocate's reward has been issued. It stays here whether or not they go on to use it. |
No advocate | The friend claimed and ordered, but the referral is not linked to an advocate, so there is no one to reward. |
Order cancelled | The friend's order was cancelled or refunded, so the advocate's reward was not sent, or was withdrawn before it was used. The referral can no longer be approved. |
Rejected | The referral was ended with Reject referral. |
Blocked (with a reason) | The claim was stopped by a fraud prevention setting. The reason is shown after the word Blocked. |
The Pending tab lists the four waiting stages and the Completed tab lists completed referrals. No advocate and Order cancelled referrals only appear under All.
Approving and Rejecting Referrals
On a campaign's View Referrals page, each referral has a Manage menu:
Option | What it does |
View details | Shows the friend, the advocate, the referral's journey, the discount codes and any approval or rejection. |
Approve referral | Sends the advocate their reward now, without waiting for the usual timing. You can add an optional note. If the friend has not ordered yet, you will see a warning first. It is not available once the friend's order has been cancelled or fully refunded. |
Reject referral | Ends the referral. The friend's discount code is deactivated if it has not been used, and the advocate is not rewarded. You can add an optional reason. |
Once an advocate has received their reward, the referral can no longer be approved or rejected.
Common Mistakes to Avoid
Switching on the campaign without adding the block to your theme. Switching on Campaign Status does not place the campaign on your store. Add the block to a page so advocates can join and share.
Turning off the site-wide popup when your landing page has no campaign block. Friends arrive and see nothing to claim. Keep Enable site-wide popup on, or make sure the Referrals Landing URL Path points to the page with the block.
Leaving the app embed switched off. The popup and referral link tracking both need it. Follow the warning's Open Theme Editor button to switch it on.
Troubleshooting
I can't switch on Campaign Status
The campaign needs both a Friend Reward and an Advocate Reward. Add whichever one is missing.
I can't edit or add a reward
Save or discard your other changes first, then try again.
Logged out visitors only see a log in button
This is expected when guest referrals are off. To let visitors join with just their email, turn on Allow guest referrals in Referrals > Settings.
The campaign is not showing on my store
Check that Campaign Status is on and your changes are saved.
Check that the Mage Referral Campaign block is on the page and uses the right Display code.
Check that the Mage Loyalty app embed is enabled.
