如何编写禁用样式表的Google内容实验？

Question

I am currently trying to setup a Client Side Experiment without Redirects as opposed to the default Content Experiment A/B testing. 我目前正在尝试设置不带重定向的客户端实验，而不是默认的内容实验A / B测试。 All I want to do is for half my visitors disable one of two existing stylesheets on a page. 我要做的就是让一半的访问者禁用页面上两个现有样式表之一。

To me it doesn't make sense to do this the default A/B way because then I would have to setup a second page with the stylesheet disabled for every page on my site. 对我来说，以默认的A / B方式执行此操作是没有意义的，因为那样的话，我将不得不在我的网站上的每个页面都禁用样式表的情况下设置第二个页面。

There is also Running a Server-side Experiment but to me that is too heavy handed for something I think should be somewhat simple. 还有一个正在运行的服务器端实验，但对我来说，对于某些我认为应该比较简单的事情来说，它实在太繁琐了。

I have the js all setup, I just need to be able to tell the page that when there is a given variation disable the stylesheet or don't render the stylesheet before the DOM loads. 我已经完成了js的所有设置，我只需要告诉页面在存在给定的变体时禁用样式表或在加载DOM之前不呈现样式表。

One thing I considered is, given a certain variation, redirect to the same page but append a url query parameter like &stylesheet_disabled=true then I would simply not render the stylesheet on the server side but when I briefly looked at that I ran into a redirect loop but perhaps someone has a better way to write the js. 我考虑的一件事是，给定一定的变化后，重定向到同一页面，但附加了&stylesheet_disabled=true这样的url查询参数&stylesheet_disabled=true那么我不会在服务器端仅渲染样式表，但是当我短暂地看一下时，我遇到了重定向循环，但也许有人有更好的方式编写js。

Any help greatly appreciated. 任何帮助，不胜感激。

Answer 1

Here is how I did it: 这是我的做法：

<head>
    <script src="//www.google-analytics.com/cx/api.js?experiment=EXPERIMENT_ID"></script>
    <script>
        // Ask Google Analytics which variation to show the visitor.
        var chosenVariation = cxApi.chooseVariation();
        function redirectVariation($variation) {
            var url = window.location.href;
            if ($variation === 1) {
                var queryString = document.location.search;
                if (queryString.indexOf("stylesheet_disabled=true") == -1) {
                    if (Boolean(queryString)) {
                        url += "&stylesheet_disabled=true";
                    } else {
                        url += "?stylesheet_disabled=true";
                    }
                    window.location.href = url;
                }
            }
        }
        redirectVariation(chosenVariation);
    </script>

This is only setup for one different variation but could easily be modified for more. 此设置仅适用于一种不同的变体，但可以轻松进行修改以实现更多变体。 Then you just have your application on the server side detect the presence of the querystring parameter and execute whatever logic you like, in my case not displaying a stylesheet. 然后，您只需在服务器端使您的应用程序检测到querystring参数的存在并执行您喜欢的任何逻辑，就我而言，不显示样式表。

Theoretically this could be used to do any kind of server side logic with GA Content Experiment Client Side Redirects. 从理论上讲，它可以用于通过GA Content Experiment Client Side Redirects执行任何类型的服务器端逻辑。 Hopefully this helps someone else. 希望这可以帮助其他人。

Answer 2

You could do something like this: 您可以执行以下操作：

<head>
  ...
  <script>
    if (cxApi.chooseVariation() != 1) { // not in the experiment
      document.write('<link href="... />'); // add the stylesheet
    }
  </script>
  ...

Only use document.write while the page is still being loaded. 仅在页面仍在加载时使用document.write 。

This is all client-side, so no need for redirects and extra server work. 这都是客户端，因此不需要重定向和额外的服务器工作。

如何编写禁用样式表的Google内容实验？

问题描述

2 个解决方案

解决方案1
1 2013-08-25 20:51:33

解决方案2
1 已采纳 2013-08-26 03:29:29

如何编写禁用样式表的Google内容实验？

问题描述

2 个解决方案

解决方案1 1 2013-08-25 20:51:33

解决方案2 1 已采纳 2013-08-26 03:29:29

解决方案1
1 2013-08-25 20:51:33

解决方案2
1 已采纳 2013-08-26 03:29:29