Magento:oltrela configurazione standard di Google Analytics
Mauro Lorenzutti

@MauroLorenzutti
•CTO at
•Sviluppatore e consulente Magento dal 2009
•TYPO3 and Magento certifieddeveloper

Non parlerò di performance

O meglio…

Parlerò di come misurarele permormancedella UX

Disclaimer
•Ci sono molti modi diversi per fare le stesse attività degli esempi seguenti
•Scopo del talk è quello di dimostrare come sfruttare GA per raccogliere informazioni, NON di mostrare tutte le sue funzionalità o possibilità

Configurare Google Analytics

System/Configuration/Google API

Codice incluso in pagina

Cosa monitora
•Pageview
•Ecommerce

Passare a Universal Analytics

Perché?
•Nuove funzionalità
–Piùdispositivi, sessioni e dati sul coinvolgimento collegati a User ID
–Nuovi metodi di raccolta dei dati che permettono di monitorare qualunque dispositivo digitale
–Utilizzo di opzioni di configurazione semplificate e più accessibili
–Creazione di dimensioni e metriche personalizzate
•Universal Analytics è il nuovo standard operativo per Google Analytics
•Upgrade sarà obbligatorio
Fonte: https://developers.google.com/analytics/devguides/collection/upgrade/index

Universal & Magento
•Nativamentemagentosupporta soltanto Google Analytics (classic)
•Per integrare Universal Analytics ci sono vari moduli nel repository:
(e molte altre ancora…)

Integrazione manuale
•Dedicato a chi piace sporcarsi le mani 
•Due file da modificare:
–app/design/frontend/base/default/template/googleanalytics/ga.phtml
–app/code/core/Mage/GoogleAnalytics/Block/Ga.php
•NB. NON, ripeto NON, si devono modificare i file del core

ga.phtml

Ga.php

Ga.php

Codice generato

Andiamo oltre!

Esempi
1.Perché i miei banner valgono!

Perché i miei banner valgono!
Ne sei sicuro? gli utenti cliccano i tuoi banner?

Tracciamo i click sui banner
•Ci sono ovviamente molti modi per tracciare i banner e per organizzare le info su GA
•Di seguito vediamo un metodo che consente all’editor dei contenuti di decidere quali banner tracciare

Lasciamo decidere l’editor
•Per tracciare un banner l’editor dei contenuti deve aggiungere gli attributi seguenti al tagA:
–class="bannerGA"
–data-banner="Label registrata su GA"

template/page/html/footer.phtml

Esempi
1.Perché i miei banner valgono!
2.Potere dell’up-sell…

Potere dell’up-sell
•Ore e ore spese a configurare i prodotti correlati o a settare regole di business affinchèvengano proposti i prodotti «più giusti»!
•Ma poi vi siete mai chiesti se qualcuno li bada???

Verifichiamolo!
•Contiamo quante volte un prodotto viene raggiunto in quanto correlato di un altro prodotto

Analizziamo il sorgente HTML

template/catalog/product/view.phtml

Esempi
1.Perché i miei banner valgono!
2.Potere dell’up-sell…
3.Ma quanto piacciono i miei prodotti!

Tante, belle review
•I miei prodotti sono stati votati e commentati da molti utenti se un utente è indeciso non può non lasciarsi convincere dagli altri utenti
•In generale è vero, però… i miei utenti leggono le reviewdegli altri?

Verifichiamolo
•Tracciamo quante volte gli utenti cliccano sulle tabnella scheda prodotto
•template/catalog/product/view.phtml

E adesso?
•Per ogni prodotto è possibile sapere quante volte sono state cliccate le varie tab
•E se scopro che nessuno clicca sulle tab?
–Se le informazioni sono importanti devo ridistribuirle

Esempi
1.Perché i miei banner valgono!
2.Potere dell’up-sell…
3.Ma quanto piacciono i miei prodotti!
4.Ansia da share…

Ansia da share…
•Quante volte abbiamo navigato pagina per pagina, prodotto per prodotto, post per post, alla ricerca delle pagine più condivise, con più like, ecc.?

Registriamo i likee le condivisioni su GA
template/catalog/product/view/sharing.phtml

Esempi
1.Perché i miei banner valgono!
2.Potere dell’up-sell…
3.Ma quanto piacciono i miei prodotti!
4.Ansia da share…
5.Chi cerca trova

Ricerche sul sito
Magento ha un suo report sulle ricerche fatte sul sito

Ma…
•Non ci dice quando sono state fatte
•Non ci dice in quali pagine l’utente esegue la ricerca
•Non ci dice se la ricerca ha portato ad una vendita

Monitoriamo le ricerche da GA
Nessuno sviluppo richiesto, basta configurare GA

Il parametro di ricerca
http://www.miosito.it/catalogsearch/result/?q=mp3

Chi cerca… trova?
•Quante ricerche vengono fatte?
•Con quali parole chiave l’utente abbandona il sito?
•Quanto si ferma l’utente sul sito dopo una ricerca?

Chi cerca… compra?
•Quali ricerche convertono maggiormente?
•Quante conversioni ci sono a seguito di una ricerca?
•Devo investire maggiormente nel motore di ricerca?

Esempi
1.Perché i miei banner valgono!
2.Potere dell’up-sell…
3.Ma quanto piacciono i miei prodotti!
4.Ansia da share…
5.Chi cerca trova
6.Persi lungo la strada del checkout

Onepage checkout
•Lo dice la parola stessa: una pagina soltanto
•Ogni stepdel checkout viene gestito via ajax
•Su GA viene registrata solo la pagina di checkout, non i vari step

13 dispersi…
•14 hanno iniziato il checkout e 1 soltanto ha acquistato
•Cosa c’è che non va nel mio checkout???
Bhoooooo……..

Tracciamo ogni step del checkout!
template/checkout/onepage.phtml

Beccato!
Si fermano tutti alle spese di spedizione 

Esempi
1.Perché i miei banner valgono!
2.Potere dell’up-sell…
3.Ma quanto piacciono i miei prodotti!
4.Ansia da share…
5.Chi cerca trova
6.Persi lungo la strada del checkout
7.Ma quanto ci vuole?!?

Io lo vedo lento…
•A chi non è mai capitato di ricevere una segnalazione come questa?
•Google Analytics mette a disposizione uno strumento per monitorare i tempi di caricamento delle pagine

templategoogleanalyticsga.phtml
•È possibile configurare GA per registrare il 100% dei tempi (di default registra l’1%)

Tempo di caricamento medio
•Fornisce statistiche anche per singole pagine, differenziate per browser e paese

E se uso AJAX ?
•È possibile monitorare anche i tempi di chiamate AJAX
•In generale è possibile monitorare la durata di qualsiasi azione mediante apposite chiamate
•Ad es. proviamo a monitorare i tempi delle chiamate AJAX del checkout

skin/frontend/base/default/js/opcheckout.js
•Per ogni step c’è una chiamata AJAX all’interno del metodo «save»
•onSuccess, onFailure e onComplete viene richiamato il metodo «nextStep»
•Per prima cosa va inizializzata la variabile startTime:

In ogni metodo «save»
•Facciamo partire il cronometro!

In ogni metodo «nextStep»
•Fermiamo il cronometro e registriamo il tempo

I tempi raccolti
•È ora possibile analizzare quanto tempo richiede ciascun step del checkout

Conclusioni

Molto altro ancora…
•Uso del compare
•Uso dei coupon di sconto
•Visualizzazione delle immagini alternative
•Cambio valuta
•Ricerca disponibilità in negozio
•Ecc
•Ecc
•Ecc
•Ecc

Reference
•Guida Google Analytics per sviluppatori:
–https://developers.google.com/analytics/devguides/collection/analyticsjs/

Tag Assistant

Attenzione!

Conclusioni
•GA fornisce un’ampia API per raccogliere informazioni
•La configurazione di default di Magento non è sufficiente
•Hai un dubbio? Non fare ipotesi: raccogli i dati e analizzali!

Nelle prossime puntate…
•A/B testing
•Google Tag Manager

Q & A

Thank you!
http://www.webformat.com
http://it.linkedin.com/in/maurolorenzutti
https://twitter.com/MauroLorenzutti
http://www.slideshare.net/webformat