Add Sumly to a Lovable app

Ask Lovable in chat to add Sumly's line to the head of every page, then publish the change. Lovable picks the right file for the kind of project it made.

Open the live demo Start free

Lovableask in chat, then publish

Visitors

Lovable · chat

Add this script to the <head> of every page:<script defer src="…/s.js" data-site="sl_…">so it loads once on every page.

✓ Changes published First visit/ · from Google

Drawn with an example line.

Step by step

1
In Sumly, open Visitors and copy your project's line.
2
In Lovable, send the message below in chat, with your line in it. On a paid plan you can instead add the line yourself in Code mode, where the app's other head tags are.
3
Click Publish, then Publish changes: Lovable does not put changes live by itself. Open the live app and the visit shows on Visitors.

Paste it into Lovable's chat as it is, with your own line.

Add this script to the <head> of every page of the app, exactly as written, so it loads once on every page:

<script defer src="https://sumly.dev/s.js" data-site="sl_your_key"></script>

Do not bundle it, change its attributes or load it from a component that mounts more than once.

Or let your coding assistant do it

For when Lovable's code is in your own editor through GitHub: paste this into Claude Code, Cursor or Codex there. In Lovable itself, the short message above is enough.

See what it says

Set up Lovable for Sumly in this project.

Sumly (https://sumly.dev) shows revenue next to the visits and app users it came from. The full guide is https://sumly.dev/install/lovable; read it if anything below is unclear.

Steps:
1. In Sumly, open Visitors and copy your project's line.
2. In Lovable, send the message into Sumly in chat, with your line in it. On a paid plan you can instead add the line yourself in Code mode, where the app's other head tags are.
3. Click Publish, then Publish changes: Lovable does not put changes live by itself. Open the live app and the visit shows on Visitors.

Message: Paste it into Lovable's chat as it is, with your own line.
```
Add this script to the <head> of every page of the app, exactly as written, so it loads once on every page:

Do not bundle it, change its attributes or load it from a component that mounts more than once.
```

Keep in mind: Apps made since May 2026 are built on TanStack Start; older ones on React and Vite, where the head is in index.html. The message works for both. Lovable's own visitor count can stay on; it counts separately from Sumly.

How to work:
- Look at how this project is built first, and fit the code to its framework and its way of doing things; the examples above are a starting point, not something to paste as is.
- Steps that happen in a dashboard (Sumly, or Lovable's own) are mine: tell me exactly what to click, then wait for me.
- Keys the code needs belong in environment variables, never in the code or the repository. Never ask me to paste a secret key into this chat; tell me which variable to set.
- Change only what this needs, show me the changes before you commit, and tell me how to check that it works.
- sl_your_key stands for the project's public key; it is on the Visitors page in Sumly. Ask me for it.

Consent

In the EU, the EEA, the UK and Switzerland the script sets no cookie until you call sumly.consent(true), usually from your cookie banner once the visitor agrees, and counts visits without one until then. To wait for consent everywhere, add data-consent="always" to the line. Or add data-cookieless: no Sumly cookie anywhere, so nothing to ask, but a returning visitor counts as new each day and a payment is only traced to a visit on the same day.

Checkout

Stripe Payment Links, pricing tables and buy buttons, Polar checkout links, Paddle buttons and Gumroad product links on your pages carry the visitor into checkout by themselves. For a checkout your own server creates, pass the sumly_vid cookie as metadata named sumly_visitor_id, or send the buyer back to a page with the script and ?session_id={CHECKOUT_SESSION_ID} (Stripe) or ?checkout_id={CHECKOUT_ID} (Polar).

Your own domain

On Starter and Growth, one DNS record serves the script from your own address, past ad blockers: under Visitors › Add tracking › Your own address, enter one such as signal.your-site.com and add the CNAME it shows. If your checkout or app is on another domain, add it under Projects and payments › Other domains: the line then carries data-domains and one person stays one visitor across them.

Clicks and sections

Clicks on links to other sites count by themselves. Mark a button with data-sumly-event="signup" to count its clicks, and a section with data-sumly-scroll="pricing" to count the page views that reached it, a goal such as reached pricing.

Good to know

Apps made since May 2026 are built on TanStack Start; older ones on React and Vite, where the head is in index.html. The message works for both.
Lovable's own visitor count can stay on; it counts separately from Sumly.

From Lovable's own documentation, checked 4 November 2026: docs.lovable.dev/features/code-mode, docs.lovable.dev/features/publish, docs.lovable.dev/features/upgrade-to-tanstack-start .