How to Integrate Genius Referrals with Your PrestaShop Store

Discover how to enhance your referral program by integrating Genius Referrals with your PrestaShop online store. By the end of this guide, you’ll have a referral program set up in your store that allows your customers and visitors to become advocates, share your products, and earn rewards for each qualified referral.

PrestaShop is an open-source e-commerce platform that enables the creation and management of online stores. It is popular for its flexibility, customization options, and built-in SEO and marketing tools. It supports multiple languages, currencies, payment methods, and shipping options, making it ideal for small to medium-sized businesses.
Prerequisites
  • Register on Genius Referrals: Create an account to get started.
  • Advocate Portal: You can choose and personalize a referral program template tailored to customers, affiliates, employees, and influencers.
  • Active Prestashop store: Ensure your Prestashop store is live and ready to add the integration code snippets.

Step 1: Starting the PrestaShop Integration with Genius Referrals

To integrate the Genius Referrals program into your PrestaShop store, you'll need to insert three specific code snippets on different pages:

  • Code Snippet to install the advocate portal template.
  • Tracking Code Snippet on the homepage to monitor referrals.
  • Conversion Code Snippet on the thank-you page after purchase.
Refer to the next section for detailed instructions and examples for each step in your store.

Step 2: Choosing the Installation Code Snippet for Prestashop

In this step, choose the Genius Referrals installation method that best suits your online store: Embedded Code, Pop-up Window, or Floating Bubble. To access the details of each option and retrieve the appropriate code snippet, navigate to Program Setup > Integrations > Code Snippets > Installation in the Genius Referrals platform.

For the Pop-up Window or Floating Bubble options, you'll also have access to a configuration section to further customize elements like style and placement on your website.
Integration Options for Your Referral Program with Third-Party Platforms
To generate the code snippet:
  1. Click on the desired option.
  2. Select the page you want to install.
  3. Copy the corresponding code snippet.
  4. Follow the instructions to install it in your store.
This process will give you the code to install the Advocate Portal in Prestashop.
Embedded Code Example
To embed the referral program in Squarespace using the Embedded Code option, use the following code snippet:
<!-- STARTING GENIUS REFERRALS CODE SNIPPET -->
<span class="gr-widget-design" id= "gr-referral-program-home-page-1646">&nbsp;</span>
<script type="text/javascript">
!function(){
const grSetting={
     "grTemplateSlug": "referral-program-home-page-",
     "grCustomerCurrencyCode": "USD",
     "grLanguage": "es",
     "grInstallMethod":"embeddedcode"
},
e=window,t=document;e.addEventListener("load",function(){const e=t.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://e9f87d8c82343264e6ba-2977c39e5e9390b1a89ab5ed2a171102.ssl.cf1.rackcdn.com/toolbox/geniusreferrals-toolbox_3.0.0.min.js",e.onload=function(){GRToolbox.init(grSetting)};const n=t.getElementsByTagName("script")[0];n.parentNode.insertBefore(e,n)},!1)}();
</script>
<!-- ENDING GENIUS REFERRALS CODE SNIPPET -->
Modal Window Example
To install the referral program in Squarespace using the Popup option, use the following code snippet:
<!-- STARTING GENIUS REFERRALS CODE SNIPPET -->
<span class="gr-widget-design" id= "gr-referral-program-home-page-1646">&nbsp;</span>
<script type="text/javascript">
!function(){
const grSetting={
     "grTemplateSlug": "referral-program-home-page-",
     "grCustomerCurrencyCode": "USD",
     "grLanguage": "es",
     "grInstallMethod":"embeddedcode"
},
e=window,t=document;e.addEventListener("load",function(){const e=t.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://e9f87d8c82343264e6ba-2977c39e5e9390b1a89ab5ed2a171102.ssl.cf1.rackcdn.com/toolbox/geniusreferrals-toolbox_3.0.0.min.js",e.onload=function(){GRToolbox.init(grSetting)};const n=t.getElementsByTagName("script")[0];n.parentNode.insertBefore(e,n)},!1)}();
</script>
<!-- ENDING GENIUS REFERRALS CODE SNIPPET -->
Floating Bubble Example
To install the referral program in Squarespace using the Floating Bubble option, use the following code snippet:
<!-- STARTING GENIUS REFERRALS CODE SNIPPET -->
<span class="gr-widget-design" id= "gr-referral-program-home-page-1646">&nbsp;</span>
<script type="text/javascript">
!function(){
const grSetting={
     "grTemplateSlug": "referral-program-home-page-",
     "grCustomerCurrencyCode": "USD",
     "grLanguage": "es",
     "grInstallMethod":"embeddedcode"
},
e=window,t=document;e.addEventListener("load",function(){const e=t.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://e9f87d8c82343264e6ba-2977c39e5e9390b1a89ab5ed2a171102.ssl.cf1.rackcdn.com/toolbox/geniusreferrals-toolbox_3.0.0.min.js",e.onload=function(){GRToolbox.init(grSetting)};const n=t.getElementsByTagName("script")[0];n.parentNode.insertBefore(e,n)},!1)}();
</script>
<!-- ENDING GENIUS REFERRALS CODE SNIPPET -->

Step 3: Installing the Advocate Portal in Prestashop

Follow these steps to integrate the Genius Referrals template into your Prestashop store:

  1. Log in to your Prestashop account using your credentials.
  2. Create a new page with a blank layout and name Refer and Earn.
  3. Copy the code snippet from the previous step for the Advocate Portal.
  4. Navigate to the "Advanced" section within the Page Settings to customize the HTML code for your new page.
  5. Paste the copied code snippet from Step 2.
  6. Save all changes, then load the Refer and Earn page to see the template in action.

Step 4: Select Tracking and Conversion Scripts

  1. Go to the Integrations section in the Genius Referrals platform.
  2. Navigate to the Code Snippets subsection.
  3. Locate the Conversion Tracking section and click on Platform.
  4. Select Prestashop from the platform dropdown.
  5. Set the cookie expiration time, which determines how long the tracking cookie stays active in browsers to track your referrals (e.g., 180 days).
  6. Click the Next button to generate the code snippet and follow the installation instructions.
Obtain the Code Snippets for Tracking and Conversions
Tracking Code Snippet
<!-- STARTING GENIUS REFERRALS TRACKING CODE -->
<script type="text/javascript">
!function(){
const grSetting={
     grCookieLifeTime:"180"
},
e=window,t=document;e.addEventListener("DOMContentLoaded",function(){const e=t.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://e9f87d8c82343264e6ba-2977c39e5e9390b1a89ab5ed2a171102.ssl.cf1.rackcdn.com/toolbox/geniusreferrals-toolbox_3.6.2.min.js",e.onload=function(){GRToolbox.catchReferrer(grSetting)};const n=t.getElementsByTagName("script")[0];n.parentNode.insertBefore(e,n)},!1)}();
</script>
<!-- ENDING GENIUS REFERRALS TRACKING CODE -->
Conversion Code Snippet
<!-- STARTING GENIUS REFERRALS TRACKING CODE -->
<script type="text/javascript">
!function(){
const grSetting={
     "grTemplateSlug": "referrals-landing-page-748",
     "grCustomerFirstname":"{$customer.firstname}",
     "grCustomerLastname":"{$customer.lastname}",
     "grCustomerEmail":"{$customer.email}",
     "grCustomerCurrencyCode": "USD",
     "grCanRefer": false,
     "grReference" :"Order Number {$id_order}",
     "grPaymentAmount" :"{$total}"
},
e=window,t=document;e.addEventListener("DOMContentLoaded",function(){const e=t.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://e9f87d8c82343264e6ba-2977c39e5e9390b1a89ab5ed2a171102.ssl.cf1.rackcdn.com/toolbox/geniusreferrals-toolbox_3.6.2.min.js",e.onload=function(){GRToolbox.processCustomerAndBonus(grSetting).then(e=>{})};const n=t.getElementsByTagName("script")[0];n.parentNode.insertBefore(e,n)},!1)}();
</script>
<!-- ENDING GENIUS REFERRALS TRACKING CODE -->
Step 5: Testing and Verification
After completing the installation, your referral program should be fully operational. Customers and visitors should be able to access it and recommend your services.

Here’s a quick checklist to ensure everything is functioning correctly:

  • Verify Program Access: Ensure customers can access the referral program without issues.
  • Check Referrals: Confirm that referrals are successfully created in Genius Referrals.
  • Check Bonuses: Ensure that advocates receive their bonuses once the referrals complete a purchase.
Scenario: Referring New Leads to Prestashop

Assumptions:

  • You operate a Prestashop store specializing in T-shirts.
  • Your store has a referral program implemented through Genius Referrals.
  • Customers receive a $10 reward for each qualified referral that results in a purchase.
In this scenario, one of your loyal customers, John Smith, refers his friend Matt to your store. As a result, John earns a $10 bonus once Matt completes a purchase.
Referral Program Flow
Testing John's Ability to Share Products
For John to refer products, he needs to visit the Advocate Portal and utilize the tools in the Share tab. John will have access to all available sharing options. In this scenario, he sends Matt his personal link so Matt can browse the products and make a purchase.
Allow customers to refer your products through your referral program.
Verifying Successful Referral Creation
Once John shares his personal link, Matt clicks on it and arrives at your website. After Matt completes a purchase, a new referral will be generated in Genius Referrals. To ensure the referral has been successfully created, go to the Members section, where you should find Matt listed.
Generating a new referral
Verifying John's Bonus
Now, let's check that John, the advocate, receives his bonus after Matt completes his purchase. Once Matt finalizes his order, John should receive a $10 bonus. To confirm that the bonus has been awarded, go to the Bonuses section. You should see John's new bonus listed there.
Bonus awarded to the advocate in the referral program.
Was this page helpful?
Español
LANGUAGE