How to Set Up a Friend Landing Page

William Harper Updated by William Harper

The Friend Landing Page is a designated place where the Friend is sent to initiate the referral program. When the Advocate invites the Friend to make a purchase, they are directed to this page.

Constructing a landing page that helps increase the chances of your user converting is crucial to the success of your referral campaign. Remove CTA buttons linking to other offers and other sign-up display units from the referral landing page(s). You can do this by setting display rules when for a particular URL or based on a UTM parameter such as utm_source=friendbuy.


  1. Select 'Referral' in the left-side navigation 

  1. Select the Campaign for where the Friend Landing Page will live.
This step assumes a campaign already exists. Should you need to create your first campaign, head here.

  1. Navigate to the 'Widgets' tab in the Campaign.

  1. Select the 'Friend Landing Page' tile > Click 'Select Widget' under the tiles on the right-hand side.

  1. From the flyout, select a widget style from the 'Landing Pages'.

  1. In order for the widget to display correctly on a page, Friendbuy needs the following to be added:
    1. Add the HTML element(s) (a CSS id or class) where the widget will be inserted.

    2. Add the 'Friend Landing Page URL' dedicated to the referral program. The URL can be relative or absolute.

  1. When complete, toggle the widget to 'Is Visible' and then click 'Publish Changes'.

Add Widget to a Landing Page

  1. Create a new page with a URL path: During testing we recommend using a staging URL, test theme, or a hidden landing page to display this placement.
  2. Add the Friendbuy Container DIV <div id="friendbuyfriendspage"></div> in the body of the page between your standard site header and footer.

How did we do?

How to Set Up an Advocate Landing Page

How to Set Up a Post-Purchase Overlay