Skip to main content

​
Overview

Docusaurus allows you to add custom scripts to your documentation site through the docusaurus.config.js configuration file. Scripts are automatically included in the <head> section of every page.

​
Installation

Get the HTML Snippet from the CustomerOS app to add to your website. It is specific to your domain so that you aren’t blocked by adblockers and privacy modes.

​
Adding the Tracker Script

  1. In your Docusaurus project’s src directory, create a new JavaScript file: 
    touch src/customeros-tracker.js
  2. Open src/customeros-tracker.js and paste the JavaScript code from the CustomerOS app
  3. Open your docusaurus.config.js file and add the script to the scripts array: 
    module.exports = {
    // ... other configurations ...
    scripts: ["/src/customeros-tracker.js"],
    // ... other configurations ...
};
  4. Save the file and restart your development server: 
    npm start
# or
yarn start
  5. Build and deploy your site: 
    npm run build
# or
yarn build
The tracker will now be included on all pages of your documentation.
The JavaScript file should be placed in the src directory, and the path in scripts should start with /.

​
Alternative: Page-Specific Installation

If you only want to track specific pages, you can create a custom component that includes the tracker script:
  1. Create a component file (e.g., src/components/CustomerOSTracker.js):
import { useEffect } from "react";

export default function CustomerOSTracker() {
    useEffect(() => {
        // Paste the JavaScript code from the CustomerOS app here
        (function () {
            const SRC =
                "https://your-tracker-subdomain.example.com/analytics-0.1.js";
            const ID = "customeros-metrics-loader";
            // ... rest of the JavaScript code from the app
        })();
    }, []);

    return null; // This component doesn't render anything
}
  1. Import and use the component in any page where you want tracking:
import CustomerOSTracker from "../components/CustomerOSTracker";

function MyPage() {
    return (
        <>
            <CustomerOSTracker />
            {/* Page content */}
        </>
    );
}

export default MyPage;

​
Verifying Installation

After building and deploying your site:
  1. Visit your Docusaurus documentation
  2. Open your browser’s developer console (F12 or right-click → Inspect)
  3. Check the Network tab for a request to your tracker domain
  4. Look for successful 200s and 202s from the tracker subdomain
  5. Check the Console tab for any errors
You should see page views appearing in your CustomerOS dashboard within a few minutes.

​
Troubleshooting

If the tracker isn’t working:
  • Ensure the JavaScript file is in the src directory
  • Check that the script path is correctly added to docusaurus.config.js in the scripts array
  • Verify the path starts with / (e.g., /src/customeros-tracker.js)
  • Ensure you’ve restarted your development server after making changes
  • Check that you’ve built and deployed your site (changes don’t appear in development mode)
  • Verify that your tracker domain is correct and accessible
  • Check the browser console for any JavaScript errors
For more help, see our Troubleshooting guide.

​
Additional Resources