Plugin CF 7 je velmi populární WordPress plugin, vždy aktualizovaný, lehce použitelný a skvěle měřitelný.
Měřit plugin CF 7 je možné několika postupy:
1) Využít další nastavení v pluginu
Bohužel tato varianta je v současné verzi CF 7 deprecated, ale bylo to fakt snadné:
2) Využití DOM events CF 7
Zjednodušeně řečeno, plugin CF 7 informuje stránku o tom, co se zrovna děje: zde je seznam události: Přejít na web CF7
Je možné například využití události pro wpcf7invalid (chyba při odeslání), wpcf7submit (úspěšné odeslání).
Následně při odeslání je možné pracovat s různými vlastnostmi, z nichž nejdůležitější je ID formuláře (detail.contactFormId).
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
if ( '979' == event.detail.contactFormId ) {
dataLayer.push({"event": "cfsent", "cftype": event.detail.contactFormId });
}
}, false );
</script>
Takže stačí, když posloucháte, co se děje na stránce a dle toho posíláte dataLayer. Tento kód je možné vložit to patičky webu, pomocí pluginu nebo funguje i tehdy, když jej spustíte přes GTM. Poslední varianta je obzvlášť výhodná, jelikož nepotřebujete vývojáře.
Pokud chcete tracovat Sklik, nejspolehlivější se mi zatím zdá využití jQuery.append a přidat na konec stránky Sklik iframe. Argumentovat je možné tím, že využívám knihovnu jQuery. Ale ta už stejně na většině webů je. Na Stackoverflow najdete i možnost, jak to udělat v čistém JavaScriptu.
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
if ( '979' == event.detail.contactFormId ) {
jQuery("body").append(''); } }, false ); </script>
Důležité je vždy využít escape speciálních znaků u iframu. Jsou na to zase webové stránky, např. Free Formatter.
Pokud náhodou nemáte na webu GTM a chtěli byste odesílat pouze do GA, můžete použít tento kód. Do štítku události přidávám cestu současné stránky. V GTM je flexibilnější toto udělat u tagu. Ještě zde testuji, jestli vůbec GA na stránce je. Podobné testování je dobré dělat i u GTM, u jQuery apod.
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
if ( '979' == event.detail.contactFormId ) {
if(ga) {var adresa = window.location.pathname; ga('send','event','Formular','odeslan', adresa); }
}
}, false );
</script>
3) Využití integrace s CF 7 před DuracellTomi
Plugin DuracellTomi GTM umí nejenom sledovat odeslání CF 7, ale i sledovat průchod uživatele kontaktním formulářem. Zbytečně ale trackuje všechny formuláře a jeho DL události jsou zbytečně podrobné. Spíš to tedy řeším cestou vlastních posluchačů.
Demo a ukázkový kontejner
Demo řešení, které jsem ukazoval při přednášce najdete na adrese webova-analytika.cz/demoshop (klidně si něco objednejte, ale dodávku nečekejte :))
Poznámka: Tento článek je shrnutí mé přednášky z Measure Camp Prague 2017. V přednášce jsem se zabýval hlavně nasazením Enhanced Ecommerce na WordPress.
Komentáře, dotazy, problémy, nápady samozřejmě pište do komentářů nebo mi napište.
