Magento:oltre la

configurazione standard di

Google AnalyticsMauro Lorenzutti

@MauroLorenzutti

• CTO at

• Sviluppatore e consulente Magento dal

2009

• TYPO3 and Magento

certified developer

Non parlerò di performance

O meglio…

Parlerò di come misurare

le permormance della 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

• Nativamente magento supporta 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.ph

tml

– 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 tag A:

– 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 review degli altri?

Verifichiamolo

• Tracciamo quante volte gli utenti cliccano

sulle tab nella 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 like e le

condivisioni su GAtemplate/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 step del 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

template\googleanalytics\ga.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/devg

uides/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