Shopify: Landing Page

This page is part of our wider Shopify guide - if you haven't already, we recommend visiting our Shopify: Getting Started article.

A landing page is a great way to get customers engaged with your referral program without them needing to make a purchase to see the offer.

This landing page will later act as a destination for promotion of the referral scheme via emails, or on site, or in social etc.

Here's an example from one of our clients:

Creating a Landing Page

To create a Landing Page you will need to:

1. Login to your Shopify site and visit Shop Pages, at https://yoursite.myshopify.com/admin/pages
2. Create a new page, giving it a sensible name like "Referral Landing Page". You may wish to ensure the page is Hidden to start with.
3. Using the code editor add the code below.

Here's a screenshot of someone editing their landing page as an example - note the highlighted code editor symbol to switch between "text" and "HTML" modes. Please enter the below code under "HTML" mode.

This is the code you'll need to insert into the page:

<div id="mmWrapper"></div>

<script>
// Enter your Mention Me partner code here:
var partnerCode = "INSERT_PARTNERCODE";

var urlComponents = [
    "https://tag.mention-me.com/api/v2/referreroffer/",
    partnerCode
]

var queryComponents = [
    ["situation", "landingpage"],

    // Locale
    ["locale", Shopify.locale + "_" + Shopify.country],
];

queryComponents = queryComponents.map((qc) => qc[0] + "=" + encodeURIComponent(qc[1]));

var url = urlComponents.join("") + "?" + queryComponents.join("&");

var script = document.createElement("script");
script.src = url;

document.getElementsByTagName("head")[0].appendChild(script);
</script>

Update the variables

Staying within this page, you will need to make some changes to this code.

PartnerCode

You must update replace INSERT_PARTNERCODE with your own Mention Me PartnerCode. If you don't know it, request your PartnerCode from your Onboarding Project Manager.

Locales

If you have multiple Locales / Regions that you serve, you may also wish to update the code we have provided.

This is the line:

// Locale 
["locale", Shopify.locale + "_" + Shopify.country],

You can learn more about setting this via our article on Shopify: Locales.