Docusaurus V2 - Activating Google Analytics hides navbar and footer

Question

We want to implement Google Analytics into our online website, however when we add the code our menu and footer disappears.

According to documentation on the official website https://v2.docusaurus.io/docs/using-plugins/#docusaurusplugin-google-analytics this can be achieved through updating the docusaurus.config.js and adding a plugin @docusaurus/plugin-google-analytics or by by adding to the present @docusaurus/preset-classic.

Installing as a plugin with the following code, hides our menu and footer (just vanishes). But Google Analytics does register the real-time traffic.

  themeConfig: {
    googleAnalytics: {
      trackingID: 'UA-GACODE-1',
      // Optional fields.
      anonymizeIP: true, // Should IPs be anonymized?
    },
  },

Trying to activate it through the existing @docusaurus/present-clasic doesn't process anything (Chrome inspector has no traffic to Google and AdBlock is not active)

presets: [
    [
      '@docusaurus/preset-classic',
      {
        googleAnalytics: {
          trackingID: 'UA-GACODE-1',
        },
        docs: {
          sidebarPath: require.resolve('./sidebars.js')
        },
        theme: {
          customCss: require.resolve('./src/css/custom.css'),
        },
        highlight: { 
          theme: 'default',
        },
      },
    ],
  ],

Has anyone activated Google Analytics successfully on Docusaurus V2?

Thank you for the help!

Do I need to add the script code separately too? Apart from this? @Daniel — Akhila, Dec 09 '20 at 21:29
Hi, I don't believe you need any extra scripts. Just add Google Analytics code to the themeConfig as shown in my answer below. @Akhila — Daniel Vila Boa, Dec 10 '20 at 10:01
I actually created account in google analytics and have an id that starts with GA and not UA.. For some reason I'm not able to see any data in the account, and I have only added just this line.. Does it only work for UA code? @Daniel — Akhila, Dec 10 '20 at 14:39
Not sure about GA, would suggest trying it in production (not localhost) and confirm no adblock etc. They have an active docusaurus community if you need specific help: https://discord.com/invite/docusaurus — Daniel Vila Boa, Dec 14 '20 at 20:14

Daniel Vila Boa · Answer 1 · 2022-12-06T12:43:42.243

2

EDIT: Google Analytics is no longer with this previous format, see accepted answer.

Ref: https://github.com/facebook/docusaurus/pull/5832 - Thanks @seiwon-park

edited Dec 06 '22 at 12:43

answered Apr 17 '20 at 09:39

Daniel Vila Boa

670
5
13

1

**THIS IS NO LONGER VALID** according to `[ERROR] Error: The "googleAnalytics" field in themeConfig should now be specified as option for plugin-google-analytics. For preset-classic, simply move themeConfig.googleAnalytics to preset options. More information at https://github.com/facebook/docusaurus/pull/5832` So, insert it inside `preset`. – Seiwon Park Dec 01 '22 at 08:48

score 2 · Accepted Answer · answered Jun 22 '22 at 18:43

I think the accepted answer is no longer valid after this PR. So both the gtag and googleAnalytics should go back into the presets configuration now.

// docusaurus.config.js

module.exports = {
  presets: [
    [
      '@docusaurus/preset-classic',
      {
        docs: /* ... */,
+       gtag: {
+         trackingID: 'xxx',
+       },
+       googleAnalytics: {
+         trackingID: 'xxx',
+       },
      },
    ],
  ],
  themeConfig: {
-   gtag: {
-     trackingID: 'xxx',
-   },
-   googleAnalytics: {
-     trackingID: 'xxx',
-   },
    // other options
  },
};

Docusaurus V2 - Activating Google Analytics hides navbar and footer

2 Answers2