AMP 项目 - Google Analytics - 内容分组 amp-analytics 代码答案

【问题标题】：AMP Project - Google Analytics - Content Grouping amp-analytics codeAMP 项目 - Google Analytics - 内容分组 amp-analytics 代码
【发布时间】：2023-06-25 21:01:01
【问题描述】：

我正在尝试将内容分组变量分配给我的 AMP 标记中的 Google Analytics（分析）代码。

我的 AMP 分析代码：

<amp-analytics type="googleanalytics" id="analyticsgoogle1">
    <script type="application/json">
    {
        "vars": {
            "account": "UA-XXXXXXXX-X"
        },
        "triggers": {
            "trackPageview": {
                "on": "visible",
                "request": "pageview"
            }
        }
    }
    </script>
</amp-analytics>

我的常规 Google 分析代码：

<script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
    ga('create', 'UA-XXXXXXXX-X', 'auto');
    ga('set', 'contentGroup1', 'My Category');
    ga('set', 'contentGroup2', 'My Author Type');
    ga('set', 'contentGroup3', 'My Author Name');
    ga('send', 'pageview');
</script>

我知道它没有在文档中列出，但我正在寻找类似的方法，以便可以像我的常规页面一样跟踪我的 AMP 页面。

可能的 AMP 项目带有内容分组的 Google Analytics 代码：

<amp-analytics type="googleanalytics" id="analyticsgoogle1">
<script type="application/json">
{
    "vars": {
        "account": "UA-XXXXXXXX-X"
    },
    "triggers": {
        "trackPageview": {
            "on": "visible",
            "request": "pageview"
            "vars": {
                "contentGroup1": "My Category",
                "contentGroup2": "My Author Type",
                "contentGroup3": "My Author Name"
            }
        }
    }
}
</script></amp-analytics>

在查看 amp-analytics 中支持的变量的文档时，我没有看到内容分组变量： https://github.com/ampproject/amphtml/blob/master/extensions/amp-analytics/analytics-vars.md

这里是关于 amp-analytics 代码的文档：https://developers.google.com/analytics/devguides/collection/amp-analytics/

【问题讨论】：

您的方法实际上可以通过额外的更改来实现，但使用“extraUrlParams”的解决方案更优雅。

标签： google-analytics amp-html

【解决方案1】：

我提出了一个可行的解决方案。其实很简单。以下代码的注释相同。

cg1 = contentGroup1, cg2 = contentGroup2

关于Measurement protocol的详细信息

重要提示：如果您想查看您对 GA 的真实请求，请使用浏览器中的限制。在其他情况下，您将看到来自 GA 的重定向链，而不是您的真实请求。很烦人。

<amp-analytics type="googleanalytics" id="ga1">
    <script type="application/json">
        {
            "extraUrlParams" : {
                "cd4": "AMP"
                <?php if($this->tracking_group_config['group'] === 'contentGroup1'):?>
                ,"cg1": "<?=$this->tracking_group_config['type']?>"
                <?php elseif($this->tracking_group_config['group'] === 'contentGroup2'): ?>
                ,"cg2": "<?=$this->tracking_group_config['type']?>"
                <?php endif; ?>
            },
            "vars": {
                "account": "[Your GA account ID here]"
            },
            "triggers": {
                "pageviewCustom": {
                    "on": "visible",
                    "request": "pageview"
                }
            }
        }
    </script>
</amp-analytics>

【讨论】：

你能解释一下“在浏览器中使用限制”吗？谢谢。

【解决方案2】：

使用 gtag，此代码将起作用：

  <amp-analytics type="gtag" data-credentials="include">
    <script type="application/json">
    {
      "vars": {
        "gtag_id": "UA-XXXXXXXX-YY",
        "config": {
          "UA-XXXXXXXX-YY": {
            "groups": "default",
            "content_group1": "my value",
            "content_group3": "my other value"
          }
        }
      }
    }
    </script>
  </amp-analytics>

您也可以使用网络选项卡下的 Chrome 开发工具对其进行调试：

希望对你有帮助！

【讨论】：