Help Center

Embed a sharing panel in my store

Last Updated: Mar 28, 2017

The ReferralCandy Embedded Sharing Panel allows you to:

  • Embed a signup widget on your website for your referral program, or
  • Embed a personal sharing widget for each customer on his / her own user account page in your store (To do this, in the 'Customization' section below, add a data-email attribute with the customer's email address)


Note: Your referral campaign must be Active / Paused in order for the Embedded Sharing Panel widget to appear. When your campaign is "Stopped", the Embedded Sharing Panel will show a transparent panel instead (i.e nothing will be shown).

Here's an example of what a customer who is logged into his user account at Acme store sees when he goes to his account's Refer-a-Friend page: 



If your shopping cart platform allows insertion of an HTML/JavaScript snippet (or if you are self-hosting), you can embed a sharing panel in your store.

  1. Go to the Widgets section of your dashboard

  2. Go to the 'Embedded Sharing Panel' section


     
      3. Copy the HTML/JavaScript snippet



      4. Insert into your store's page just before the HTML </body> tag


Customize your sharing panel by changing / adding attributes of the iframe:

  • data-height: Height of the sharing panel in pixels or percentage

  • data-width: Width of the sharing panel in pixels or percentage (Note: use 100% if you want the panel to be responsive to the width of the browser e.g. for mobile)

  • data-email: Specify this attribute (e.g. data-email="john@example.com") to display the sharing panel for a specific customer. Leave this attribute out to display a view similar to your Advocate Join Page

  • data-fname: (only if data-email is specified) First name of customer (e.g. data-fname="John") 

  • data-lname: (only if data-email is specified) Last name of customer (e.g. data-lname="Doe")


Note: If you are using the data-email, data-fname, or data-lname attributes, be sure to generate the values dynamically to match the customer logged in to your store.

Shopify store owners need to insert the code at the bottom of the customer/account.liquid page, which can be found in a Shopify account at:

Online Store → Themes → Customize Theme → Theme Options → Edit HTML/CSS → customers/account.liquid

The following dynamic values can be used: 

  • data-email="{{order.email}}" 
  • data-fname="{{order.customer.first_name}}" 
  • data-lname="{{order.customer.last_name}}"

Still have questions? Contact us.

Have other questions? Contact us.

support@referralcandy.com
https://cdn.desk.com/
false
desk
Loading
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
about
false
Invalid characters found
/customer/en/portal/articles/autocomplete