From aeb328267e8c951dbd95116fed5741dedbd680ba Mon Sep 17 00:00:00 2001 From: Ynda Jas Date: Thu, 13 Nov 2025 18:39:49 +0000 Subject: [PATCH 1/7] Rename GA4 gtag analytics partial This code is specifically for the gtag.js approach to tracking with GA4. This clarification is useful in advance of adding support for the other approach: Google Tag Manager https://support.google.com/tagmanager/answer/7582054 https://developers.google.com/tag-platform/tag-manager/datalayer --- example/config/tech-docs.yml | 6 +++--- .../{_analytics_head.erb => _analytics_ga4_gtag.erb} | 2 +- lib/source/layouts/core.erb | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) rename lib/source/layouts/{_analytics_head.erb => _analytics_ga4_gtag.erb} (97%) diff --git a/example/config/tech-docs.yml b/example/config/tech-docs.yml index 09bb9195..b7a0d8a1 100644 --- a/example/config/tech-docs.yml +++ b/example/config/tech-docs.yml @@ -19,10 +19,10 @@ footer_links: Accessibility: /hidden-page.html Hidden Page: /hidden-page.html -# Tracking ID (if using GA4 e.g G-XXXXXX) +# Tracking IDs +# Google Analytics 4 using gtag.js (e.g G-XXXXXX) ga4_tracking_id: - -# Tracking ID from Google Universal Analytics (e.g. UA-XXXX-Y) +# Google Universal Analytics (e.g. UA-XXXX-Y) ga_tracking_id: # Enable multipage navigation in the sidebar diff --git a/lib/source/layouts/_analytics_head.erb b/lib/source/layouts/_analytics_ga4_gtag.erb similarity index 97% rename from lib/source/layouts/_analytics_head.erb rename to lib/source/layouts/_analytics_ga4_gtag.erb index 21da87bd..2a0cf508 100644 --- a/lib/source/layouts/_analytics_head.erb +++ b/lib/source/layouts/_analytics_ga4_gtag.erb @@ -7,4 +7,4 @@ gtag('js', new Date()); gtag('config', '<%= config[:tech_docs][:ga4_tracking_id] %>'); -<% end %> \ No newline at end of file +<% end %> diff --git a/lib/source/layouts/core.erb b/lib/source/layouts/core.erb index 7240b7d5..8e057d57 100644 --- a/lib/source/layouts/core.erb +++ b/lib/source/layouts/core.erb @@ -1,7 +1,7 @@ - <%= partial 'layouts/analytics_head' %> + <%= partial 'layouts/analytics_ga4_gtag' %> From 04717903fd95de6f4911deebf1f5ea681bbc147f Mon Sep 17 00:00:00 2001 From: Ynda Jas Date: Fri, 14 Nov 2025 09:58:37 +0000 Subject: [PATCH 2/7] Support Google Tag Manager approach to analytics We already support the other approach to tracking data for Google Analytics 4: gtag.js. We need to support the Google Tag Manager approach to address new needs https://support.google.com/tagmanager/answer/7582054 https://developers.google.com/tag-platform/tag-manager/datalayer --- example/config/tech-docs.yml | 2 ++ lib/source/layouts/_analytics_ga4_gtm.erb | 9 +++++++++ lib/source/layouts/core.erb | 1 + 3 files changed, 12 insertions(+) create mode 100644 lib/source/layouts/_analytics_ga4_gtm.erb diff --git a/example/config/tech-docs.yml b/example/config/tech-docs.yml index b7a0d8a1..2f7792cc 100644 --- a/example/config/tech-docs.yml +++ b/example/config/tech-docs.yml @@ -22,6 +22,8 @@ footer_links: # Tracking IDs # Google Analytics 4 using gtag.js (e.g G-XXXXXX) ga4_tracking_id: +# Google Analytics 4 using Google Tag Manager (e.g GTM-XXXXXXXX) +ga4_gtm_tracking_id: # Google Universal Analytics (e.g. UA-XXXX-Y) ga_tracking_id: diff --git a/lib/source/layouts/_analytics_ga4_gtm.erb b/lib/source/layouts/_analytics_ga4_gtm.erb new file mode 100644 index 00000000..be903ac9 --- /dev/null +++ b/lib/source/layouts/_analytics_ga4_gtm.erb @@ -0,0 +1,9 @@ +<% if config[:tech_docs][:ga4_gtm_tracking_id].is_a?(String) && !config[:tech_docs][:ga4_gtm_tracking_id].empty? %> + + + +<% end %> diff --git a/lib/source/layouts/core.erb b/lib/source/layouts/core.erb index 8e057d57..c46b5d04 100644 --- a/lib/source/layouts/core.erb +++ b/lib/source/layouts/core.erb @@ -2,6 +2,7 @@ <%= partial 'layouts/analytics_ga4_gtag' %> + <%= partial 'layouts/analytics_ga4_gtm' %> From 07f4034fdcaebf20a110c8945b23d4ebe30cf024 Mon Sep 17 00:00:00 2001 From: Ynda Jas Date: Wed, 12 Nov 2025 11:32:15 +0000 Subject: [PATCH 3/7] Add cookie banner Once wired up, this will allow users to set their cookie preferences, initially just for Google Tag Manager tracking Cookie banners often link to a cookies page, but I've omitted that here to keep the change focused. It might be good to add an option to include this in future --- lib/assets/stylesheets/_govuk_tech_docs.scss | 1 + lib/source/layouts/_cookie_banner.erb | 22 ++++++++++++++++++++ lib/source/layouts/core.erb | 1 + 3 files changed, 24 insertions(+) create mode 100644 lib/source/layouts/_cookie_banner.erb diff --git a/lib/assets/stylesheets/_govuk_tech_docs.scss b/lib/assets/stylesheets/_govuk_tech_docs.scss index 47e784ca..a3379756 100644 --- a/lib/assets/stylesheets/_govuk_tech_docs.scss +++ b/lib/assets/stylesheets/_govuk_tech_docs.scss @@ -17,6 +17,7 @@ $govuk-new-link-styles: true; @import "govuk/core/index"; @import "govuk/objects/index"; +@import "govuk/components/cookie-banner/index"; @import "govuk/components/footer/index"; @import "govuk/components/header/index"; @import "govuk/components/inset-text/index"; diff --git a/lib/source/layouts/_cookie_banner.erb b/lib/source/layouts/_cookie_banner.erb new file mode 100644 index 00000000..fc9732a8 --- /dev/null +++ b/lib/source/layouts/_cookie_banner.erb @@ -0,0 +1,22 @@ +
+
+
+
+

+ Cookies on <%= config[:tech_docs][:service_name] %> +

+
+

We’d like to use analytics cookies so we can understand how you use the service and make improvements.

+
+
+
+
+ + +
+
+
diff --git a/lib/source/layouts/core.erb b/lib/source/layouts/core.erb index c46b5d04..b9caa900 100644 --- a/lib/source/layouts/core.erb +++ b/lib/source/layouts/core.erb @@ -52,6 +52,7 @@
+ <%= partial 'layouts/cookie_banner' %>
Skip to main content From 328d6f2f4d627d41de67a4bcedc9e6ce4ccb3b25 Mon Sep 17 00:00:00 2001 From: Ynda Jas Date: Wed, 12 Nov 2025 11:53:42 +0000 Subject: [PATCH 4/7] Only show cookie banner if consent required The cookie banner/option to set cookie preferences will only be used when attempting to track usage data via Google Tag Manager, at least initially. The gem already supports the alternative gtag.js approach and introducing a cookie banner consent step to that flow would be a breaking change --- lib/source/layouts/_cookie_banner.erb | 38 ++++++++++++++------------- 1 file changed, 20 insertions(+), 18 deletions(-) diff --git a/lib/source/layouts/_cookie_banner.erb b/lib/source/layouts/_cookie_banner.erb index fc9732a8..eecb9bfc 100644 --- a/lib/source/layouts/_cookie_banner.erb +++ b/lib/source/layouts/_cookie_banner.erb @@ -1,22 +1,24 @@ -
-
-
-
-

- Cookies on <%= config[:tech_docs][:service_name] %> -

-
-

We’d like to use analytics cookies so we can understand how you use the service and make improvements.

+<% if config[:tech_docs][:ga4_gtm_tracking_id].is_a?(String) && !config[:tech_docs][:ga4_gtm_tracking_id].empty? %> +
+
+
+
+

+ Cookies on <%= config[:tech_docs][:service_name] %> +

+
+

We’d like to use analytics cookies so we can understand how you use the service and make improvements.

+
-
-
- - +
+ + +
-
+<% end %> From b2f8a34feec331bf539400e61181cadba12046b5 Mon Sep 17 00:00:00 2001 From: Ynda Jas Date: Fri, 14 Nov 2025 12:50:40 +0000 Subject: [PATCH 5/7] Hook up cookie banner The buttons on the cookie banner will now set a couple of cookies indicating that cookie preferences have been set and what the user's preference is regarding usage tracking The preference cookie "cookies_policy" follows the pattern of govuk_publishing_components: a stringified object. We only set the `usage` property on this object for now, but the approach provides some extensibility in case there's later a use for other preference-tracking properties like those included in govuk_publishing_components https://github.com/alphagov/govuk_publishing_components/blob/a35e0852f02f1fcfc1036ec2e254477e65b44e17/app/assets/javascripts/govuk_publishing_components/lib/cookie-functions.js#L7-L12 The cookie banner is now hidden by default and only shown if cookie preferences haven't been set (in addition to the required config being set, which is checked in the Ruby/ERB code) --- .../javascripts/_modules/cookie-banner.js | 39 +++++++++++++++++++ lib/assets/javascripts/_start-modules.js | 1 + lib/source/layouts/_cookie_banner.erb | 6 +-- 3 files changed, 43 insertions(+), 3 deletions(-) create mode 100644 lib/assets/javascripts/_modules/cookie-banner.js diff --git a/lib/assets/javascripts/_modules/cookie-banner.js b/lib/assets/javascripts/_modules/cookie-banner.js new file mode 100644 index 00000000..5017457f --- /dev/null +++ b/lib/assets/javascripts/_modules/cookie-banner.js @@ -0,0 +1,39 @@ +(function ($, Modules) { + 'use strict' + + Modules.CookieBanner = function () { + let $cookieBanner + + this.start = function ($element) { + $cookieBanner = $element + + if ($cookieBanner && getCookie('cookies_preferences_set') !== 'true') { + $('#cookie-banner__accept').on('click', acceptCookies) + $('#cookie-banner__reject').on('click', rejectCookies) + + $cookieBanner.removeAttr('hidden') + } + } + + function acceptCookies () { + document.cookie = 'cookies_preferences_set=true' + document.cookie = 'cookies_policy={"usage":true}' + + $cookieBanner.attr('hidden', 'hidden') + } + + function rejectCookies () { + document.cookie = 'cookies_preferences_set=true' + document.cookie = 'cookies_policy={"usage":false}' + + $cookieBanner.attr('hidden', 'hidden') + } + + function getCookie (name) { + return document.cookie + .split('; ') + .find(cookie => cookie.split('=')[0] === name) + ?.split('=')[1] + } + } +})(jQuery, window.GOVUK.Modules) diff --git a/lib/assets/javascripts/_start-modules.js b/lib/assets/javascripts/_start-modules.js index dcf4b08e..5f945f77 100644 --- a/lib/assets/javascripts/_start-modules.js +++ b/lib/assets/javascripts/_start-modules.js @@ -1,5 +1,6 @@ //= require _govuk/modules //= require _modules/anchored-headings +//= require _modules/cookie-banner //= require _modules/in-page-navigation //= require _modules/navigation //= require _modules/page-expiry diff --git a/lib/source/layouts/_cookie_banner.erb b/lib/source/layouts/_cookie_banner.erb index eecb9bfc..3ee13b01 100644 --- a/lib/source/layouts/_cookie_banner.erb +++ b/lib/source/layouts/_cookie_banner.erb @@ -1,5 +1,5 @@ <% if config[:tech_docs][:ga4_gtm_tracking_id].is_a?(String) && !config[:tech_docs][:ga4_gtm_tracking_id].empty? %> -
+