Skip to main content
"Refer a Friend" + Instapage

How to install your Refer a Friend campaign in your Instapage website

Fivos Stergiannis avatar
Written by Fivos Stergiannis
Updated over a week ago

Integrate the Refer a Friend campaign on your website or web app by embedding the widgets directly in your pages.

Using the In-app Referral widget

You can have your campaign up and running on your website in minutes by installing the In-app Referral Widget.

Edit your page in Instapage by clicking the Settings (gear icon) in the right corner of the navigation bar and then Javascript:

In the Footer tab paste the following Javascript snippet which will add the In-app Referral Widget on the page of your website:

<script>!function(){var a=window.VL=window.VL||{};return a.instances=a.instances||{},a.invoked?void(window.console&&console.error&&console.error("VL snippet loaded twice.")):(a.invoked=!0,void(a.load=function(b,c,d){var e={};e.publicToken=b,e.config=c||{};var f=document.createElement("script");f.type="text/javascript",f.id="vrlps-js",f.defer=!0,f.src="https://app.viral-loops.com/client/vl/vl.min.js";var g=document.getElementsByTagName("script")[0];return g.parentNode.insertBefore(f,g),f.onload=function(){a.setup(e),a.instances[b]=e},e.identify=e.identify||function(a,b){e.afterLoad={identify:{userData:a,cb:b}}},e.pendingEvents=[],e.track=e.track||function(a,b){e.pendingEvents.push({event:a,cb:b})},e.pendingHooks=[],e.addHook=e.addHook||function(a,b){e.pendingHooks.push({name:a,cb:b})},e.$=e.$||function(a){e.pendingHooks.push({name:"ready",cb:a})},e}))}();var campaign=VL.load("YOUR_CAMPAIGN_ID",{autoLoadWidgets:!0});campaign.addHook("boot",function(){campaign.widgets.create("rewardingWidget",{container:"body",position:"bottom-right"}),campaign.widgets.create("rewardingWidgetTrigger",{container:"body",position:"bottom-right"})});</script>

Make sure to replace YOUR_CAMPAIGN_ID with your campaign ID that you can find in the Installation step of your Campaign Wizard.

Save and publish the page. The In-app Referral widget will appear on the page so that your visitors can use it to join the campaign and invite their friends.
​

Using the embeddable widgets

Edit your page in Instapage by clicking the Settings (gear icon) in the right corner of the navigation bar and then Javascript:

In the Footer tab paste the Javascript snippet and save the code.
​

Back to editing your page, from the navigation bar on the top click < > Html for each one of the widgets you want to use.

Double-click (or click EDIT on) the corresponding element and paste the following HTML in the HTML Widget to embed the Form Widget from Viral Loops:

<div data-vl-widget="embedForm"></div>

Copy and paste the following HTML in the HTML Widget to embed the Reward Widget from Viral Loops:

<div data-vl-widget="rewardStats"></div>

And that's it! Participants will use the Form Widget to join your campaign and invite their friends. On the Reward Widget they will see the rewards they have won by referring others to the campaign.
​

Is this helpful? Let us know! πŸ’œ

Did this answer your question?