← All platforms

    Installation Guide · Gatsby

    How to Add Agent Analytics to Your Website

    One script captures what visitors browse. That becomes memory your analytics can understand. And agents like Jack turn it into actions — recovery emails, demand segments, conversion insights.

    Install on Gatsby

    🟣

    Gatsby

    Gatsby uses a configuration file to manage scripts across all pages.

    Easy·1 min·1 method

    gatsby-ssr.js

    Add the script to your Gatsby SSR configuration so it's included in every page's head.

    1
    Open (or create) gatsby-ssr.js in your project root

    This file controls what's rendered during server-side rendering. If it doesn't exist, create it.

    2
    Export an onRenderBody function and use setHeadComponents

    This adds elements to the <head> of every page during build.

    Paste this
    // gatsby-ssr.js
exports.onRenderBody = ({ setHeadComponents }) => {
  setHeadComponents([
    <script
      key="tradly-analytics"
      async
      src="https://analytics.tradly.dev/tracker.js"
      data-server="https://analytics.tradly.dev"
      data-project="marketplace"
    />,
  ]);
};
    3
    Save and rebuild your site

    Run gatsby build or gatsby develop to see changes.

    Troubleshooting (3 common issues)
    • →Make sure the key prop is unique — Gatsby uses it for reconciliation
    • →After deploying, you may need to clear your CDN or hosting cache
    • →If using gatsby-plugin-google-analytics, the approach is similar but uses a different config

    Need help? Contact support@tradly.dev or check our FAQ.

    Last updated: January 2025