Měření konverzí z Contact Form 7 v Google Analytics

POZOR!
V souvislosti s novou verzí Contact Form 7 přestal být návod na této stránce funkční.

Na tvorbu komerčních webů se stále častěji používá i WordPress, redakční systém určený původně pro blogování.

Jedním z nejoblíbenějších pluginů pro tvorbu kontaktních formulářů ve WordPressu je Contact Form 7 a nejoblíbenějším analytickým nástrojem jsou Google Analytics.

V tomto článku najdete přesný popis toho, jak měřit splněné cíle, tedy odeslané formuláře pomocí Contact Form 7, v Google Analytics.

Proč konverze měřit

Nenechte se zmást názvem pluginu, s pomocí Contact Form 7 lze vytvářet celkem snadno i rozsáhlejší formuláře, které nemusí sloužit pouze pro rychlou možnost kontaktování návštěvníkem webu, ale stejně dobře i pro odesílání nejrůznějších poptávek, nezávazných objednávek apod.

Při těchto možnostech použití se pak jasně nabízí otázka, jací lidé formulář odesílají, odkud přišli, jak se na webu pohybovali a naopak proč jiní lidé formulář nakonec neodeslali.

Stručně o Contact Form 7

Contact Form 7 je plugin, s jehož pomocí si můžete sestavit vlastní formulář, vložit ho na jakoukoli stránku WordPressu a nechat si vyplněná a odeslaná formulářová pole odesílat buď na jednu e-mailovou adresu, nebo i na více adres. S pomocí pluginu Contact Form DB můžete navíc ta samá data ukládat i do databáze WordPressu.

Stručně o Google Analytics

Tento analytický nástroj od Googlu poskytovaný zdarma, Google Analytics (dále jen GA), umožňuje správci webu zjišťovat informace o návštěvnících, čtenářích či zákaznících. Zásadní pro tento článek je fakt, že s pomocí GA lze zjistit, odkud přišel návštěvník webu, jak se choval, jaké prošel stránky a například jak dlouho na nich byl, než se dostal k odeslání formuláře.

V praxi se měření konverzí, tedy například odeslání objednávek, realizuje vložením kódu na konverzní stránku, tedy typicky na stránku, kam se návštěvník dostane po odeslání formuláře, například na potvrzení odeslání, poděkování za odeslání apod.

Jak měřit konverze z Contact Form 7

V případě tohoto pluginu se ale návštěvník na jinou stránku nepřesouvá a konverzi, tedy odeslání, je potřeba měřit a zaznamenat jako událost.

Poznámka: Jde o výchozí chování Contact Form 7, nicméně i v tomto pluginu lze dodatečným nastavením zařídit, aby se návštěvník po odeslání formuláře přesunul na jakoukoli jinou URL adresu, to však není předmětem tohoto článku.


Začneme tedy vložením příslušného kódu do Contact Form 7.

Vložení kódu do Contact Form 7

Při editování kontaktního formuláře přes odkaz „Kontakt“ v levém menu administrace WordPressu a volbou příslušného formuláře, najděte úplně dole pole pro zadání dalšího nastavení.

Váš kód může vypadat třeba takto:

Konverzní kód v Contact Form 7

Zde kód pro zkopírování:

on_sent_ok:"_gaq.push(['_trackEvent','objednavka','odeslano']);"


Nastavení v Google Analytics

Pochopení kódu poskytne Google Analytic, kde je potřeba nastavit cíl.

V horní nabídce klikněte na odkaz „Správce„.

Na panelu „ZOBRAZENÍ“ pak klikněte na odkaz „Cíle„, jak je vidět na obrázku vlevo.

Dále klikněte na tlačítko „Nový cíl“ a postupujte podle pokynů. Napřed je tedy potřeba zvolit oblast (tržby, akvizice, průzkum..), která záleží na tom, co vlastně s formulářem na webu děláte.

Pro příklad zvolíme například „Tržby„, tedy komerční odeslání objednávky.

Šablony cíle v GA

Následuje další krok, v němž si zvolíte název cíle a jeho typ, v případě měření v Contact Form 7 je potřeba vybrat „Událost„.

Volba typu cíle

V dalším kroku „Podrobnosti cíle“ pak vyberete vlastní názvy, které musí být totožné v kódu vloženém do Contact Form 7, tedy v našem případě na obrázku výše bude nastavení vypadat takto:

Nastavení události v GA

Jak je na obrázku vidět, ve spodní části lze nastavit hodnotu takové události, kterou pak uvidíte v přehledech a snadněji si tak spočítáte, jakou hodnotu má například konkrétní zdroj návštěvníků, kteří odesílají objednávky.

Čeština pro WordPress 3.8.1

První opravná verze v podobě WordPressu 3.8.1 sice vyšla už před dvěma týdny a dnes ji následuje i oficiální čeština, a to zejména kvůli trochu nečekaným problémům (aneb automatické aktualizace lokalizovaných verzí ještě nefungují zcela ideálně). Při té příležitosti byly doplněny některé další přeložené řetězce, zejména informační emaily o proběhlých aktualizacích. Zajímavé pro nás bude asi […]

WordCamp Praha 2014

Dne 22. února 2014 se v Praze uskuteční první konference věnovaná redakčnímu systému WordPress. Konference nese název WordCamp Praha 2014 a je povolená a registrovaná centrálou WordCamp z USA. Česká republika se tak zařadí do seznamu 172 měst napříč 48 státy, kde se již WordCamp konal. Konference bude rozdělena do dvou sérií přednášek, kde první série nazvaná „Uživatelé“ […]

Twitter oEmbed not working in WordPress

On January 14th 2014 Twitter updated it’s API to force SSL on requests. This caused Twitter oEmbed API to not work in WordPress.

Despite there’s already a fix to this issue in trac you might want to fix this before an official update get’s live.

If so, here’s a snippet which you add to your functions.php ( originally published on github ) :

add_filter( 'oembed_providers', 'oembed_fix_twitter', 10, 1 );

function oembed_fix_twitter( $providers = array() ){
        $providers[ '#https?://(www.)?twitter.com/.+?/status(es)?/.*#i' ] = array( 'https://api.twitter.com/1/statuses/oembed.{format}', true );
        return $providers;
}

Note: You might have to update all posts where oEmbed failed previously (most like posts published since Jan 14th 2014 till today) as oEmbeds are being cached in post_meta table per post.

This fix is brought to you by Parade dev team.

Twitter oEmbed not working in WordPress

On January 14th 2014 Twitter updated it’s API to force SSL on requests. This caused Twitter oEmbed API to not work in WordPress.

Despite there’s already a fix to this issue in trac you might want to fix this before an official update get’s live.

If so, here’s a snippet which you add to your functions.php ( originally published on github ) :

add_filter( 'oembed_providers', 'oembed_fix_twitter', 10, 1 );

function oembed_fix_twitter( $providers = array() ){
        $providers[ '#https?://(www.)?twitter.com/.+?/status(es)?/.*#i' ] = array( 'https://api.twitter.com/1/statuses/oembed.{format}', true );
        return $providers;
}

Note: You might have to update all posts where oEmbed failed previously (most like posts published since Jan 14th 2014 till today) as oEmbeds are being cached in post_meta table per post.

This fix is brought to you by Parade dev team.

Čeština pro WordPress 3.8

Čeština pro WordPress 3.8 vychází necelý měsíc po anglické verzi a není sice ještě zcela kompletní, ale běžný uživatel si anglických řetězců ani nevšimne (zejména jde o nápovědu). Čeština pro WordPress 3.8 obsahuje mnoho nově přeložených řetězců a také některé změny. S překladem pomáhalo několik uživatelů (Díky!), kteří by měli být uvedeni na informační stránce přímo v […]