Referral at Checkout Page
Overview
Let customers enter a referral link or code directly at checkout to instantly claim their referral reward. This helps shorten the referral flow, increase visibility, and improve conversion.
⚡ Available for Shopify Plus stores (Checkout Extensibility only). 🧩 Cart Drawer support will be available soon.
How to set up
Go to Joy App → On-site content → Checkout page.
Find the block Referral at Checkout and click Edit in Theme Editor.
In the Theme Editor, find the block Referral at Checkout Page.
Drag and place it where you want on the checkout page.
Edit text if needed:
Title: “Have a referral link?”
Description: “Enter your referral link or code below to claim your {{ referral_reward }} discount.”
Click Save to apply changes.
Customer experience
Customer enters a referral link or code and clicks Apply.
The system validates:
✅ If valid:
Shows message: “Successful referral! You’ve received a discount code: {coupon_code}.”
Displays a button Apply coupon next to it.
Customer clicks Apply coupon → the system applies the discount to the order.
If the coupon is valid and applicable → order total updates immediately.
If the coupon cannot be applied (expired, not applicable, etc.) → shows an error message.
❌ If invalid:
Shows message: “Referral link or code is invalid. Please try again.”
FAQ
1. Who can use this feature? → Only available for Shopify Plus stores using Checkout Extensibility.
2. What happens if the coupon is invalid or expired? → The system will show an error message and the coupon won’t be applied.
3. Can I customize the reward amount? → The reward amount follows your referral program settings.
4. Can I add this to the Cart Drawer? → Not yet, but support for Cart Drawer is coming soon.
Related articles
Last updated
Was this helpful?