Refer-A-Friend campaign enables you to customize promotions for your website visitors. To unlock promotions, visitors must share the promotions with friends. There are various sharing channels you can set up for your visitors. Your website visitors can share promotions with their friends using one or more than one sharing channels available. However please note that, even if multiple channels are used by the visitor to share a promotion, incentive will not be separate for each sharing channel. With Refer-a-Friend you can use rule-based targeting to give your visitors any offer, anywhere on your website based on source page, landing page, and Google search keywords.


Refer-A-Friend Campaign Flow


Refer to Figure: Refer-A-Friend Flow.

 

Figure: Refer-A-Friend Flow


Incentive

Before you begin designing your program's collateral and copy, you'll want to determine what incentives you are offering your customers. Refer-a-Friend incentives your customers in two ways: You can offer an incentive to customers who see the Referral Program and share you site with friends, and you can offer an immediate incentive to any customers who click a shared referral link to visit your website.

For example, say Susan visits your site and sees your Referral Program is offering a "Give $10, Get $10" incentive. She gets $10 for sharing your site, and her friends get $10 for visiting the site using her shared referral links. Susan emails her friend Courtney, who clicks the link. As soon as she lands on her site, she will see a Friend Offer Pop-Up giving her a coupon code good for $10 off her purchase. At the same time, because a friend clicked her shared link, Susan is emailed a coupon code of her own good for $10.

If you have any questions or would like suggestions regarding recommended incentives, ask your Customer Success Manager and they can share some ideas with you!

Collateral Required

Refer-a-Friend's flow requires branded, informative collateral to maximize its performance. What follows is a list of required collateral, as well as best practices for how that collateral should look and what copy (if any) it should contain. We'll walk you through the pieces step by step, and you'll have a quality referral program in no time! Of course, if you need any assistance or clarification at any time, feel free to reach out to your Customer Success Manager, who will be happy to help you out in any way.

Note that the Refer-a-Friend app has both a Desktop and Mobile version. Some collateral must be created in two different sizes to accommodate both these versions and ensure your customers can take part in your referral program regardless of what type of device they view your site on!

1. Background Offer Image (Desktop: 750x500 pixels; Mobile: 280x100 pixels): This is your primary image, and serves to drive the entire referral flow. This should be an evocative image that fits your site's look, feel, and branding. The copy should call out the incentive specifically, and as concisely as possible. See Figure: Offer Display for an example. Note that the grey Sharing Channels boxes are populated by the app, and should not be included as part of the art. Your art should also take the placement of this box into account - it cannot be moved.


Figure: Offer Display

2. Referral Email Image (suggested 750x200 pixels): You can customize the look of the email sent when your customer refers her friends to your site via email. This is done in the Email tab of the Refer-a-Friend's settings. We provide a basic template already, which you are free to use - you'll just need to provide a branded image to put in the email. This image can also explain what the friend will get for clicking the link. Returning to Susan and Courtney and the "Give $10, Get $10" example, this image should explain that Courtney will save $10 by clicking this link to visit your site. The email contents are highly customizable via HTML, so there is no hard requirement for the size of this piece. However, if you don't plan on heavily modifying the template we provide, we find that 750x200 pixels works well.

3. Facebook Image (suggested 470x265 pixels): This image should be similar to the Referral Email Image, but requires a different size due to potential variances in how the image might be seen by friends on Facebook. Again, this image should be branded, but in this case copy should be minimal to account for variances in how it might be seen. Don't worry - the post contents are entirely customizable and can specify the incentive being offered if necessary.

Figure: Facebook Post Image

4. Friend Pop-Up Banner (Desktop: 750x200 pixels; Mobile: 280x100 pixels): This should be a simple, branded image. It is seen as part of the pop-up a customer sees when they click on a shared referral link and land on your site (regardless of what channel they saw the referral link on). This image can contain a welcoming message, and/or explain the incentive they have earned, but it is not necessary - the pop-up itself is customizable and can explain the specifics of the incentive. See Figure: Friend Offer Pop-Up for an example.

Figure: Friend Offer Pop-Up


5. Reward Email Image (suggested 750x200 pixels): The Reward Email is sent to a customer once their friend has clicked the referral link and visited your site. Like with the Referral Email, you can customize the look of this email. This is done in the Basic tab of the Refer-a-Friend's settings. We provide a basic template already, which you are free to use - you'll just need to provide a branded image to put in the email. This image should also explain what your customer earned for referring their friend to your site. Returning to Susan and Courtney and the "Give $10, Get $10" example, this image should explain that Susan earned a $10 coupon because Courtney used her link to visit your site. The email contents are highly customizable via HTML, so there is no hard requirement for the size of this piece. However, if you don't plan on heavily modifying the template we provide, we find that 750x200 pixels works well.


6. Sidebar (no size requirement): The sidebar is what customers see on desktop devices, if they view the Refer-a-Friend app but close it without interacting with it. In many suggested Refer-a-Friend implementations, a sidebar is not used, but we recommend having one just in case. The sidebar should reflect the look and feel of your site, and briefly describe what the customer gets for referring their friends. See Figure: Offer Display for an example. While there is no size requirement, you'll want to make sure you keep the layout of your site in mind - you don't want to cover up any important components of your site with this sidebar!


7. Landing Page Background Image (1050x530 pixels): ShopSocially also provides a landing page option for your Referral Program, which is an excellent option for driving traffic directly to your Referral Program. Since it's a full-page implementation, it requires larger art. It should otherwise be identical to your Background Offer Image. See Figure: Landing Page for an example.


8. Landing Page Header: The landing page option also has a header available, which can be customized via HTML. While optional, it is recommended this header include an image of your site logo at the very least. If you'd like to do something larger, it should be 1050 pixels across, to match the size of the Landing Page Background Image.


Figure: Landing Page


Once you have the required collateral ready, you can configure and activate the Refer-A-Friend campaign. Visit Configuring Refer-A-Friend for help on configuring the App.