How can I create a custom unsubscribe page?

By default, Mixpanel directs users who click on the unsubscribe link from emails to a Mixpanel-hosted unsubscribe page. This page runs a script that sets a people property $unsubscribed , with the value set to the timestamp the user unsubscribed - to that user’s profile. This prevents the user from receiving any more messages from that project, but does not globally unsubscribe them from Mixpanel messages.

However, it is possible to redirect users who click on the unsubscribe link from a Mixpanel email message to your own domain. This gives you a chance to re-engage with those customers one last time or style the page to match your site’s design.

Requirements

  • You must either be setting users’ distinct_ids as an additional property on their profiles; OR

  • You must be setting a different user ID, like email address or username, that is aliased to the Mixpanel distinct_id as a property on their profiles.

Setup

Your custom unsubscribe link will then look something like this - in this example, we’re using $email, which is set as a property on users’ people profiles and is aliased to the Mixpanel distinct_id:

<a href="www.example.com/unsubscribe.html?id={{$email}}">Unsubscribe</a>

Now on the unsubscribe page (www.example.com/unsubscribe.html), we will use our function to grab the value for “id.” However, instead of setting this value as a super property, we will use it as the distinct_id of a people set. This will allow us to set the “$unsubscribed=True” property to that specific user’s profile:

function getQueryParam(param) {
    param = param.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
    var regexS = "[\\?&]" + param + "=([^&#]*)",
        regex = new RegExp( regexS ),
        results = regex.exec(document.URL);
    if (results === null || (results && typeof(results[1]) !== 'string' && results[1].length)) {
        return '';
    } else {
        return decodeURIComponent(results[1]).replace(/\+/g, ' ');
    }
};

var distinct_id = getQueryParam("id");
mixpanel.people.set({"$unsubscribed":"true"});
mixpanel.identify(distinct_id);
mixpanel.track("$unsubscribe",{
    "Campaign ID": campaign name,
});

Once your custom unsubscribe page is built, remember to uncheck the default unsubscribe option on your emails, and insert the link to your custom unsubscribe page at the end of your email instead:

alt text