A/B testování ve WordPressu s využitím Google Experiments

A/B testování je jedinečnou možností, jak vzájemně porovnat výkon více variant jedné podstránky Vašeho webu. Když hovoříme o výkonu, může to pro každého znamenat něco jiného. Pro někoho je metrikou pro měření výkonu doba strávená na stránce, pro někoho vyplnění poptávkového formuláře, e-shopy se zase orientují na počet dokončených objednávek. V praxi testování probíhá tak, že na množině uživatelů, z nichž je každé podskupině nabídnuta jiná varianta vstupní stránky, měříme již zmíněné metriky.

O A/B testování jsem měl mylnou představu, že je jeho konfigurace buď kdovíjak náročná nebo si člověk musí zaplatit drahý plugin. Jelikož se mi podařilo svůj první A/B experiment rozchodit za cca 10 minut a zadarmo, není pravda ani jedno.

Nastavení A/B testování se v prostředí Wordpresu skládá ze dvou částí:

Nastavení Experimentu v Google Analytics
Vložení JavaScriptového kódu na stránku předlohy A/B testování.

Nastavení Experimentu v Google Analytics

O Google Experimentech obecně a jejich nastavení je přehledně psáno v dokumentaci Google. Začnete tím, že si otevřete v Google Analytics v sekci Chování záložku Experimenty a zvolíte možnost “Vytvořit experiment” (galerie obr.1). Samotná kofigurace se skládá ze 4 kroků. :

Nastavíte si název experimentu, metriku, kterou budete sledovat (můžete i více). A podíl návštěvníků, které experimentu podrobíte. (obr.2)
Nastavíte předlohu, tedy původní stránku webu, se kterou budete chtít poměřovat její varianty. (obr. 3)
Zvolíte možnost manuálního přidání kódu na stránku předlohy (obr.3). Manuální přidání popisuji níže v tomto článku.
Zkontrolujete přidání kódu a spustíte experiment.

Manuální přidání JavaScriptového kódu experimentu do stránky předlohy

Je třeba, aby kód experimentu figuroval v kódu hlavičky stránky (mezi tagy <head></head>) pouze na stránce předlohy. Hlavičku můžete editovat přímo z administrace Wordpresu na záložce Vzhled -> Editor, kde vyberete jako stránku k editaci Záhlaví (header.php). Jelikož je ale hlavička pro všechny podstránky vašeho webu společná musíte si vypomoci krátkým PHP úryvkem, který říká, že kód experimentu bude umístěn pouze v hlavičce vybrané stránky:

if ( is_page( 'ID stránky' )) {
javascriptový kód zkopírovaný z Google Experiments }

Tento kód umístíte hned za tag ; ve zdrojovém kódu již zmiňovaného souboru header.php. ID stránky zjistíte snadno. Pokud stránku v administraci editujete, ID je číselná položka v URL adrese za řetězcem “post.php?post=”. V mém případě se jednalo o stránku s ID 2.

if ( is_page( '2' )) {    
<!-- Google Analytics Content Experiment code --><script>// <![CDATA[
function utmx_section(){}function utmx(){}(function(){var
k='110749754-0',d=document,l=d.location,c=d.cookie;
if(l.search.indexOf('utm_expid='+k)>0)return;
function f(n){if(c){var i=c.indexOf(n+'=');if(i>-1){var j=c.
indexOf(';',i);return escape(c.substring(i+n.length+1,j<0?c.
length:j))}}}var x=f('__utmx'),xx=f('__utmxx'),h=l.hash;d.write(
'<sc'+'ript src="'+'http'+(l.protocol=='https:'?'s://ssl': '://www')+'.google-analytics.com/ga_exp.js?'+'utmxkey='+k+ '&utmx='+(x?x:'')+'&utmxx='+(xx?xx:'')+'&utmxtime='+new Date(). valueOf()+(h?'&utmxhash='+escape(h.substr(1)):'')+ '" type="text/javascript" charset="utf-8"><\/sc'+'ript>')})();
// ]]></script><script>// <![CDATA[
utmx('url','A/B');
// ]]></script><!-- End of Google Analytics Content Experiment code -->}