Hugo & Google Analytics

Setting up Google Analytics to work with Hugo

Hugo has integrated support (via. Internal Templates) for Google Analytics. An internal template adds support for some very common use cases on static websites. For example: Google Analytics, Disqus comments, Google News, and Twitter Cards. Internal templates certainly exist in v.0.87 and higher, but I’m not sure when support for them was first added. If your install of Hugo is out of date, now might be a good time to update it.

The first step, is to sign up for Google Analytics and adding your particular site (aka. property), if you’ve not done so already. I’ll wait while you do that… …twiddles thumbs…

Next, we need to find the Measurement ID (previously, Tracking ID) that Google has assigned to the property that you have setup.

  • Click Admin
  • Click Data Streams
  • Click on your property from the list
  • Measurement ID should appear in the upper-right portion of the panel
  • Copy or make a note of the Measurement ID

The Measurement ID should have the format G-HMPAE821CR. The ID is unique! With this in hand, let’s tell Hugo to use it for all our webpages.

Open the config file. (This will be located in the root directory of your Hugo site. The config file can be variety of different formats - mine is YAML so it’s named config.yaml).

There will be a line that looks something like this:

# GA Tracking ID
googleAnalytics:

Add the Measurement ID that you’d previously noted to the googleAnalytics: field:

# GA Tracking ID
googleAnalytics: G-HMPAE821CR

Save the file.

That’s really all you have to do to set the Google Analytics Tracking ID in Hugo. My theme - hugo-stack-theme] - automatically has support for this internal template, so my site started sending tracking data to Google Analytics right away.

References

An article I referenced when figuring this out was:

Setting Up Google Analytics on Hugo

Licensed under CC BY-NC-SA 4.0
Built with Hugo
Theme Stack designed by Jimmy