Skip to main content
Scripts

Fathom Analytics

Copy for LLMs

Get started with Fathom Analytics

$10 credit

Sign Up

Fathom Analytics tracks site traffic without collecting visitors' personal data.

Fathom Analytics

View source

Nuxt Config Setup

Add this to your nuxt.config.ts to load Fathom Analytics globally. Alternatively you can use the useScriptFathomAnalytics composable for more control. 

export default defineNuxtConfig({
  scripts: {
    registry: {
      fathomAnalytics: {
        site: 'ABCDE',
        trigger: 'onNuxtReady',
      }
    }
  }
})

This config automatically enables first-party mode (bundle). See below to customise.

useScriptFathomAnalytics()

The useScriptFathomAnalytics composable lets you have fine-grain control over when and how Fathom Analytics is loaded on your site. 

const { proxy } = useScriptFathomAnalytics()

proxy.trackGoal('GOAL_ID', 100)

Please follow the Registry Scripts guide to learn more about advanced usage.

First-Party Mode: Privacy Focused Proxy

No extra config needed. The script is bundled and served from your domain instead of a third-party CDN, eliminating an extra DNS lookup and improving load times. Learn more.

Mode
Bundle 
export default defineNuxtConfig({
  scripts: {
    // ✅ First-party mode: bundled
    registry: {
      fathomAnalytics: {
        site: 'ABCDE',
        trigger: 'onNuxtReady',
      },
    },
  },
})

Example

Using Fathom Analytics in a component. 

<script setup lang="ts">
const { proxy } = useScriptFathomAnalytics()

// noop in development, ssr
// just works in production, client
function handleAction() {
  proxy.trackGoal('GOAL_ID', 100)
}
</script>

<template>
  <div>
    <button @click="handleAction">
      Send Event
    </button>
  </div>
</template>

Proxying is not supported

Unlike most analytics integrations in Nuxt Scripts, Fathom cannot be proxied (proxy: true).

Fathom's bot detection uses the connecting source IP address. When beacons are proxied, they reach Fathom from your server's IP (typically a datacenter), and Fathom's bot detection ignores X-Forwarded-For from arbitrary servers, so every visitor gets flagged as a bot. This behavior and the resulting Nuxt Scripts change are documented in the proxy-support fix.

Fathom stopped offering custom domains in March 2023. Existing custom domains continue to work, but new customers cannot configure one.

Bundling (bundle: true) is supported: the script is served from your origin, but beacons still go directly to cdn.usefathom.com from the browser so real client IPs reach Fathom's bot detection correctly.

Defaults

  • Trigger: onNuxtReady The script loads when the Nuxt app is ready.

Use the composable's proxy object for void calls. Use onLoaded when you need the loaded fathom object.

const { proxy } = useScriptFathomAnalytics()
function trackMyGoal() {
  proxy.trackGoal('MY_GOAL_ID', 100)
}
sitestring required

The Fathom Analytics site ID.

spa'auto' | 'history' | 'hash' = 'auto'

The Fathom Analytics tracking mode.

autoboolean = true

Automatically track page views.

canonicalboolean = true

Enable canonical URL tracking.

honorDntboolean = false

Honor Do Not Track requests.

Example

The default trigger waits until Nuxt is ready:

app.vue
<script setup lang="ts">
useScriptFathomAnalytics({
  site: 'YOUR_SITE_ID',
})
</script>
Edit this page
Markdown For LLMs

Databuddy Analytics

Load Databuddy's browser SDK and configure its analytics and performance tracking.

Google AdSense

Show Google AdSense ads in your Nuxt app.