How to store UTM parameters in a cookie using google tag manager

Question

您好，我正在投放 Facebook 广告，访问者登陆 URL 中带有 UTM 参数的日历预订页面（嵌入在我的网站上）。

当他们预订时，他们会被重定向到发生问题的另一个页面。由于 calendly 的性质以及我必须如何使用重定向，它删除了我在他们登陆的页面上需要的所有 utm 参数，以发送到谷歌分析。

我是一个新手，对 javascript 没有经验，所以我一直在寻求 chatgpt 的帮助来帮助我编写脚本。

Calendly 说一个不错的选择是拥有一个存储所有 utm 参数的 cookie，这是我的代码的用途，并使用谷歌标签管理器 (GTM) 触发。

我创建的标签正确触发但是我在控制台窗口中没有看到任何 cookie 或控制台日志消息：

<script>
      console.log("Setting cookie: FbAdUTMCookie");  
function getQueryParam(url, param) {

  var queryString = url.split('?')[1];
  if (!queryString) return null;

  var params = queryString.split('&');
  for (var i = 0; i < params.length; i++) {
    var keyValue = params[i].split('=');
    if (keyValue[0] === param) {
      return decodeURIComponent(keyValue[1]);
    }
  }
  return null;
}

function setCookie(name, value, days) {
  var expires = "";
  if (days) {
    var date = new Date();
    date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
    expires = "; expires=" + date.toUTCString();
  }
  document.cookie = name + "=" + (value || "") + expires + "; path=/";
}

function storeUtmParameters() {
  var utmParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_content', 'ad_id', 'adset_id', 'campaign_id', 'site_source_name', 'adset_name'];
  var eventData = {};

  for (var i = 0; i < utmParams.length; i++) {
    var paramValue = getQueryParam(window.location.href, utmParams[i]);
    if (paramValue) {
      eventData[utmParams[i]] = paramValue;
    }
  }

  if (Object.keys(eventData).length > 0) {
    console.log("Setting cookie: FbAdUTMCookie");
    setCookie('FbAdUTMCookie', JSON.stringify(eventData), 30); // Store cookie for 30 days
  }
}

</script>

Answer 1

<script>
      console.log("Setting cookie: FbAdUTMCookie");  
function getQueryParam(url, param) {

  var queryString = url.split('?')[1];
  if (!queryString) return null;

  var params = queryString.split('&');
  for (var i = 0; i < params.length; i++) {
    var keyValue = params[i].split('=');
    if (keyValue[0] === param) {
      return decodeURIComponent(keyValue[1]);
    }
  }
  return null;
}

function setCookie(name, value, days) {
  var expires = "";
  if (days) {
    var date = new Date();
    date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
    expires = "; expires=" + date.toUTCString();
  }
  document.cookie = name + "=" + (value || "") + expires + "; path=/";
}

function storeUtmParameters() {
  var utmParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_content', 'ad_id', 'adset_id', 'campaign_id', 'site_source_name', 'adset_name'];
  var eventData = {};

  for (var i = 0; i < utmParams.length; i++) {
    var paramValue = getQueryParam(window.location.href, utmParams[i]);
    if (paramValue) {
      eventData[utmParams[i]] = paramValue;
    }
  }

  if (Object.keys(eventData).length > 0) {
    console.log("Setting cookie: FbAdUTMCookie");
    setCookie('FbAdUTMCookie', JSON.stringify(eventData), 30); // Store cookie for 30 days
  }
}

// Here
storeUtmParameters();

</script>

看起来你只是错过了调用你已经声明的函数

storeUtmParameters

。

但是从这段代码来看，少了一些东西。您将存储每个具有 utm 的流量。以下内容可能会消失

1. 谷歌广告：启用自动标记。 这将使 url 像：?gclid=xxxxxx => 通常 GA 会显示

   google/cpc

2. FB 也有这个功能，会让 url 像 ?fbclid=xxxxx

3. 自然流量不会显示。因为这些流量被 referral 识别为 google.com 或 bing.com（搜索引擎域）