Framer

How to add @dub/analytics to your Framer site

With @dub/analytics, you can track lead and sale conversions on your Framer site, enabling you to measure the effectiveness of your marketing campaigns.

You can add the @dub/analytics script to your Framer website same way you would add Google Analytics script or any other JavaScript code.

Follow these steps to add the script to your site:

• Go to your Framer project and open the Project Settings menu.
• Open the General tab and scroll down to the Custom Code section.
• Paste the Dub analytics script in the Start of head tag section.
• Click on the Save button to save the changes.

<script src="https://www.dubcdn.com/analytics/script.js" defer></script>

Concepts

You can pass the following props to the @dub/analytics script to customize its behavior:

data-api-host · url · default: "https://api.dub.co"

The base URL for the Dub API. This is useful for setting up reverse proxies to avoid adblockers.

data-attribution-model · first-click | last-click · default: "last-click"

The attribution model to use for the analytics event. The following attribution models are available:

• first-click: The first click model gives all the credit to the first touchpoint in the customer journey.
• last-click: The last click model gives all the credit to the last touchpoint in the customer journey.

data-cookie-options · JSON-stringified object

Custom properties to pass to the cookie. Refer to MDN’s Set-Cookie documentation for all available options.

Show properties

domain · string

Specifies the value for the Domain Set-Cookie attribute. This is useful for cross-domain tracking. Example: .example.com

expires · integer · default: "90"

Specifies the Date object to be the value for the Expires Set-Cookie attribute. Example: new Date('2024-12-31')

expiresInDays · integer · default: "90"

Specifies the number (in days) to be the value for the Expires Set-Cookie attribute.

For example, to set the cookie window to 60 days (instead of the default 90 days), you can add the following to your script:

<script
  src="https://www.dubcdn.com/analytics/script.js"
  defer
  data-cookie-options='{"expiresInDays": 60}'
/>

path · string · default: "/"

Specifies the value for the Path Set-Cookie attribute. By default, the path is considered the “default path”. Example: /

data-domains · JSON-stringified object

Configure the domains that Dub will track. The following properties are available:

Show properties

refer · string

The Dub custom domain for referral program client-side click tracking (previously data-short-domain). Example: refer.dub.co

site · string

The Dub short domain for tracking site visits. Example: site.dub.co

outbound · string | string[]

An array of domains for cross-domain tracking. When configured, the existing dub_id cookie will be automatically appended to all outbound links targeting these domains to enable cross-domain tracking across different applications. Example: "dub.sh, git.new"

data-short-domain · string · deprecated

[Deprecated: Use data-domains.refer instead] The Dub custom domain for referral program client-side click tracking

data-query-param · string · default: "via"

The query parameter to listen to for client-side click-tracking (e.g. ?via=abc123).