How to install the ProfitWell.js Snippet for Retain

Overview

ProfitWell Retain needs you to add bit of JavaScript to your application so that it can display in-app notifications to your users, as well as overlay our payment forms on-top of your marketing site. Installation requires adding the snippet both on your marketing site, as well as inside your web-app (if applicable).

Instructions for platform specific instructions below:

Marketing Site

Retain reduces the friction of needing your users to sign into your app to update their payment information by overlaying the payment forms directly on your marketing site. You can pick any public facing marketing site —see Meetup below.

Copy and paste this snippet of javascript on your site, making it available on as many pages of your site as possible (ideally, all of them). The ProfitWell snippet was designed to work asynchronously to not affect page load speed and to gracefully handle any errors to not affect the normal functioning of the page. 

<script id="profitwell-js" data-pw-auth="PUBLIC_API_TOKEN_HERE">
/* DO NOT DELETE - this code is used to accept our payments or send data to ProfitWell*/
(function(i,s,o,g,r,a,m){i[o]=i[o]||function(){(i[o].q=i[o].q||[]).push(arguments)};
a=s.createElement(g);m=s.getElementsByTagName(g)[0];a.async=1;a.src=r+'?auth='+
s.getElementById(o+'-js').getAttribute('data-pw-auth');m.parentNode.insertBefore(a,m);
})(window,document,'profitwell','script','https://public.profitwell.com/js/profitwell.js');

profitwell('start', {});
</script>
Update PUBLIC_API_TOKEN_HERE (on Line 1) with your public API token. Please see bottom of page for instructions on retrieval.

Web-App

If the user is logged in, make sure you pass the user's email to the snippet.

<script id="profitwell-js" data-pw-auth="PUBLIC_API_TOKEN_HERE">
/* DO NOT DELETE - this code is used to accept our payments or send data to ProfitWell*/
(function(i,s,o,g,r,a,m){i[o]=i[o]||function(){(i[o].q=i[o].q||[]).push(arguments)};
a=s.createElement(g);m=s.getElementsByTagName(g)[0];a.async=1;a.src=r+'?auth='+
s.getElementById(o+'-js').getAttribute('data-pw-auth');m.parentNode.insertBefore(a,m);
})(window,document,'profitwell','script','https://public.profitwell.com/js/profitwell.js');

profitwell('start', { 'user_email': 'USER_EMAIL_HERE' });
</script>
Update PUBLIC_API_TOKEN_HERE (on Line 1) with your public API token. Please see bottom of page for instructions on retrieval.

Remember to replace USER_EMAIL_HERE (at the bottom) with your customer email.
  • You can defer the call to profitwell('start', { 'user_email': 'USER_EMAIL_HERE' }); , in case your customer identity is loaded asynchronously.
  • You can substitute user email with the user id from your data provider (e.g. Stripe customer ID), which is helpful if: 1) there are multiple users under one user who is being billed 2) you don't have email info
    You will need to call profitwell('start', { 'user_id': 'PROVIDER_USER_ID_HERE' }); instead of profitwell('start', { 'user_email': 'USER_EMAIL_HERE' });

Do not use both user_email and user_id— Pick one one or the other.

Remember to replace PROVIDER_USER_ID_HERE with the customer ID from your data provider (e.g. Stripe customer ID).

Referrer Policy

The Referrer-Policy HTTP header controls how much referrer information (sent via the Referrer header) should be included with requests. Aside from the HTTP header, you can set this policy in HTML.

For the ProfitWell snippet to work correctly, you must set the policy referrer to strict-origin.

You can set referrer policies inside HTML. For example, you can set the referrer policy for the entire document with a <meta> element with a name of referrer: <meta name="referrer" content="strict-origin">

How to test the installed snippets

Visit this page here to test the marketing snippets.

How to find public API token

Under "Account Settings" > "Integrations" > "API Keys/Dev Kit"

If you copy-paste the snippet directly from the Integrations page, then the public API token should be automatically loaded in for you already.


How did we do?


Powered by HelpDocs (opens in a new tab)