How to Embed your Referral Experience Inline on a Page

At Gather we give you several options on how to display your referral campaign on your website.

In this article we show you how the embed your campaign interface inline on a page of your website.

For your campaign to appear on a page, in the Editor section of your Gather account, ensure that you have selected to embed the campaign on your website.

To embed your campaign you will need to add some code to your chosen page. To access the code required to integrate your campaign on a page, navigate to the ‘Integrate’ section of your Gather account to the following:

The first line of code (in yellow above) will embed your campaign on the page, within an i-Frame. See image below for example of the code on our site. For the i-Frame to appear you will need to include a width and height for the <div> in your code.

You can make adjustments to the styling of the <div>, like the one provided (in orange above). Here we have stipulated the height and width of the <div>, given it a border and included a margin.

Below is a snap shot of the code we have used to embed our example campaign on our page.

Gather even provides you with the code so that your embedded referral experience scrolling moves with your page. (In pink above). Using the following code:

When you load up the page on which you have embedded your campaign, a loading spinner will appear whilst Gather loads up on the page.

Got any questions? First head to your Gather account, then click on the Help & Support menu item on the left hand side or check out the help articles here at academy.