How to track outgoing links with Fathom + Gatsby

So we fixed the Referrer-Policy for Prune you Follows earlier this week, and I started seeing pruneyourfollows.com as a referrer of traffic in my Queen Raae Fathom analytics.

However, I do not have access to Xata's analytics. We could always ask them for an update every now and then. But it would be nicer to keep an eye on this ourselves.

To do so, I finally finished up this year-old Pull Request for trackGoal and trackPageview support in @raae/gatsby-plugin-fathom.

Then Ola added goal tracking to all the links!
And showed us how on this week's rum-fueled treasure hunt 🏴‍☠️

How to use @raae/gatsby-plugin-fathom

• Create events for the links you would like to track in your Fathom Dashboard 1️⃣
• Upgrade to the latest version of the plugin: yarn add @raae/gatsby-plugin-fathom@latest 2️⃣
• Import useFathom from @raae/gatsby-plugin-fathom 3️⃣
• Destruct trackGoal from the useFathom hook 4️⃣
• Track clicks using the correct Event ID 5️⃣

import React from "react";
import { useFathom } from "@raae/gatsby-plugin-fathom"; // 3️⃣

export function Footer() {
  const { trackGoal } = useFathom(); // 4️⃣
  return (
    <footer>
      Powered by{" "}
      <a
        onClick={() => {
          trackGoal("GEVKO638", 0); // 5️⃣
        }}
        href="https://xata.io/"
      >
        Xata
      </a>
    </footer>
  );
}

All the best,
Queen Raae