# Bubble

Add ProductLense to a Bubble app through the script and meta tags header in Settings, then publish to live.

Bubble lets you add code to the header of every page of your app from its settings. Paste the ProductLense script there and deploy to live.

## Add the script

1. In the Bubble editor, open Settings → SEO / metatags.
2. Paste the two tags into Script/meta tags in header. Replace `SITE_ID` with the id from Settings → Sites in the ProductLense dashboard.
3. Deploy the app to live.

```html title="Script/meta tags in header" {1-2}
<script>window.productlense=window.productlense||function(){(window.productlense.q=window.productlense.q||[]).push(arguments)}</script>
<script defer data-site="SITE_ID" src="https://api.productlense.app/a.js"></script>
```

Add your custom domain, and the `bubbleapps.io` address if you test on it, to the site's hostnames in the ProductLense dashboard.

> [!NOTE]
> To attribute payments to the channel that brought each user, ProductLense needs `identify` with the user's id or email on a page that knows the signed-in user. Bubble has no built-in way to run JavaScript from a workflow; a plugin that adds a "run JavaScript" action can call `window.productlense('identify', ...)`. See [identify users](/docs/track/identify-users).

## Verify your installation

1. Deploy to live, then open the live app in a normal browser window.
2. Open the Live page in the ProductLense dashboard. Your visit appears within a few seconds.
3. In the browser's developer tools, the Network tab shows a `POST` to `https://api.productlense.app/api/e` with status `204`.

The version-test preview runs on a different URL; add it to the site's hostnames only if you want those visits counted. Ad blockers in your own browser may block the request. If the visit does not appear, follow [Verify your installation](/docs/install/verify).