How to Set Up UXHeat in Under 1 Minute

Most heatmap tools require complex configuration. Define your events. Set up sampling. Configure your funnels. Integrate with your analytics platform. Wait for data.

UXHeat takes one minute.

Here's exactly how to install UXHeat on your website, with specific instructions for every major platform.

Quick Start: The 60-Second Setup

Step 1: Create Your Account (20 seconds)

Go to uxheat.com/signup
Enter your email and create a password
Confirm your email (check your inbox)

No credit card required. The free tier includes 5,000 sessions/month.

Step 2: Get Your Tracking Code (10 seconds)

After signup, you'll see your dashboard with your unique tracking code:

<script src="https://cdn.uxheat.io/tracker.js" data-key="ux_abc123xyz"></script>

The data-key is unique to your account. Copy this code.

Step 3: Add to Your Website (30 seconds)

Paste the tracking code into the <head> section of your website, before the closing </head> tag.

<!DOCTYPE html>
<html>
<head>
  <title>Your Website</title>
  <!-- Other head elements -->

  <!-- UXHeat Tracking -->
  <script src="https://cdn.uxheat.io/tracker.js" data-key="ux_abc123xyz"></script>
</head>
<body>
  <!-- Your content -->
</body>
</html>

That's it. UXHeat starts tracking immediately. Your first data appears within minutes.

Platform-Specific Instructions

WordPress

Option 1: Theme Header (Recommended)

Go to Appearance > Theme Editor (or Theme File Editor)
Find header.php in the right sidebar
Paste the UXHeat code before </head>
Click Update File

Option 2: Plugin

Install the Insert Headers and Footers plugin
Go to Settings > Insert Headers and Footers
Paste the UXHeat code in the Scripts in Header box
Save

Option 3: Child Theme (Best for Updates)

If you're using a child theme, add to your child theme's header.php or use the wp_head hook in functions.php:

function add_uxheat_tracking() {
  echo '<script src="https://cdn.uxheat.io/tracker.js" data-key="ux_abc123xyz"></script>';
}
add_action('wp_head', 'add_uxheat_tracking');

Shopify

Go to Online Store > Themes
Click Actions > Edit code on your active theme
Find theme.liquid under Layout
Paste the UXHeat code before </head>
Click Save

Next.js / React

Using next/script (Recommended for Next.js 11+)

// pages/_app.js or app/layout.js
import Script from 'next/script'

export default function App({ Component, pageProps }) {
  return (
    <>
      <Script
        src="https://cdn.uxheat.io/tracker.js"
        data-key="ux_abc123xyz"
        strategy="afterInteractive"
      />
      <Component {...pageProps} />
    </>
  )
}

Using document.js (Next.js 10 and earlier)

// pages/_document.js
import { Html, Head, Main, NextScript } from 'next/document'

export default function Document() {
  return (
    <Html>
      <Head>
        <script
          src="https://cdn.uxheat.io/tracker.js"
          data-key="ux_abc123xyz"
        />
      </Head>
      <body>
        <Main />
        <NextScript />
      </body>
    </Html>
  )
}

Webflow

Go to Project Settings (gear icon)
Click the Custom Code tab
Paste the UXHeat code in the Head Code section
Click Save Changes
Publish your site

Squarespace

Go to Settings > Advanced > Code Injection
Paste the UXHeat code in the Header section
Click Save

Wix

Go to Settings > Custom Code (under Advanced)
Click + Add Code
Paste the UXHeat code
Set placement to Head
Choose which pages to load it on (All pages recommended)
Click Apply

Ghost

Go to Settings > Code Injection
Paste the UXHeat code in the Site Header section
Click Save

HTML/Static Sites

Add the tracking code directly to your HTML file's <head> section:

<head>
  <meta charset="UTF-8">
  <title>My Website</title>
  <script src="https://cdn.uxheat.io/tracker.js" data-key="ux_abc123xyz"></script>
</head>

If you have multiple HTML files, add it to each file, or use a static site generator with a shared layout.

Google Tag Manager

In GTM, click Tags > New
Click Tag Configuration > Custom HTML
Paste the UXHeat code
Set Triggering to All Pages
Save and publish your container

Verifying Your Installation

Quick Check (Immediately)

Visit your website in a new browser tab
Open browser DevTools (F12 or right-click > Inspect)
Go to the Network tab
Filter by "uxheat"
You should see tracker.js loading

Dashboard Check (Within 5 minutes)

Return to your UXHeat dashboard
Look for the green "Receiving data" indicator
You should see your first sessions appearing

First Heatmap (Within 10-15 minutes)

Once you have 10+ sessions, UXHeat generates your first heatmap automatically. AI insights follow shortly after.

Troubleshooting

"No data showing up"

Check 1: Script loaded correctly

Open DevTools > Network
Filter by "uxheat"
Verify tracker.js returns 200 OK

Check 2: Correct data-key

Verify the data-key matches your dashboard
Copy-paste to avoid typos

Check 3: Caching

Clear your CDN cache (Cloudflare, Fastly, etc.)
Clear your browser cache
Try an incognito window

Check 4: Ad blockers

Some aggressive ad blockers block analytics
Test in a browser without extensions

"Heatmaps not generating"

Heatmaps require a minimum of 10 sessions per page. If you just installed, wait for more traffic or visit your site yourself a few times.

"AI insights not appearing"

AI insights require 50+ sessions to generate meaningful recommendations. For brand new installations, this may take 24-48 hours depending on your traffic.

"Script slowing down my site"

The UXHeat script is under 10KB gzipped and loads asynchronously. It should not impact page load time. If you're seeing issues:

Verify you're using the official CDN URL
Check DevTools > Performance for the actual impact
Contact support with performance data if issues persist

Advanced Configuration

Excluding Pages

To exclude specific pages from tracking, add the data-exclude attribute:

<script
  src="https://cdn.uxheat.io/tracker.js"
  data-key="ux_abc123xyz"
  data-exclude="/admin/*,/checkout/success"
></script>

Privacy Mode

For enhanced privacy (no session recordings, heatmaps only):

<script
  src="https://cdn.uxheat.io/tracker.js"
  data-key="ux_abc123xyz"
  data-privacy="strict"
></script>

To only start tracking after user consent:

<script
  src="https://cdn.uxheat.io/tracker.js"
  data-key="ux_abc123xyz"
  data-consent="pending"
></script>

Then call window.uxheat.start() after obtaining consent.

Identifying Users

To associate sessions with user IDs (for logged-in users):

window.uxheat.identify('user-123', {
  email: 'user@example.com',
  plan: 'pro'
});

This enables user-level analysis in your dashboard.

FAQ

Will UXHeat slow down my website?

No. The script is under 10KB gzipped (for comparison, Hotjar's script is 100KB+). It loads asynchronously and doesn't block page rendering.

Do I need to add the code to every page?

If you're using a template-based system (WordPress, Shopify, most modern frameworks), adding it once to your header template covers all pages.

For static HTML sites with separate files, yes, add it to each page — or use a static site generator with shared layouts.

Can I install UXHeat alongside other analytics tools?

Yes. UXHeat works alongside Google Analytics, Hotjar, Clarity, and other tools. Just be mindful of cumulative script load times if running many tools simultaneously.

How long until I see data?

First session: Immediately after installation
First heatmap: 10+ sessions (minutes to hours)
First AI insight: 50+ sessions (hours to days)

Can I track multiple domains?

Yes. Create separate projects in UXHeat for each domain. Each project gets its own data-key and tracking.

What Comes Next

Once installed, UXHeat automatically:

Tracks user sessions — clicks, scrolls, movement
Detects rage clicks — frustrated rapid clicking
Identifies dead clicks — clicks on non-interactive elements
Generates heatmaps — after 10+ sessions per page
Produces AI insights — after 50+ sessions

You don't need to configure anything. Just install and wait for insights.

Setup complete? Learn how to interpret your data: UXHeat AI Insights Explained, or explore 10 Website Problems UXHeat Found.