The Google Analytics for STK module integrates Magnolia CMS websites with Google Analytics. The module is based on the gaTracker jQuery plugin designed by Jason Huck and enhanced by David Simpson. The module is fully configurable within AdminCentral and no additional coding is necessary. Google Analytics is a powerful solution for analyzing website traffic and how users interact on your site. It is possible to monitor virtually all site activity, even on individual elements of a page.

• Download
• Installing
• Uninstalling
• Configuration
• Mapping to multiple domains
• JavaScripts
• Tracking options
• Link tracking
• Event Tracking
• Cross-domain tracking
• Miscellaneous tracking options
• Organic search

Download

Download the Google Analytics for STK module from Magnolia Store or Nexus repository

Installing

Google Analytics for STK is a community module. It is included in the Enterprise Edition bundle and typically already installed. Go to Magnolia Store > Installed modules in AdminCentral to check. It is not included in the Community Edition bundle. Community Edition users need to download and install it individually. To install the module, see the general module installation instructions.

Uninstalling

See the general module uninstalling instructions and advice.

Configuration

The Google Analytics module configuration requires a unique GA tracking code (UA-XXXXXXXX-X) to function. To obtain your tracking code, log in to your GA account and copy it from the Website Profiles page.

In AdminCentral, the Google Analytics module is configured at Configuration > /modules/google-analytics/config/sites/default.

To start GA tracking, set the enabled property to true and include your GA tracking code in the Value column of the trackerID property.

The specific configurable properties within the /default/tracking configuration are dealt with below in Tracking options. If no specific tracking configurations are added, the /default configuration essentially tracks pageviews, but GA does provide a lot of detail about user behavior and their sources.

Mapping to multiple domains

The Extended Templating Kit available to Enterprise Edition users supports multiple domains, which are configured in Templating Kit > Site Definitions. The screenshot below shows the site definitions of the demo sites.

Multiple domains can be tracked in a single GA account or different accounts can be used for each. The extends feature allows you to use the /default GA configuration for multiple sites and domains by defining only the properties that are different in the new configuration. This is a general Magnolia feature that can be used in most configurations.

The configuration below includes all the demo sites in a single GA account, by extending the /default and /demo-project configurations. The important point to note is that the node names of the sites configured in Templating Kit > Site Definitions must match the node names in the GA configuration identically.

The screenshot below shows the inclusion of both the /demo-project and /demo-features sites of demoauthor in a single account.

The configuration below applies all the configurations of /default to the /demo-features site, but it is tracked in a different GA account.

JavaScripts

Two JavaScripts are relevant to GA tracking: jquery-gatracker and init-gatracker. These are stored in Templating Kit > Resources in templating-kit/js/all.

These scripts, in conjunction with the GoogleAnalyticsModule and GoogleAnalyticsJSResourceModel Java classes define and implement the GA requirements, i.e. they insert the required parameters into the HTML code on each page. More specifically:

1. jquery-gatracker is the original gaTracker jQuery plug-in script that has been customized for Magnolia. It is a non-processed, normal JavaScript.
2. The business logic of GoogleAnalyticsJSResourceModel.java translates the Magnolia configuration to a JavaBean using the Content2Bean mechanism.
3. init-gatracker requests the tracking configuration from the model and injects the values into the GA configuration. init-gatracker is a processed JavaScript.

Tracking options

GA is flexible and can be customized to track almost anything. For more information on the available options, please refer to Typical Tracking Customizations. The Magnolia module allows for most options and additional customizations can be made.

The /default configuration at Configuration > /modules/google-analytics/config/sites/default/tracking has four tracking option types: /events, /links, /domain and /misc that allow for the definition of detailed tracking within each type. The configurations are facilitated by the TrackingOptions Java class.

Link tracking

The Google Analytics module uses virtual pageviews to track download, external, mailto and anchor links. GA does not track links by default unless they are specifically tagged, and the Google Analytics module takes care of this. The _trackPageview() method is used to tag the links and the results appear in GA as virtual pages. The only drawback of this method is that the clicks are added to the total pageview count.

Links are configured in Configuration > /modules/google-analytics/config/sites/default/tracking/links. There are four subnodes: /download, /external. /mail and /anchor and each has two configurable properties:

Property	Description	Default value
enabled	To enable and disable the tag	false
linkPrefixToAdd	The prefix added to the link that appears in the GA reports	null

The links/download/extensions node allows for the definition of the file extensions that will be included. Each extension is registered in an individual node and there are two configurable properties:

Property	Description	Default value
enabled	To enable and disable the extension	true
name	The node name	null

To view the links statistics in the GA interface:

1. Select the account and domain in the top orange bar.
2. Click View report in the Visitors Overview section.
3. Click Content in the left navigation bar.
4. Click view full report in the Top Content section.
5. Type “downloads”, “external”,”mailtos” or “anchors” in the Filter Page box below the Content Performance report.
6. Click Go.

The screenshots below show the statistics for external and anchor links for the demoauthor sites.

Event Tracking

Event Tracking allows you to record user interaction with website elements. This is accomplished by attaching the method call to the particular UI element. The accessed page element is identified in the GA Content Performance report with a path that starts with /events-tracking. Pageview calculations are unaffected by user activity tracked using this method.

With events tracking you can, for example determine the number of times a form was submitted , the effectiveness of a particular paragraph type or the popularity of a page within a grouped teaser.

The EventsTrackingPattern Java class defines a search pattern for tracking events as a click or submit. Within these categories of events, any number of patterns can be configured. Each pattern corresponds to a CSS element defined in styles.ccs that is available in Templating Kit > Resources > in /templating-kit/themes/pop/css.

Tracking is triggered when GA encounters the CSS element in the HTML code of the page.

The nodes configured under /tracking/events/click/patterns/ and /submit/patterns allow for tracking activity on specific page elements. Each configuration node has four properties.

Property	Description	Default value
cssSelector	Defines the CSS element that triggers event tracking	null
enabled	Defines whether the pattern should be used	false
evalStatsLink	Defines whether the statsLink property should be evaluated by the JavaScript	false
statsLink	Defines the link submitted to GA when tracking is triggered. It does not form part of the rendered HTML. In GA, it represents a tracked event in the statistics	null

The pattern set in the statsLink property is the page path you see in the GA reports. For example, the /tw-paging-stage node in the screenshot above is configured to record statistics for the stkStagePaging paragraph on the home pages of the demo sites. The pattern defines a readable path and its constituent parts translate as follows:

Part	Translation
/events-tracking	An event is tracked
/click	It is a a click event
/teaser-wrapper	It is a teaser element
/tw-paging	Paging navigation buttons are used
/stage	The element resides in the stage area of the page
/button	The specific button clicked
+$(this).text().replace(/\\s/g, "‑")	This is the dynamic jQuery part that queries the elements content. +$(this).text() reads the button number. The regular expression replace(/\\s/g, "‑" replaces spaces with hyphens.

To view the statistics for the tracked event in the GA interface:

1. Select the account and domain in the top orange bar.
2. Click View report in the Visitors Overview section.
3. Click Content in the left navigation bar.
4. Click view full report in the Top Content section.
5. Type, for example, “events-tracking/click” in the Filter Page box below the Content Performance report.
6. Click Go.

The screenshot below shows the performance of demoauthor for all click events. Those relevant to the stkStagePaging paragraph are highlighted.

Alternatively, you can access event tracking results in the Content Drilldown report:

1. Select the account and domain in the top orange bar.
2. Click Content and then Content Drilldown in the left navigation bar.
3. In the Content Performance section, click the /event-tracking/ item.
4. The sequence of views that opens when you drill down from this link correspond to those defined in the statsLink property. The final view tells you how many times users have clicked on a particular button within the paragraph.

The sequence of screenshots below show the performance of demoauthor, but we have limited the sequence to only the first three pages.

Cross-domain tracking

By default, GA tracks content for a single domain, such as www.example.com. Cross-domain tracking facilitates tracking of subdomains and across separate domains within a single GA account. It is useful in many instances, for example to track users referred to a third-party payment gateway or a subdomain hosting a blog. This function should not be confused with Mapping to multiple domains above.

jquery-gatracker.js, available in Templating Kit > Resources in /templating-kit/js/all, uses three methods for cross-domain tracking:

Method	Purpose
_setDomainName()	Sets the top-level domain name for cookies
_setAllowLinker()	Sets the linker functionality flag as part of enabling cross-domain user tracking
_linkByPost()	Passes the cookies from the referring form to another site in a string appended to the action value of the form (HTTP POST)

Cross-domain tracking is configured in Configuration > /modules/google-analytics/sites/default/tracking/domain. There are three configurable properties:

Property	Description	Default value
crossDomainSelector	URL of third-party site	null
domainName	Top-level domain to track	null
enabled	To enable and disable cross-domain tracking	false

Miscellaneous tracking options

Additional miscellaneous tracking options can be configured in Configuration > /modules/google-analytics/config/site/default/tracking/misc. There are two general properties:

Property	Description	Default value
pageViewsEnabled	To enable and disable pageview tracking for misc tracking options	true
sampleRate	Enables client-side visitor sampling. This feature is designed for high-traffic sites to reduce the load on all systems. Only a percentage of page views are tracked	null

Organic search

The organic search feature allows you to add to the list of organic search engines recognized by GA that display in the GA Traffic Sources > Search Engines report. This is helpful, for example to segregate Google search results by specific countries or add local search engines that GA does not recognize as such.

Individual organic search engines are configured at Configuration > /modules/google-analytics/config/site/default/tracking/misc/organicSearch/patterns.

For each search engine there are three configurable properties:

Property	Description	Default value
enabled	Defines whether the pattern should be used	false
queryParameterName	Defines the query parameter name of the search engine URL, for examples 'q' in URL 'http://www.cuil.com/search?q=magnolia+cms	null
searchEngineDomain	Defines the URL of the search engine to track	null

The /patterns/enabled property allow the organic search feature to be enabled and disabled for all defined search engines.

The OrganicSearchTrackingPattern Java class defines the search pattern for tracking organic search engines.