[gatsby-plugin-google-analytics] Need custom definition usage (custom dimensions and metrics)

Summary

The gatsby-plugin-google-analytics plugin works well but lacks information on how to set custom dimensions (or other fields) prior to the pageview hit being sent. Some data can be set in gatsby-config but this doesn’t work for anything dynamic.

Relevant information

For example, I need to retrieve a GET parameter value and set it as a custom dimension before the pageview hit is sent so that all subsequent hits (including pageview) will include this information.

For example, take the following URL: https://howchoo.com/h/pi?ref=interest_list

Before the GA pageview it is sent, I would normally set it here:

ga('set', 'dimension5', 'custom data');

I could theoretically retrieve the value in gatsby-browser and set it there, but GA doesn’t provide a true async queue before the ga object is defined AFAIK. Therefore, I’d need to be sure it gets set before the plugin sends the pageview hit.

How could this be done? The plugin isn’t clear about how custom definitions (dimensions and metrics) can be set before the pageview hit is sent. This seems to be a relevant section of code.

Environment (if relevant)

  System:
    OS: macOS 10.15.3
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 12.8.0 - /usr/local/bin/node
    npm: 6.10.3 - /usr/local/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 80.0.3987.149
    Firefox: 71.0
    Safari: 13.0.5
  npmPackages:
    gatsby: ^2.19.45 => 2.19.45
    gatsby-plugin-disqus: ^1.1.4 => 1.1.4
    gatsby-plugin-google-analytics: ^2.1.38 => 2.1.38
    gatsby-plugin-google-tagmanager: ^2.1.27 => 2.1.27
    gatsby-plugin-less: ^3.0.21 => 3.0.21
    gatsby-plugin-lodash: ^3.1.22 => 3.1.22
    gatsby-plugin-manifest: ^2.2.48 => 2.2.48
    gatsby-plugin-mdx: ^1.0.83 => 1.0.83
    gatsby-plugin-offline: ^3.0.41 => 3.0.41
    gatsby-plugin-react-helmet: ^3.1.24 => 3.1.24
    gatsby-plugin-react-svg: ^3.0.0 => 3.0.0
    gatsby-plugin-remove-trailing-slashes: ^2.1.24 => 2.1.24
    gatsby-plugin-sass: ^2.1.31 => 2.1.31
    gatsby-plugin-webpack-bundle-analyzer: ^1.0.5 => 1.0.5
    gatsby-source-filesystem: ^2.1.56 => 2.1.56
    gatsby-source-graphql: ^2.1.35 => 2.1.35
    gatsby-source-shopify: ^3.0.52 => 3.0.52
    gatsby-source-youtube: ^1.0.1 => 1.0.1
    gatsby-transformer-yaml: ^2.2.27 => 2.2.27
  npmGlobalPackages:
    gatsby-cli: 2.10.2

File contents (if changed)

gatsby-config.js: N/A package.json: N/A gatsby-node.js: N/A gatsby-browser.js: N/A gatsby-ssr.js: N/A

[noah-hornak]

Would also like to know how to accomplish this. Trying to send custom dimension on page view event for a specific page so I can A/B test.

[github-actions[bot]]

Hey again!

It’s been 30 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it. Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m HUMAN_EMOTION_SORRY. Please feel free to reopen this issue or create a new one if you need anything else. As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks again for being part of the Gatsby community! 💪💜