Branding for Referral Widget

Search…

Learn how to customize the appearance of the Referral Widget Launcher

Retainful comes with a Referral Widget / Launcher. It helps your customers to discover your Referral program easily in your store.
What is a Referral Widget / launcher?
Think of it like a nice, little chat widget sitting at the bottom of your store. When customers click it, it pops up a neat chat like window, showcasing your rewards, the unique referral code of the customers, and their earned rewards.
Referral Program Widget Launcher
Referral Launcher
The widget is quite handy for your customers to discover your Referral Reward program easily.
Benefits of the Referral Widget / Launcher
The widget serves a number of purposes in your store
Displays the Unique Referral link to the existing customers
Lists the rewards earned by the customers by referring their friends
Showcases your rewards
Customers can share to social media 
How to Customize the Appearance of the Referral Widget
Login to your Retainful dashboard​
Go to Referrals
Click on the "Branding" button to get started
Referral Program Branding
1. Launcher 
The Launcher lets you choose the overall theme color, font, placement, spacing etc of the widget.
You can set the overall theme color and font style (black or white) to your referral widget. This will be used across all the screens of the Referral Widget. You may also choose your launcher icon and even edit your Launcher icon appearance. Sometimes you might prefer a text-only icon or sometimes just an icon, all those options are available for you to choose from.
It also helps you to set the placement of the widget (left or right)  and choose in which devices the widget should appear.
Panel Settings:
In the Panel settings, you can customize/edit the contents of your Referral widget. The appearance and content of the widget varies depending on the customer's status.
Here is a quick video showing how to customize the panel

Customizing Referral Widget
Visitor
You may consider editing the text appearing the the Visitor Widget here.
Referral Content- For Visitor Widget Confi
When the customer is not logged in, the widget will appear like the following: 
Referral Content- For Visitor Widget
Member
If the customer is already a registered user, he can login and view his "Unique referral link" and the rewards he has earned.
You may consider editing the text appearing the the Member Widget here.
Referral Widget - Member Confi
When the customer is logged in, the widget will appear like the following: 
Referral Widget - Member
Launcher Settings:
In mobile devices, only the icon will be shown.
Launcher Icon Appearance: Under the launcher tab, you can choose your launcher icon and even edit your Launcher icon appearance. Sometimes you might prefer a text-only icon or sometimes just an icon, all those options are available for you to choose from.
Editing Referral Launcher
Showing Launcher on Specific pages
You can display the launcher widget in specific pages of your store. Example: Shop pages, My account only.
To control the display, you can "Add page rule conditions".
Here is an example:
This will ensure that the launcher shows only in the shop pages (That is, urls containing the word "shop")

Option to Show the referral launcher on certain pages
That’s it!
Your Referral Widget is now fully customized and is ready for launch.
Reward Popups:
There are two popups offered in the Reward widget when a friend lands in your store through a referral link:
The Claim award popup asks the friend to enter his email address to claim the referral reward.
Referral Widget-Friend
The Apply popup reveals the reward after the friend enters his email address.
Referral Widget- Coupon Block (Friend Reward)
2. Embed Widget
This tab gives you the ability to embed the referral link in custom page for logged in customers.
If you would like to embed the referral link in the specific page for logged in users, you can follow the below steps.
Step 1: Go to Referrals -> Branding -> Embed Widget
Embed Widget
Step 2: Copy the 'Embed script', then paste it in your preferred page.

For WooCommerce: You can embed the referral link in "My account" page for logged in customers. To do that, you don't need to copy paste the Embed script. Just use the 'Show unique referral link in my account page for logged in customers?' option at WordPress dashboard -> Retainful -> Settings.
3. Thank you Widget
In this tab, you can edit the contents of your referral widget that would be displayed in the order summary/thank you page.
Thankyou Widget
​
​
​