Add google tag manager (#808)

reakaleek · web-flow · commit e0fdbe89724a · 2025-03-21T08:15:11.000Z
* Add google tag manager

* Add fallback noscript
diff --git a/src/Elastic.Markdown/Assets/main.ts b/src/Elastic.Markdown/Assets/main.ts
@@ -14,6 +14,13 @@ import {$, $$} from "select-dom"
 import { UAParser } from 'ua-parser-js';
 const { getOS } = new UAParser();
 
+document.addEventListener('htmx:pushedIntoHistory', function(event) {
+	window.dataLayer = window.dataLayer || [];
+	window.dataLayer.push({
+		event: "virtualPageview",
+		page_path: event.detail.path,
+	});
+});
 
 // Don't remove style tags because they are used by the elastic global nav.
 document.addEventListener('htmx:removingHeadElement', function(event) {
diff --git a/src/Elastic.Markdown/BuildContext.cs b/src/Elastic.Markdown/BuildContext.cs
@@ -35,6 +35,8 @@ public record BuildContext
 	// This property is used to determine if the site should be indexed by search engines
 	public bool AllowIndexing { get; init; }
 
+	public bool EnableGoogleTagManager { get; init; }
+
 	// This property is used for the canonical URL
 	public Uri? CanonicalBaseUrl { get; init; }
 
diff --git a/src/Elastic.Markdown/Slices/HtmlWriter.cs b/src/Elastic.Markdown/Slices/HtmlWriter.cs
@@ -116,6 +116,7 @@ private async Task<string> RenderLayout(MarkdownFile markdown, MarkdownDocument
 			GithubEditUrl = editUrl,
 			AllowIndexing = DocumentationSet.Build.AllowIndexing && !markdown.Hidden,
 			CanonicalBaseUrl = DocumentationSet.Build.CanonicalBaseUrl,
+			EnableGoogleTagManager = DocumentationSet.Build.EnableGoogleTagManager,
 			Features = DocumentationSet.Configuration.Features,
 			StaticFileContentHashProvider = StaticFileContentHashProvider
 		});
diff --git a/src/Elastic.Markdown/Slices/Index.cshtml b/src/Elastic.Markdown/Slices/Index.cshtml
@@ -16,6 +16,7 @@
 		GithubEditUrl = Model.GithubEditUrl,
 		AllowIndexing = Model.AllowIndexing,
 		CanonicalBaseUrl = Model.CanonicalBaseUrl,
+		EnableGoogleTagManager = Model.EnableGoogleTagManager,
 		Features = Model.Features,
 		StaticFileContentHashProvider = Model.StaticFileContentHashProvider
 	};
diff --git a/src/Elastic.Markdown/Slices/Layout/_Head.cshtml b/src/Elastic.Markdown/Slices/Layout/_Head.cshtml
@@ -26,4 +26,14 @@
 	{
 		<meta property="og:url" content="@Model.CanonicalUrl" />
 	}
+	@if (Model.EnableGoogleTagManager)
+	{
+		<!-- Google Tag Manager -->
+		<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+				new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+			j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+			'https://www.googletagmanager.com/gtm.js?id='+i+dl+ '&gtm_auth=nPocPUG0wiH68jsVeyRSxA&gtm_preview=env-507&gtm_cookies_win=x';f.parentNode.insertBefore(j,f);
+		})(window,document,'script','dataLayer','GTM-KNJMG2M');</script>
+		<!-- End Google Tag Manager -->
+	}
 </head>
diff --git a/src/Elastic.Markdown/Slices/_Layout.cshtml b/src/Elastic.Markdown/Slices/_Layout.cshtml
@@ -3,11 +3,22 @@
 <!DOCTYPE html>
 <html lang="en" class="h-screen">
 @await RenderPartialAsync(_Head.Create(Model))
-<body 
-	class="group/body text-ink has-[#primary-nav-hamburger:checked]:overflow-hidden" 
+<body
+	class="group/body text-ink has-[#primary-nav-hamburger:checked]:overflow-hidden"
 	hx-ext="preload, head-support"
-	data-root-path="@Model.Link("/")"
->
+	data-root-path="@Model.Link("/")">
+@if (Model.EnableGoogleTagManager)
+{
+	<!-- Google Tag Manager (noscript) -->
+	<noscript>
+		<iframe src="https://www.googletagmanager.com/ns.html?id=GTM-KNJMG2M&gtm_auth=nPocPUG0wiH68jsVeyRSxA&gtm_preview=env-507&gtm_cookies_win=x"
+		        height="0"
+		        width="0"
+		        style="display:none;visibility:hidden">
+		</iframe>
+	</noscript>
+	<!-- End Google Tag Manager (noscript) -->
+}
 @(await RenderPartialAsync(_Header.Create(Model)))
 <div id="main-container" class="flex flex-col items-center px-6 border-t-1 border-grey-20">
 	@functions {
@@ -35,7 +46,6 @@
 			</div>
 		}
 	}
-	
 	@switch (Model.CurrentDocument.YamlFrontMatter?.Layout)
 	{
 		case LayoutName.NotFound:
diff --git a/src/Elastic.Markdown/Slices/_ViewModels.cs b/src/Elastic.Markdown/Slices/_ViewModels.cs
@@ -27,6 +27,7 @@ public class IndexViewModel
 	public required ApplicableTo? Applies { get; init; }
 	public required bool AllowIndexing { get; init; }
 	public required Uri? CanonicalBaseUrl { get; init; }
+	public required bool EnableGoogleTagManager { get; init; }
 	public required FeatureFlags Features { get; init; }
 	public required StaticFileContentHashProvider StaticFileContentHashProvider { get; init; }
 }
@@ -50,6 +51,7 @@ public class LayoutViewModel
 	public required string? GithubEditUrl { get; init; }
 	public required bool AllowIndexing { get; init; }
 	public required Uri? CanonicalBaseUrl { get; init; }
+	public required bool EnableGoogleTagManager { get; init; }
 
 	public string? CanonicalUrl => CanonicalBaseUrl is not null ? new Uri(CanonicalBaseUrl, CurrentDocument.Url).ToString() : null;
 	public required FeatureFlags Features { get; init; }
diff --git a/src/docs-assembler/Building/AssemblerBuilder.cs b/src/docs-assembler/Building/AssemblerBuilder.cs
@@ -70,6 +70,7 @@ private async Task BuildAsync(Checkout checkout, PublishEnvironment environment,
 			UrlPathPrefix = environment.PathPrefix,
 			Force = false,
 			AllowIndexing = environment.AllowIndexing,
+			EnableGoogleTagManager = environment.EnableGoogleTagManager ?? false,
 			CanonicalBaseUrl = new Uri("https://www.elastic.co"), // Always use the production URL. In case a page is leaked to a search engine, it should point to the production site.
 			SkipMetadata = true
 		};
diff --git a/src/docs-assembler/Configuration/AssemblyConfiguration.cs b/src/docs-assembler/Configuration/AssemblyConfiguration.cs
@@ -85,4 +85,7 @@ public record PublishEnvironment
 
 	[YamlMember(Alias = "allow_indexing")]
 	public bool AllowIndexing { get; set; }
+
+	[YamlMember(Alias = "enable_google_tag_manager")]
+	public bool? EnableGoogleTagManager { get; set; }
 }
diff --git a/src/docs-assembler/assembler.yml b/src/docs-assembler/assembler.yml
@@ -3,9 +3,11 @@ environments:
     uri: https://www.elastic.co
     path_prefix: docs
     allow_indexing: false
+    enable_google_tag_manager: true
   staging:
     uri: https://staging-website.elastic.co
     path_prefix: docs
+    enable_google_tag_manager: true
   preview:
     uri: https://docs-v3-preview.elastic.dev
     path_prefix:

Original file line number	Diff line number	Diff line change
`@@ -85,4 +85,7 @@ public record PublishEnvironment`
`85`	`85`
`86`	`86`	`[YamlMember(Alias = "allow_indexing")]`
`87`	`87`	`public bool AllowIndexing { get; set; }`
	`88`	`+`
	`89`	`+ [YamlMember(Alias = "enable_google_tag_manager")]`
	`90`	`+ public bool? EnableGoogleTagManager { get; set; }`
`88`	`91`	`}`