How to Add Affiliate Program to Framer with Blossu

Add referral tracking to your Framer site using custom code in site settings. This takes just a few minutes.

Image: Framer + Blossu integration overview

Open site settings

In the Framer editor, click on the Settings icon (gear) in the top right corner.

Navigate to the "General" tab and scroll down to "Custom Code".

Image: Accessing custom code settings in Framer

Add to head

In the "Start of <head> tag" section, paste this script:

HTML

<script
  async
  src="https://js.blossu.com/v1/blossu.js"
  data-program-id="YOUR_PROGRAM_ID"
></script>

Replace YOUR_PROGRAM_ID with your actual program ID from the Blossu dashboard.

Image: Adding the script in Framer custom code

Publish your changes

Click "Publish" to deploy the changes. The script will now load on all pages of your Framer site.

To verify the installation:

Visit your published site with a test referral link (e.g., yoursite.framer.website?via=test)
Open your browser's developer console
Check if window.blossu_ref_id is defined

Image: Verifying the installation

How it works

When a visitor arrives via a partner referral link, the script captures the referral and stores it as a first-party cookie. This persists for 60 days and is used to attribute any conversions to the referring partner.

Next steps

Now that you have tracking set up, you need to connect your payment platform to automatically track conversions and calculate partner commissions.

How to track affiliates and revenue with Stripe