Integrate Google Analytics Tracking

Warning: The Google Analytics Module will be deprecated in version 16. It will not receive further support or maintenance.

Overview

This page describes how to integrate Google Analytics visitor tracking with Bloomreach Content sites and how to monitor statistics within the CMS.

Functionality Overview

Google Analytics integration is provided through three modules:

• org.onehippo.cms7.hst.client-modules:hst-google-analytics-repository: Configuration service for Google Analytics.
• org.onehippo.cms7:hippo-cms-google-analytics-frontend: CMS plugin that displays a graph of document views over a configurable period in the document editor.
• org.onehippo.cms7.hst.client-modules:hst-google-analytics-hst: Provides tags and tracking code for adding Google Analytics tracking to an HST site.

To enable this integration, add the following dependencies to your project POM files.

In cms-dependencies/pom.xml:

<dependency>
  <groupId>org.onehippo.cms7</groupId>
  <artifactId>hippo-cms-google-analytics-frontend</artifactId>
</dependency>

<dependency>
  <groupId>org.onehippo.cms7.hst.client-modules</groupId>
  <artifactId>hst-google-analytics-repository</artifactId>
</dependency>
copy

In site/components/pom.xml:

<dependency>
  <groupId>org.onehippo.cms7.hst.client-modules</groupId>
  <artifactId>hst-google-analytics-hst</artifactId>
</dependency>
copy

Prerequisites

• A Google Analytics account
• OAuth 2.0 access enabled for the Google Analytics API (service account)
• The P12 key file for API authentication
• The service account email address added to your Google Analytics account

Implementation Steps

1. Set Up Google Analytics Account and API Access

1. Create a Google Analytics account at Google Analytics.
2. Enable OAuth 2.0 access for the Google Analytics API by following the Java quickstart for service accounts.
3. After setup, download the P12 key file. Store this file securely; you cannot download it again.
4. Add the generated service account email address to your Google Analytics account via the admin panel.
5. Verify your account settings using the Query Explorer.

2. Configure the Account ID

1. Locate your account ID in Google Analytics. It appears as a string starting with UA- followed by numbers.
2. In the CMS console, navigate to /hippo:configuration/hippo:modules/googleAnalyticsConfiguration/hippo:moduleconfig.
3. Set the hippogoogleanalytics:accountId property to your account ID.

To automate this configuration during repository bootstrapping, add the following YAML definition to your repository-data-application module:

definitions:
  config:
    /hippo:configuration/hippo:modules/googleAnalyticsConfiguration/hippo:moduleconfig:
      hippogoogleanalytics:accountId:
        operation: override
        type: string
        value: UA-XXXXX-XX
copy

Important:
If you include this configuration in the default repository-data-application module, analytics will track all developer activity. To avoid this, only deploy this configuration in a module used for production environments.

3. Add the Tracking Code to Your Site

To enable visitor tracking, add the Google Analytics tag library to a global template (such as a layout page).

JSP

Add the taglib declaration:

<%@ taglib uri="http://www.onehippo.org/jsp/google-analytics" prefix="ga" %>
copy

Freemarker

Add the taglib assignment:

<#assign ga=JspTaglibs ["http://www.onehippo.org/jsp/google-analytics"] >
copy

Insert the tracking code before the closing </body> tag:

JSP

<c:if test="${not hstRequest.requestContext.cmsRequest}">
    <ga:accountId/>
    <hst:link var="googleAnalytics" path="/resources/google-analytics.js"/>
    <script src="${googleAnalytics}" type="text/javascript"></script>
</c:if>
copy

Freemarker

<#if !hstRequest.requestContext.cmsRequest>
  <@ga.accountId/>
  <@hst.link var="googleAnalytics" path="/resources/google-analytics.js"/>
  <script src="${googleAnalytics}" type="text/javascript"></script>
</#if>
copy

The accountId tag injects a JavaScript variable with your account ID. The google-analytics.js script uses this variable to send tracking data.

4. Track Document Views Instead of Page Views

To track document views (rather than page views), use the <ga:trackDocument /> tag in the detail page template that displays the document.

For example, in a product detail page:

In your ProductDetail.java component, expose the current product bean:

Product document = (Product) getContentBean(request);

if (document == null) {
  redirectToNotFoundPage(response);
  return;
}

request.setAttribute("document", document);
copy

In the template, add the tracking tag:

JSP

<ga:trackDocument hippoDocumentBean="${document}"/>
copy

Freemarker

<@ga.trackDocument hippoDocumentBean=document"/>
copy

This tag adds JavaScript for document tracking, which the google-analytics.js script processes.

You can track multiple documents on a single page if needed. However, avoid tracking documents on overview pages unless required.

5. Add the Document Hits Plugin to the Editor

The frontend module provides a plugin that displays a graph of document views over time in the CMS editor.

Configure Google Analytics Account Information

1. In /hippo:configuration/hippo:modules/googleAnalyticsConfiguration/hippo:moduleconfig, set the following:
   • hippogoogleanalytics:username: The service account email address.
   • hippogoogleanalytics:privateKey: Upload the P12 key file as a binary property.
   • googleanalytics:tableId: The table ID from the Google Analytics Data Export API. Use the Query Explorer to locate this value.

Register the Plugin with the Editor

For a document type with a two-column editor layout, add the following node to /hippo:namespaces/myproject/mydocumenttype/editor:templates/_default_:

/hippo:namespaces/myproject/mydocumenttype/editor:templates/_default_:
  /documentHits:
    jcr:primaryType: frontend:plugin
    caption: Document Hits
    interval: weeks
    numberofintervals: '15'
    plugin.class: org.onehippo.cms7.ga.editor.DocumentHitsPlugin
    wicket.id: ${cluster.id}.right.item
    wicket.model: ${wicket.model}
copy

For other layouts, adjust the wicket.id property as needed. Review existing plugin configurations for reference.

The plugin graph can be configured with these properties:

• interval: Time interval between data points (Google Analytics dimension). Options: days, weeks, months. Default: weeks.
• numberofintervals: Number of data points to display (how far back in time to show document hits). Default: 10.

Verification

• Confirm that tracking data appears in your Google Analytics account after visiting your site.
• In the CMS, verify that the Document Hits plugin displays view statistics for documents.

Troubleshooting

• If tracking data does not appear, verify the account ID, service account permissions, and P12 key configuration.
• Ensure that the tracking code is present in your site's rendered HTML.
• Check that the plugin is registered in the correct editor template location.

Related Topics

• Google Analytics Java Service Account Quickstart
• Google Analytics Query Explorer