Google analytics

[cgarvis]

Need to be able to fire off page views to google analytics.

[KyleAMathews]

Not documented yet but there's a onRouteChange hook you can use. See https://github.com/KyleAMathews/blog/blob/e590c31a1b0f9f72b3725f40664cf064fd4595f6/app.coffee#L15-L20

[SachaG]

How do you get that app.coffee (or in my case app.js) file to be loaded?

[KyleAMathews]

@SachaG you need to export a function from gatsby-browser.js called onRouteUpdate. This will be called on every route change. https://github.com/gatsbyjs/gatsby#structure-of-a-gatsby-site

[SachaG]

Thanks, here's what I ended up with in my gatsby-browser.js file:

import ReactGA from 'react-ga';
ReactGA.initialize('UA-xxxxxx-x');

exports.onRouteUpdate = (state, page, pages) => {
  ReactGA.pageview(state.pathname);
};

I'm not sure if that's the best way to do it though. I'm using React-GA btw.

[KyleAMathews]

Seems reasonable!
On Mon, Aug 22, 2016 at 6:48 PM Sacha Greif [email protected]
wrote:

Thanks, here's what I ended up with in my gatsby-browser.js file:

import ReactGA from 'react-ga';ReactGA.initialize('UA-xxxxxx-x');
exports.onRouteUpdate = (state, page, pages) => {
ReactGA.pageview(state.pathname);
};

I'm not sure if that's the best way to do it though. I'm using React-GA
https://github.com/react-ga/react-ga btw.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
#64 (comment), or mute
the thread
https://github.com/notifications/unsubscribe-auth/AAEVh5zegmY5q7NduS8syNK6t3q1bwPoks5qilFdgaJpZM4GTVL1
.

[GuillaumeHaben]

Hi !

The gatsby-browser.js file in the starter I use (https://github.com/wpioneer/gatsby-starter-lumen) is empty. I've tried your way but I can't get any infos on Google Analytics. Any idea @SachaG ?

[KyleAMathews]

@GuillaumeHaben can you post the code you're using?

[GuillaumeHaben]

@KyleAMathews I'm using the same code as Sasha (except with my GA id instead of xxxxx). I've also installed react-ga.

[KyleAMathews]

We'd need more info to help. It sounds like it should work. Is there errors
in the browser console? Can you add a console.log to your Gatsby-browser.js
and the message shows?
On Tue, Sep 20, 2016 at 8:43 AM Guillaume HABEN [email protected]
wrote:

@KyleAMathews https://github.com/KyleAMathews I'm using the same code
as Sasha (except with my GA id instead of xxxxx). I've also installed
react-ga.

—
You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub
#64 (comment), or mute
the thread
https://github.com/notifications/unsubscribe-auth/AAEVh5Zgz7nRYplVlm2n0gJbpgbEVnNlks5qr_8zgaJpZM4GTVL1
.

[GuillaumeHaben]

You can check my repo here. I tried the html.js and the gatsby-browser.js method but it doesn't work. There is nothing in the console.
A console log in my gatsby-browser file doesn't show neither. Is there any thing I have to do to link it to my project ?

Edit : I finally managed to get it work by following this issue. My script had to be surrounded by ` as you can see here
Thanks for the help !

[KyleAMathews]

Glad you got it working!

And I should finish converting my blog out of Coffeescript — that it's mixed JS/CS right now is confusing.

[timarney]

Is the setup described here #64 (comment) the "correct way" to setup analytics?

Add a file called gatsby-browser.js with and add the following code?

import ReactGA from 'react-ga';
ReactGA.initialize('UA-xxxxxx-x');

exports.onRouteUpdate = (state, page, pages) => {
  ReactGA.pageview(state.pathname);
};

UPDATE: Confirmed this worked

[franzejr]

I did what @timarney did, but I got path is required in .pageview(). Any clue?

[franzejr]

I got it working using: onClientEntry.

import ReactGA from "react-ga";
ReactGA.initialize("UA-XXXX");

exports.onClientEntry = () => {
  ReactGA.set({ page: window.location.pathname });
  ReactGA.pageview(window.location.pathname);
};

[calpa]

@franzejr I find that the pathname is inside state.location, so change the code to:

import ReactGA from 'react-ga';
ReactGA.initialize('UA-xxxxxx-x');

exports.onRouteUpdate = (state, page, pages) => {
  ReactGA.pageview(state.location.pathname);
};