Lovable

Lovable writes the code for you, so the install is a prompt. Lovable generates a Vite and React app, where the script belongs in the head of index.html. The prompt asks for the exact tags, unchanged, because an AI that "improves" the tag can break it. Building with something else? See Bolt, v0 or Replit.

Replace SITE_ID in the prompt with the id from Settings → Sites in the ProductLense dashboard before you send it.

The prompt#

Add ProductLense analytics to this project. In index.html, inside <head>, add these two tags exactly as written, before any other script:

<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>

Do not change the tags, do not add type="module", do not import the script from JavaScript, and do not install any package. After a user signs in, call window.productlense?.('identify', user.id) once with the signed-in user's id.

Check what the AI wrote#

Open index.html and confirm:

• data-site holds your real site id, not SITE_ID.
• The src is exactly https://api.productlense.app/a.js.
• The tag has no type="module" and is not imported from a .ts or .tsx file. The script reads its settings from its own tag, which only works for a classic script.

Lovable previews your app on its own domain. Add your published domain to the site's hostnames in the ProductLense dashboard; visits from the preview domain are rejected unless you add it too.

Claude Code, Codex or Cursor#

If your code lives in a repository, give a coding agent this prompt instead. During setup the ProductLense dashboard detects your framework, fills in your site id, names the exact file for that framework and offers a one-line claude or codex command, so you rarely need to edit it by hand.

Add ProductLense analytics to yoursite.com. It runs on Static HTML.

In the <head> of every page, add these two tags exactly as written, before any other script, keeping data-site and src unchanged:

<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>

Rules:
- Add it once. If a script with data-site="SITE_ID" or a src ending in /a.js is already there, leave it as it is.
- Keep the one-line queue stub before the script tag when the snippet has one.
- Do not turn the tags into a module, a wrapper component or an npm import, and do not install any package.

Then run the site locally, open it, and confirm the browser sends a request to https://api.productlense.app/api/e when the page loads.

Verify your installation#

1. Publish or deploy the app, then open the published URL 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.

If you export the project and run it on localhost, nothing is sent unless you add data-dev="true" to the tag. Ad blockers in your own browser may block the request. If the visit does not appear, follow Verify your installation.