Skip to content

Commit 28511bf

Browse files
Adds support for Matomo Tag Manager containers
** Why are these changes being introduced: One of the instances of this application, GeoData, has an existing integration with Matomo using their legacy approach that relies on a site ID. The USE UI project will be using a newer integration, which requires us to support Matomo Tag Manager. ** Relevant ticket(s): * https://mitlibraries.atlassian.net/browse/use-160 ** How does this address that need: This adds a second option for integration with Matomo, using just a single ENV variable - for the container URL. We do this by extending the conditional in the _head partial, allowing the application to support _either_ a tag manager container _or_ the legacy approach, but not both. Once GeoData gets converted over to using a tag manager container, we will be able to drop that half of this conditional. ** Document any side effects to this change: The legacy integration has a bit of bespoke javascript in order to let turbo frames interactions be sent to Matomo. Thanks to whomever left the URL to the github issue about this approach, which led me to https://developer.matomo.org/guides/spa-tracking - which tells me that we don't need to worry about this under a tag manager context. As a result, I've left that code out of the new integration, and we'll handle tracking all changes directly within the Matomo container.
1 parent 8e489da commit 28511bf

File tree

2 files changed

+15
-1
lines changed

2 files changed

+15
-1
lines changed

README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -111,6 +111,9 @@ may have unexpected consequences if applied to other TIMDEX UI apps.
111111
- `FILTER_SUBJECT`: The name to use instead of "Subject" for that filter / aggregation.
112112
- `GLOBAL_ALERT`: The main functionality for this comes from our theme gem, but when set the value will be rendered as
113113
safe html above the main header of the site.
114+
- `MATOMO_CONTAINER_URL`: This is one of two options for integrating a TIMDEX UI application with Matomo - the Tag Manager. This is the only parameter needed for using a tag manager container.
115+
- `MATOMO_SITE_ID`: Integrating with Matomo using the legacy approach (instead of Tag Manager) requires two values: the site id and a URL. This is one of those legacy values.
116+
- `MATOMO_URL`: Integrating with Matomo using the legacy approach (instead of Tag Manager) requires two values: the site id and a URL. This is one of those legacy values.
114117
- `ORIGINS`: sets origins for CORS (currently used only for TACOS API calls).
115118
- `PLATFORM_NAME`: The value set is added to the header after the MIT Libraries logo. The logic and CSS for this comes from our theme gem.
116119
- `PRIMO_TIMEOUT`: The number of seconds before a Primo request times out (default 6).

app/views/layouts/_head.html.erb

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,18 @@
2626

2727
<%= yield :additional_js %>
2828

29-
<% if (ENV['MATOMO_URL'].present? && ENV['MATOMO_SITE_ID'].present?) %>
29+
<% if (ENV['MATOMO_CONTAINER_URL'].present?) %>
30+
<!-- Matomo Tag Manager -->
31+
<script type="text/javascript">
32+
var _mtm = window._mtm = window._mtm || [];
33+
_mtm.push({'mtm.startTime': (new Date().getTime()), 'event': 'mtm.Start'});
34+
(function() {
35+
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
36+
g.async=true; g.src='<%= ENV['MATOMO_CONTAINER_URL'] %>'; s.parentNode.insertBefore(g,s);
37+
})();
38+
</script>
39+
<!-- End Matomo Tag Manager -->
40+
<% elsif (ENV['MATOMO_URL'].present? && ENV['MATOMO_SITE_ID'].present?) %>
3041
<!-- Matomo -->
3142
<script type="text/javascript">
3243
var _paq = window._paq || [];

0 commit comments

Comments
 (0)