heatm.app

heatm.app

Back to Installation Guides

Add heatm.app to your Lovable website

Lovable builds sites through prompts; you don't edit code directly. Ask Lovable's AI to add the heatm.app tracking script so it loads on every page.

Get your heatm.app details

Before prompting Lovable, get your Website ID and domain from your heatm.app dashboard (or from the tracking script in your heatm.app site settings).


Your tracking script will look like this:

Code
<script
  defer
  data-website-id="YOUR_WEBSITE_ID"
  data-domain="your_domain.com"
  src="https://heatm.app/js/script.v2.min.js"
></script>
!

Replace `YOUR_WEBSITE_ID` with your actual Website ID from heatm.app. Replace `your_domain.com` with your website's root domain.

Use this AI prompt in Lovable

Copy the prompt below, replace the placeholders with your Website ID and domain, then paste it into Lovable's chat:

Code
Please add heatm.app analytics tracking to my website. I need this script to load on every page of the website.

**If using raw HTML:** Add this script tag to the <head> section of every page:

<script
  defer
  data-website-id="YOUR_WEBSITE_ID"
  data-domain="your_domain.com"
  src="https://heatm.app/js/script.v2.min.js"
></script>

**If using React, Next.js, or similar frameworks:** Add the appropriate script component to load on every page. For example:
- Next.js: Use the Script component from 'next/script' in the root layout
- React: Add the script to index.html or use useEffect to load it dynamically
- Vite: Add to index.html in the public folder

Please use the method that's appropriate for the framework you're building my website with, and confirm what approach you used and that the tracking will work on all pages.
!

Replace `YOUR_WEBSITE_ID` and `your_domain.com` in the prompt with your actual values before sending.

Verify installation

After Lovable confirms the implementation:


  • Publish your website — Use Lovable's publish feature (top right corner)
  • Visit your live site — Once published, open your actual website URL
  • Check your dashboard — Go to your heatm.app dashboard and look for incoming data (may take a few minutes)

Troubleshooting

If analytics data isn't appearing, paste this into Lovable's chat to ask the AI to verify:


Verification prompt:


Can you please verify that the heatm.app tracking script is properly installed and will load on all pages? Please confirm: (1) What framework are you using for my website? (2) How did you implement the heatm.app tracking? (3) Can you show me where you added the script? (4) Will it load on every page, including future pages I create? The tracking should load: https://heatm.app/js/script.v2.min.js with my Website ID and domain.


Common issues:


  • Script only added to homepage instead of all pages
  • Missing or incorrect Website ID or domain
  • Script not implemented correctly for the framework (e.g. raw HTML in React instead of proper components)
  • Website not published yet

For advanced options (localhost tracking, custom API endpoints, cross-domain setup), see the script configuration reference. Need help? Contact support@heatm.app.

For advanced configuration options like localhost tracking, custom API endpoints, or cross-domain setup, see the script configuration reference.