【问题标题】:Retina display checking on GTMGTM 上的 Retina 显示检查
【发布时间】:2016-05-23 07:33:30
【问题描述】:

我试图寻找一种方法来分析视网膜显示与正常显示转换率,但我找不到正确的变量来检查设备是否使用视网膜显示。我在许多论坛中搜索过,帖子要么太旧(自 2010 年以来),要么由于 GTM 的变化而过时。 有谁知道是否可以在 GTM 中跟踪设备分辨率?

如果您要参考链接回答,请确保您阅读了解决方案的完整描述,因为我已经经历了很多,并且由于我提到的原因,它们都被证明是错误的或无法实施之前。

我找到了this answer,但不幸的是最后一条评论说它停止工作了。

【问题讨论】:

    标签: retina-display google-tag-manager screen-resolution


    【解决方案1】:

    GTM 本身不测量任何东西,但您可以使用任何可以通过 javascript 获取的值。

    我发现检测视网膜显示器的一个建议是使用devicepixelratio,其中显然是ratio equal to or higher than 2 suggests a retina display。 devicepixelratio 在 IE 上不起作用(不过适用于 Edge),但这里有一个指向 suggested polyfill 的链接。

    因此,如果您在 GTM 中创建自定义 JS 变量,您可以使用它(我承认我自己没有测试过,但它似乎对其他人有用)。

    【讨论】:

      【解决方案2】:

      Google Analytics(分析)跟踪屏幕分辨率 - 您可以在自定义报告中、作为二级维度或通过导航至: 受众>技术>浏览器和操作系统>屏幕分辨率(屏幕分辨率是图表下方的可选主要维度)。

      此图表为您提供目标转化率,但如果您愿意,您还可以创建一个包含您喜欢的分辨率的细分,并创建一个包含其他分辨率的细分,然后在任何其他报告中比较这两者。

      但是,“Retina Display”是 Apple 使用的营销术语(实际上是他们的注册商标)。尽管这个术语确实有道理,比人类视网膜能够观察到的像素密度更高,但您会发现它们对它的使用会有所不同,因为您需要在距脸部不同的距离处持有不同的设备。因此,预计“视网膜”iPhone 的像素密度将高于“视网膜”iPad。

      【讨论】:

        【解决方案3】:

        您还可以更改函数以使用 matchMedia 和使用 dpi 而不是 devicePixelRatio 的分辨率来检测它是否是视网膜:

        创建自定义 JavaScript 变量,pixel_ratio:

        function () {
            //Configure resolutions here, will return value of ratio:
            var pixel_ratio = [
            {'pixel_ratio': 'all', 'ratio': 1},
            {'pixel_ratio': '(min-resolution: 144dpi)', 'ratio': 1.5},
            {'pixel_ratio': '(min-resolution: 192dpi)', 'ratio': 2}
            ];
            var result;
            pixel_ratio.forEach(function (element) {
                var ratio = 1;
                //If browser support matchMedia, use it
                if (window.matchMedia) {
                // return current media query
                    if (window.matchMedia(element.pixel_ratio).matches) {
                        result = element.ratio;
                    }
                    } else { //matchMedia not supported
                        if (window.screen.systemXDPI !== undefined 
                            && window.screen.logicalXDPI !== undefined 
                            && window.screen.systemXDPI > window.screen.logicalXDPI) {
                    // Only allow for values > 1
                    ratio = window.screen.systemXDPI / window.screen.logicalXDPI;
                    } else if (window.devicePixelRatio !== undefined) {
                        ratio = window.devicePixelRatio;
                    }
                    if (element.ratio === (Math.round(ratio * 100) / 100)) {
                        result = element.ratio;
                    }
                }
            });
            return result + 'x';
        }
        

        在 GA 中为 pixel_ratio 创建自定义维度。选择范围为“命中”。请注意每个维度的索引值。 在 GTM 中,在基本 GA 网页浏览代码中配置自定义维度,匹配来自 GA 的维度索引值。

        【讨论】:

        • 在尝试使用 matchMEdia 和分辨率与 dpi 的功能后,我检测到没有将正确的数据拉到 GM。最好只使用 devicePixelRatio 以获得准确的数据: function () { return devicePixelRatio + 'x'; }
        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2014-02-19
        • 2016-10-24
        • 2015-09-03
        • 1970-01-01
        • 2014-08-09
        • 1970-01-01
        相关资源
        最近更新 更多