Product Share Referral Module

The product share referral module allows shoppers to share recently purchased products with their friends.
The same settings apply to both site referral and product referral, but the product share referral link will take referred friends directly to the shared product’s page - making the path to purchase even shorter.
The ability to share specific products drives increased engagement by enabling shoppers to further personalize the referral experience. In turn, this can lead to an increase in new customer acquisition and referral revenue.

Customer journey

Below is an overview of the product share referral process: 

Referring customer:

1. Referring customer makes a purchase
2. Post-purchase product share referral popup appears
3. The customer chooses a product they wish to share and their preferred sharing method - email, Twitter, Facebook, etc.

Referred friend:

1. The referred friend received a message from the referring customer and clicks the referral link.
2. Referred friend lands directly on the product page and sees the Referral Welcome popup that includes a discount code

This discount can be used across your store and does not apply only to the shared product - all in accordance with the settings applied to your referral program. 

Setting up product share referral

This functionality requires setting up the Share Product module. With it, you can quickly build a customized and intuitive user experience for your referring customers, without the need for any development. 

Before you begin

Before creating and customizing the module, make sure to set up your referral incentives, as these apply across your referral modules.

Accessing the module

1. In your Loyalty & Referrals main menu, go to Display On-site > Referrals.
2. Go to the Share Product section and click Create.

Customizing module settings

Share options

In this section, you'll be able to configure the share channels present on the desktop and mobile versions of your module, as well as customize the messages sent via those different sharing methods. You can enable your referring customers to share products via the listed methods. You can even determine which share methods are available on mobile and desktop:

• Email - This setting has two additional options:
  • Marketing email (default) - this email will be sent through either your Yotpo Triggered Emails or through the ESP solution you integrated with Yotpo Loyalty & Referrals.
  • Personal email - this is a personal email that will be sent directly from the referring customer’s own Gmail, Yahoo, or Outlook account.
• SMS - Mobile text message
• Copy link - Allow customers to copy the referral link and share it however they want. 
• Facebook  - Facebook posts and Messenger
• WhatsApp text message

Main share option

Here you can choose the default share option that will be presented to customers.You can set a different default option per user type - mobile user and desktop user.

Once the main share options are set, you can go through all the available share channels and configure the following settings:

• Enable/disable the option using the toggle

Please note:

If a share option is set as the main share option, its toggle and default device option will be grayed out. To unlock it, simply set a different share option as the main option.

• Choose availability depending on the device used - mobile or desktop.
• Edit the share message that will appear on the channel. 

Email share option

The email share option includes an additional setting - email type. There are two available types of share emails:

Share options - visuals

To help you visualize how this text will look within each sharing method, we've provided sample text and screenshots below:

Facebook post

Facebook Messenger

Look & Feel

Customize your module’s aesthetic and adjust it to fit your brand.

General

With these settings, you can control the overall appearance of your popup. This includes:

• How long till it shows up after a shopper completed a purchase.
• The background color and overlay.
• The main text, fonts, and color.
• The product gallery consists of the product just purchased by the shopper.

You can also add your own advanced customization by using the Custom CSS field. If you use custom CSS, you may see a notification asking you to update your module version from time to time. Read more about module versions.

Desktop share options

Here you can choose the colors, fonts, and text of the share options as they appear to a desktop user. The settings here will change dynamically in accordance with the share channels chosen in the Share Options tab.

Mobile share options

Here you can choose the colors, fonts, and text of the share options as they appear to a mobile user. 

The settings here will change dynamically in accordance with the share channels chosen in the Share Options tab.

Publishing the module

The module must be implemented post-purchase to encourage shoppers who just completed their purchase to share the great product with their friends.

You can display a post-purchase referral request by deploying an instance of the module to your checkout page. 

Once you’re done customizing your module instance, do the following:

1. Click the Publish button at the top right corner.
2. A popup with two pieces of code will appear:

3. In a new tab, go to your Shopify admin
4. Go to Settings > Checkout
5. In the Additional scripts field, paste both snippets of code.
6. Save your changes in Shopify.
7. Click the Publish changes button in your Yotpo Loyalty & Referrals admin.

Active/inactive module instance

If your module is active (green dot), this means that any changes you publish will be reflected on your store if the module snippet is embedded.

If your module is inactive (yellow dot), this means that any changes you publish/save will not be reflected on your store. This also means if you had the module snippet embedded and active on your store before, it will not be visible when inactive.