There isn’t an official Squarespace and Refersion integration, but with some setup and testing, you’ll be able to integrate using Zapier. We’ve had success with the following steps, though other options certainly exist.

Before you get started please note:

  • This is an advanced tutorial; familiarity with both Zapier and webhooks will be required. We recommend looping in your developer.

  • This integration uses the Squarespace Commerce APIs and therefore requires a subscription to Squarespace's Advanced Commerce plan or higher.

  • You will need a paid Zapier plan that supports at least 1 Premium app.

In this article you’ll learn how to track clicks from affiliate referrals on Squarespace, send order details from Squarespace into Zapier and have Zapier send order data into Refersion to create conversions:

Step 1: Add Refersion's tracking scripts to your Squarespace site

In order to track clicks back to affiliates when customers visit your site, you'll need to add the following click tracking script to all pages of your website. In Squarespace you can do this by navigating to Settings → Advanced → Code Injection and pasting the below code snippet into the header box.

Important note: You’ll see on the 4th line in the code snippet below “YOUR_PUB_KEY”. Be sure to replace that with your specific public key from your Refersion account. You can find your public key in Refersion by navigating to Account> Settings>Refersion API.

<script>
!function(e, n, t, i, o, c, s, a) {
e.TrackingSystemObject = "rfsn", (s = n.createElement(t)).async = 1, s.src = "https://cdn.refersion.com/refersion.js", s.onload = function() {
rfsn.pubKey = "YOUR_PUB_KEY", rfsn.settings.fp_off = 1;
rfsn.initializeXDLS().then(() => {
rfsn.launchDefault()
})
}, (a = n.getElementsByTagName(t)[0]).parentNode.insertBefore(s, a)
}(window, document, "script");
</script>

In addition to the click tracking script, you'll also need to include the following code snippet on your order confirmation page. This script is responsible for two important tasks:

  • Sending the order ID into Zapier to start the Zapier workflow.

  • Sending the order ID into Refersion to serve as the cart identifier for the click that just happened.

Before you copy and paste the script below in Squarespace, be sure to grab your Zapier webhook URL from step 1 of this zap template and use it to replace the words “ZAPIER_WEBHOOK_URL” in the snippet below. Then copy it into the “Order Confirmation Page“ code box in Squarespace.

<script>
if (localStorage.getItem("rfsn_v4_aid")) {
// Fetch order ID from URL query string
let qs = new URLSearchParams(window.location.search);
let oid = qs.get("oid");

// Send webhook with order id to Zapier
fetch("ZAPIER_WEBHOOK_URL", {
"method": "POST",
"body": JSON.stringify({order_id: oid})
}).then(() => {
// Send checkout event to Refersion with order ID as the cart identifier
const rfsnObj = {
cart: oid,
id: localStorage.getItem("rfsn_v4_id"),
url: window.location.href,
aid: localStorage.getItem("rfsn_v4_aid"),
cs: localStorage.getItem("rfsn_v4_cs")
};
rfsn.sendCheckoutEvent(rfsnObj.cart, rfsnObj.id, rfsnObj.url, rfsnObj.aid, rfsnObj.cs)
}).catch(err => {console.error(err)})
}
</script>

Step 2: Set up the Zap Template

In order to complete the Zap setup, we’ll need the order ID from the order confirmation page that was sent to Zapier. Make sure you have your Zapier template open; then, in a new incognito window, place a test order in your store using an affiliate's link. We recommend using a 99% or 100% discount code to reduce testing costs.

As soon as you complete your order and reach the confirmation page, return to step 1 of your Zap and click “Test Trigger”. This will pull in the data that was just sent to Zapier. Here’s how it should look in Zapier:

Step 2 of the zap will get the order details from Squarespace's Commerce APIs. The URL needed for Zapier to get the order should be configured for you already in this step; all you will need to do is enter your API key from your Squarespace account.

To create a new API key in Squarespace, head to Settings → Advanced → Developer API Keys and click the “Generate Key” button. In the modal that appears, give the new API key a name and check off the permissions box to allow for reading orders.

Once you have that key, paste the key into the “Headers” section found toward the bottom of the second step in Zapier.

Important note: A space must be left between the word “Bearer” and your Squarespace API key.

Once that’s in place, click “Test & Review” to pull in order data for the order ID that was sent into Zapier. The data pulled in should reflect the details of the order you just placed.

The last step of the Zap will send the order data that was just pulled in from Squarespace into Refersion. Be sure to hit "Test & Review" for this step to ensure the data is sent into your Refersion account. It may take up to 10 minutes for the conversion data to appear in Refersion.

Once everything is complete you’re ready to turn on your zap. We recommend running one more test order to confirm everything is working as intended.

If you run into any problems getting integrated, please email us at [email protected].

Did this answer your question?