Genius Referrals Integration with HubSpot: Referral Capture and Rewards

Learn how to integrate Genius Referrals with HubSpot to capture referrals, promote your program, and automatically issue rewards when deals are Closed-Won.
Please Note: HubSpot Integration is only available on certain Genius plans. See our plans and pricing here.

Prerequisites

Before starting with the integration of Genius Referrals into HubSpot, ensure that you meet the following requirements and initial configurations:

  • Active HubSpot Account: You must have access to a HubSpot account with permissions to create pages and automate processes.
  • Genius Referrals Account: You need an active Genius Referrals account with a configured referral program.
  • Zapier Account (Optional): If you wish to automate the issuance of bonuses when closing deals, you will need a Zapier account.

Installation of the Advocate Portal for the Referral Program in HubSpot

Step 1: Create a Page for the Advocate Portal

  1. Log in to your HubSpot account and create a new page. Name it "Refer and Earn" or a similar title that reflects the purpose of the referral program.
  2. Customize the design and content of the page according to your needs.

Step 2: Insert the Referral Program Code Snippet

  1. In the Genius Referrals platform, select the code snippet that best suits your installation (Embedded Code, Pop-up Window, or Floating Bubble). You can obtain the corresponding code snippet by navigating to Configure Program > Integrations > Code Snippets > Installation.
  2. Copy the corresponding code and paste it into the editor of your page in HubSpot.
  3. Save the changes and publish the page.
Your advocate portal will now be integrated and ready for users to participate in your referral program.
Installation options.
Example of Embedded Code
<!-- STARTING GENIUS REFERRALS CODE SNIPPET -->
<span class="gr-widget-design" id= "gr-referral-program-home-page">&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.1.2.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: Test and Verify

Once the installation is complete, the advocate portal should load correctly, and your customers and visitors will be able to access the program and recommend your services.
Referral Program Installed in HubSpot.

How to Promote Your Referral Program with the One-Click Access Link

Step 1: Generate the Quick Access Link

  1. Go to the Configure Program > Integrations > Code Snippets > Other > One-Click Access section in the Genius Referrals Admin Portal.
  2. Enable the One-Click Access feature.
  3. Select the HubSpot platform.
  4. Copy the generated link for HubSpot.
One-Click Access Link for HubSpot
Step 2: Create an Email Marketing Campaign
  1. Log in to your HubSpot account and create an email marketing campaign.
  2. Design an email inviting your customers to participate in the referral program. Explain the benefits and how the program works.
  3. Include the One-Click Access Link in the body of the email. You can add it as a standard link or a eye-catching button.
  4. Send the campaign to your contact list.
This link makes it easy for advocates to refer your business quickly and effectively.

Capturing Referrals on a Landing Page in HubSpot

Step 1: Design the Landing Page

  1. Create a new landing page in HubSpot with a form to capture referral information.
  2. Make sure to include key fields such as first name, last name, email address, and any other relevant data.
Landing page for the referral program in HubSpot.
Step 2: Generate the Tracking Code
  1. Go to the Configure Program > Integrations > Code Snippets > Conversion Tracking > Scenarios section.
  2. Select the scenario that best fits your needs (The steps and code snippets to install vary depending on the selected scenario. For this guide, scenario E016 was selected).
  3. Enter the URL of the page where your subscription form is located (Step 1).
  4. Indicate how the form fields and buttons correspond to the referral data.
  5. Set the cookie expiration time (e.g., 180 days).
  6. Generate the code snippet.
Example of a tracking code snippet
Code snippet generated for the selected scenario E016.
<!-- STARTING GENIUS REFERRALS TRACKING CODE -->
<script type="text/javascript">
!function (){
const submit = function (e){
const grFirstName=document.getElementsByName("name")[0].value,
grLastName=document.getElementsByName("name")[0].value,
grEmail=document.getElementsByName("email")[0].value,
grMetadata='['+']';
if (grEmail != '') {
e.preventDefault();
const grSetting={
     "grTemplateSlug": "referral-program-home-page-1706201",
     "grCustomerFirstname": grFirstName,
     "grCustomerLastname": grLastName,
     "grCustomerEmail": grEmail,
     "grMetadata": grMetadata,
     "grCustomerCurrencyCode":  "USD",
     "grCanRefer": "false",
     "grReference" : "1617140514"
}
const button = this;
GRToolbox.processCustomerAndBonus(grSetting).then(function(){
button.onclick=function(){};button.click();});}};
const grSettingCookie={
     "grCookieLifeTime": "180",
},
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.1.4.min.js",e.onload=function(){GRToolbox.catchReferrer(grSettingCookie);t.getElementsByClassName("w-button")[0].onclick = submit;};const n=t.getElementsByTagName("script")[0];n.parentNode.insertBefore(e,n)},!1)}();
</script>
<!-- ENDING GENIUS REFERRALS TRACKING CODE -->
Step 3: Install the Tracking Code in HubSpot
  1. In HubSpot, locate the page where your subscription form is located (Step 1).
  2. Edit the page and go to the Settings tab, then select the Advanced options section.
  3. Find the Additional code snippets - Footer HTML option and insert the code obtained earlier.
  4. Save the changes.
Prueba de que la referencia (Matt) se ha creado con éxito.

Una vez que John haya compartido los servicios con Matt, Matt hará clic en el enlace para compartir de John y aterrizará en su tienda. Matt buscará su producto, agregará algunos al carrito y finalmente pagará por los productos. Una vez que Matt haya completado una compra, se generará una nueva referencia en Genius Referrals. Para verificar si se ha creado la nueva referencia, vaya a la sección de su defensor sobre referencias Genius. Deberías poder ver a Matt en la list
Details of the Code Snippet to Be Placed in Your Editor
Step 4: Test and Verify
Once you have completed the installation of the tracking code snippet, your referral program will start capturing referrals automatically. To ensure it works correctly, we will perform a test using the following scenario.
Scenario: E016
In scenario E016, we aim to capture referrals when they contact your company through an online contact form.
Flow of Scenario E016 for the Referral Program
Assumptions:
  1. You have a website on HubSpot.
  2. You have set up a referral program in Genius Referrals so that your customers and visitors can refer your products to friends, family, colleagues, etc.
  3. In the referral campaign, you offer $10 to customers for each qualified referral that signs up for your services.
  4. John Smith is one of your best customers and is happy to share your services with his contacts. His personal details are: First Name: John, Last Name: Smith, Email: john@example.com.
  5. John refers his friend Matt to schedule a demo on your website. Matt's personal details are: First Name: Matt, Last Name: Hanks, Email: matt@example.com.

Scenario Flow:
  1. John accesses the referral program, obtains his personalized URL (PURL), and sends it to Matt.
  2. Matt clicks on the personalized URL and completes the contact form.
  3. A referral is automatically generated in Genius Referrals.

Test That John Can Share Your Services

For John to recommend your brand, he must access the Advocate Portal page and send his personalized link (PURL) to Matt so that Matt can request a demo by completing the contact form.


Allow Your Customers to Refer Your Services in Your Referral Program
Test That the Referral Has Been Successfully Created

After John shares his personal link, Matt will click on it and land on your landing page. Once Matt completes the contact form, a new referral will be generated in Genius Referrals. To verify if the referral has been created correctly, go to the Members section, where you should see Matt listed.

Generating a New Referral.

How to Issue Bonuses When a Deal is Won in HubSpot

Step 1: Set Up Zapier for Integration
  1. Access the Genius Referrals app on Zapier: Genius Referrals on Zapier.
  2. Connect your Genius Referrals and HubSpot accounts in Zapier.
Step 2: Create a Zap to Issue Bonuses
  1. Set up the 'Deal Property Change' trigger in Zapier to detect when a deal in HubSpot is marked as "Closed Won."
  2. Add the following actions to issue a bonus in Genius Referrals:
  • Find Associations
  • Get Contact
  • Find Member
  • Process Referral to Trigger Bonuses
Step 3: Test and Activate the Zap
  1. Perform a test by creating a "Closed Won" deal in HubSpot and verify that the corresponding bonus is issued.
  2. Activate the Zap to automate the process.
With this integration, bonuses will be issued automatically when a deal is "Closed Won" in HubSpot, saving time and ensuring accuracy in rewards.
Was this page helpful?
Español
LANGUAGE