Gather utm params and add to outbound product links (#1336)

* gather utm params and add to outbound product links

* segment needs testing across all environments, not just in production

* campaign => content

* adding two more ids

* sessionStorage for gtm params and cleanup

* move newParams conditional

* move addUTMToLinks() to helpers file

qdrant-landing/themes/qdrant-2024/assets/js/helpers.js

@@ -104,3 +104,48 @@ export function addGA4Properties(properties) {
   properties.ga_session_id = getCookie('_ga_' + gaMeasurementId)?.replace('GS1.1.','').split('.')[0];
   properties.ga_client_id = getCookie('_ga')?.replace('GA1.1.','');
 }
+
+export function addUTMToLinks() {
+  const urlParams = new URLSearchParams(window.location.search);
+
+  // Gather all GTM related params
+  const utmIds = {
+      gcl: urlParams.get('gclid'),
+      gbra: urlParams.get('gbraid'),
+      wbra: urlParams.get('wbraid'),
+  };
+
+  const utmParams = {
+      source: urlParams.get('utm_source'),
+      medium: urlParams.get('utm_medium'),
+      campaign: urlParams.get('utm_campaign'),
+      content: urlParams.get('utm_content')
+  };
+
+  // Create new params string for outbound links and store in sessionStorage
+  let newParams = '';
+  for (const key in utmIds) {
+      if (utmIds[key]) {
+          sessionStorage.setItem(`${key}id`, utmIds[key]);
+          newParams += `${key}id=${utmIds[key]}&`;
+      }
+  }
+  for (const key in utmParams) {
+      if (utmParams[key]) {
+          sessionStorage.setItem(`utm_${key}`, utmParams[key]);
+          newParams += `utm_${key}=${utmParams[key]}&`;
+      }
+  }
+
+  // Add url params to outbound links to product site
+  if (newParams.length > 0) {
+      newParams = newParams.replace(/[&|?]$/, ''); // remove trailing & or ?
+
+      const links = document.querySelectorAll('a[href*="cloud.qdrant.io"]');
+      links.forEach(link => {
+          const href = link.href;
+          const separator = href.indexOf('?') === -1 ? '?' : '&';
+          link.href = `${href}${separator}${newParams}`;
+      });
+  }
+}

qdrant-landing/themes/qdrant-2024/assets/js/segment-setup.js

@@ -1,6 +1,11 @@
 import * as params from '@params';
 import { setCookie } from './helpers';
 import { setSegmentWriteKey } from './segment-helpers';
+import { addUTMToLinks } from './helpers';
+
+document.addEventListener('DOMContentLoaded', () => {
+    addUTMToLinks();
+});
 
 if (params.segmentWriteKey) {
     setSegmentWriteKey(params.segmentWriteKey);
@@ -8,4 +13,4 @@ if (params.segmentWriteKey) {
 
 if (params.gaMeasurementId) {
     setCookie('ga_measurement_id', params.gaMeasurementId, 365);
-}
+}

qdrant-landing/themes/qdrant-2024/layouts/partials/js-head.html

@@ -37,7 +37,7 @@
 {{ end }}
 
 <!--Segment-->
-{{ if and hugo.IsProduction .Site.Params.segmentWriteKey }}
+{{ if .Site.Params.segmentWriteKey }}
   {{ $segmentJs := resources.Get "js/segment-setup.js" | js.Build (dict "params" (dict "segmentWriteKey" .Site.Params.segmentWriteKey "gaMeasurementId" .Site.GoogleAnalytics)) | minify | resources.Fingerprint "sha512" }}
   <script src="{{ $segmentJs.RelPermalink }}?v=eu"></script>
 {{ end }}