Fathom Analytics Fathom Analytics

How to use Fathom Analytics with Gatsby.js

Fathom Analytics works great with Gatsby.js. A huge thank you to Lars Graubner for building the original Gatsby plugin. We've now written these instructions so that you don't need to use any plugins to get Fathom working in Gatsby.

  1. In your terminal, navigate to your Gatsby project
  2. Run cp .cache/default-html.js src/html.js
  3. Add the following snippet just before </head> in that file (remember to add your own site ID and your custom domain, if you have one)
<script src="https://cdn.usefathom.com/script.js" spa="auto" data-site="ABCDEF" defer></script>

And that will work out of the box. We have heard from others that you may need to adjust the formatting to JSX but it worked great like this during testing.

Further customization

To learn about all the options we offer, read our advanced documentation here.