Add UTM campaign sources

docusaurus.config.js

@@ -252,10 +252,12 @@ const config = {
           {
             label: "Changelog",
             to: "/changelog-landing",
+            datautmcampaign: "changelog",
           },
           {
             label: "Support",
             to: "https://support.elasticpath.com",
+            dataUtmCampaign: "support",
           },
           {
             type: "search",
@@ -266,12 +268,14 @@ const config = {
             href: "https://www.elasticpath.com/get-in-touch",
             position: "right",
             className: "navbar-book-demo",
+            dataUtmCampaign: "get-in-touch",
           },
           {
             label: "Free Trial",
             href: "https://useast.cm.elasticpath.com/free-trial",
             position: "right",
             className: "dev-portal-signup dev-portal-link",
+            dataUtmCampaign: "free-trial",
           },
         ],
       },
@@ -313,7 +317,7 @@ const config = {
               },
               {
                 label: "GitHub",
-                href: "https://github.com/facebook/docusaurus",
+                href: "https://github.com/elasticpath",
               },
             ],
           },

src/snippets/resourceDOCS.html

@@ -40,6 +40,7 @@
               onmouseover="document.body.setAttribute('docs-menu', 'cm')"
               class="flex cursor-pointer !mt-2 items-start justify-start gap-2 border-none bg-transparent text-black dark:text-white"
               href="/ui"
+              datautmcampaign="commerce-manager"
       >
         <div class="flex-shrink-0">
           <img
@@ -62,6 +63,7 @@
               onmouseover="document.body.setAttribute('docs-menu', 'pxm')"
               class="flex cursor-pointer !mt-2 items-start justify-start gap-2 border-none bg-transparent text-black dark:text-white"
               href="/pxm"
+              datautmcampaign="pxm"
       >
         <div class="flex-shrink-0">
           <img
@@ -84,6 +86,7 @@
               onmouseover="document.body.setAttribute('docs-menu', 'subs')"
               class="flex cursor-pointer !mt-2 items-start justify-start gap-2 border-none bg-transparent text-black dark:text-white"
               href="/subscriptions"
+              datautmcampaign="subscriptions"
       >
         <div class="flex-shrink-0">
           <img
@@ -106,6 +109,7 @@
               onmouseover="document.body.setAttribute('docs-menu', 'carts')"
               class="flex cursor-pointer !mt-2 items-start justify-start gap-2 border-none bg-transparent text-black dark:text-white"
               href="/orders"
+              datautmcampaign="carts"
       >
         <div class="flex-shrink-0">
           <img
@@ -146,6 +150,7 @@
               onmouseover="document.body.setAttribute('docs-menu', 'studio')"
               class="flex cursor-pointer !mt-2 items-start justify-start gap-2 border-none bg-transparent text-black dark:text-white"
               href="/docs/studio"
+              datautmcampaign="studio"
       >
         <div class="flex-shrink-0">
           <img
@@ -168,6 +173,7 @@
               onmouseover="document.body.setAttribute('docs-menu', 'composer')"
               class="flex cursor-pointer !mt-2 items-start justify-start gap-2 border-none bg-transparent text-black dark:text-white"
               href="/docs/composer"
+              datautmcampaign="composer"
       >
         <div class="flex-shrink-0">
           <img
@@ -190,6 +196,7 @@
               onmouseover="document.body.setAttribute('docs-menu', 'payments')"
               class="flex cursor-pointer !mt-2 items-start justify-start gap-2 border-none bg-transparent text-black dark:text-white"
               href="/docs/payments"
+              datautmcampaign="payments"
       >
         <div class="flex-shrink-0">
           <img
@@ -212,6 +219,7 @@
               onmouseover="document.body.setAttribute('docs-menu', 'developer')"
               class="flex cursor-pointer !mt-2 items-start justify-start gap-2 border-none bg-transparent text-black dark:text-white"
               href="/docs/developer-tools"
+              datautmcampaign="developer-tools"
       >
         <div class="flex-shrink-0">
           <img
@@ -235,6 +243,7 @@
         class="flex cursor-pointer !mt-4 items-start justify-start gap-2 border-none bg-transparent text-black dark:text-white"
         href="https://documentation.elasticpath.com"
         target="_blank"
+        datautmcampaign="self-managed"
       >
         <div class="flex-shrink-0">
           <img

static/js/utm-handler.js

@@ -1,8 +1,31 @@
 // Default UTM parameters
 const DEFAULT_UTM = {
-  utm_source: 'docs',
-  utm_medium: 'documentation',
-  utm_campaign: 'elasticpath_docs'
+  utm_source: 'elastic-path-dev',
+  utm_medium: 'dev-site',
+  utm_campaign: 'fy25q1-dev'
+};
+
+// Campaign mapping for different buttons
+const CAMPAIGN_MAPPING = {
+  'support': 'fy25q1-dev-support',
+  'freetrial': 'fy25q1-dev-free-trial',
+  'docs': 'fy25q1-dev-documentation',
+  'get-in-touch': 'fy25q1-dev-get-in-touch',
+  'guides': 'fy25q1-dev-guides',
+  'videos': 'fy25q1-dev-videos',
+  'api': 'fy25q1-dev-api',
+  'sample-apps': 'fy25q1-dev-sample-apps',
+  'changelog': 'fy25q1-dev-changelog',
+  'commerce-manager': 'fy25q1-dev-commerce-manager',
+  'pxm': 'fy25q1-dev-pxm',
+  'subscriptions': 'fy25q1-dev-subscriptions',
+  'carts': 'fy25q1-dev-carts',
+  'studio': 'fy25q1-dev-studio',
+  'composer': 'fy25q1-dev-composer',
+  'payments': 'fy25q1-dev-payments',
+  'developer-tools': 'fy25q1-dev-developer-tools',
+  'self-managed': 'fy25q1-dev-self-managed',
+  // Add more campaign mappings as needed
 };
 
 // Get UTM params from URL if they exist
@@ -31,7 +54,7 @@ function getStoredUtmParams() {
 }
 
 // Add UTM params to a URL
-function addUtmToUrl(url) {
+function addUtmToUrl(url, campaignType) {
   try {
     const urlObj = new URL(url);
 
@@ -41,7 +64,12 @@ function addUtmToUrl(url) {
     }
 
     // Get stored or default UTM params
-    const utmParams = getStoredUtmParams() || DEFAULT_UTM;
+    const utmParams = getStoredUtmParams() || {...DEFAULT_UTM};
+
+    // Override campaign if specified
+    if (campaignType && CAMPAIGN_MAPPING[campaignType]) {
+      utmParams.utm_campaign = CAMPAIGN_MAPPING[campaignType];
+    }
 
     // Add UTM params to URL
     Object.entries(utmParams).forEach(([key, value]) => {
@@ -67,7 +95,9 @@ function initUtmHandler() {
   document.addEventListener('click', (e) => {
     const link = e.target.closest('a');
     if (link && link.href) {
-      const modifiedUrl = addUtmToUrl(link.href);
+      // Get the campaign type from the data attribute
+      const campaignType = link.getAttribute('datautmcampaign');
+      const modifiedUrl = addUtmToUrl(link.href, campaignType);
       if (modifiedUrl !== link.href) {
         e.preventDefault();
         window.location.href = modifiedUrl;