Document de marcatge
Í N D E X
1 Introducció ...3 2 Què és la marca? ...3 2.1 Codi JavaScript ... 3 2.2 Codi <NOSCRIPT> ... 4 3 On s’ha d’inserir? ...4 3.1 Secció JavaScript ... 4 3.2 Secció <NOSCRIPT> ... 44 Qui genera la marca? ...4
5 Comprovar si el marcatge és correcte ...4
6 Mesurament d’elements per defecte ...6
6.1 Elements descarregables ... 6
6.2 Enllaços externs ... 6
6.3 Vídeos ... 6
7 Convivència amb Webtrends ...6
8 Portals que ja tenen marcatge amb Google Analytics ...6
9 Canvis a la URL del web o aplicació ...7
1
Introducció
Aquest manual descriu el procediment de marcatge i el codi javascript que s’ha d’incloure a portals i llocs web de la Generalitat de Catalunya que no estan gestionats amb el gestor de continguts corporatiu GECO+.
El document està pensat per donar una visió general per a responsables de portals i proveïdors. S’exposen els criteris generals que cal seguir en el marcatge i, a continuació, s’ofereix la marca, que és única per a tots els llocs web.
2
Què és la marca?
El desplegament de la nova solució d’analítica per als diferents webs i aplicacions fora de l’àmbit GECO+ consisteix en la introducció del codi de Google Tag Manager (el que anomenem “marca”) en cadascuna de les seves pàgines, en un procés denominat marcatge.
Es tracta d’un contenidor que permet llençar un conjunt de funcions javascript amb la corresponent versió no script per a clients (navegadors) que no el tinguin activat, de manera que puguem registrar totes les visites als nostres webs. El javascript s’executa en carregar la plana.
El codi que cal incloure en cadascuna de les pàgines és el següent:
2.1
Codi JavaScript
El bloc JavaScript inclou la lògica de la part del client que llença i recull de manera automàtica informació estàndard sobre cada visualització de pàgina que es produeix, així com altres dades i esdeveniments personalitzats, per al seu enviament posterior al servidor de Google.
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-NH8MVLN');</script>
<!-- End Google Tag Manager --> <!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-NH8MVLN" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-NH8MVLN');</script>
2.2
Codi <NOSCRIPT>
També cal tenir en compte la importància de la inclusió del bloc <NOSCRIPT> en les pàgines de les quals cal fer el marcatge, per, així poder fer el seguiment del trànsit dels usuaris amb navegadors que no permetin executar codi JavaScript.
3
On s’ha d’inserir?
3.1
Secció JavaScript
Per a la recollida correcta de les dades, el codi JavaScript de Google Tag Manager s’ha d’introduir a cadascuna de les pàgines que formen part del lloc web, tan amunt de l'etiqueta <head> de la pàgina com sigui possible.
NOTA: és obligatori incloure el codi javascript en aquesta zona.
3.2
Secció <NOSCRIPT>
Per a la recollida de les dades dels usuaris amb navegadors que no permetin executar codi JavaScript de Google Tag Manager, el fragment <NOSCRIPT> s’ha d’introduir en cadascuna de les pàgines que formen part del lloc web immediatament després de l'etiqueta d'obertura <body>
4
Qui genera la marca?
Donat que la marca és única, tots els portals han de fer servir la marca inclosa en aquest document al punt 2, seguint les instruccions detallades al punt 3
A més d’introduir el codi GTM, és imprescindible que es comuniqui a l’equip d’analítica OTGencat el domini/subdomini/URL que ha estat marcat, i a quina propietat ha d’informar (o si cal crear una propietat nova).
Encara que la introducció de la marca als llocs web és l’única acció necessària per part dels departaments, l’equip d’Analítica OTGencat ha de preparar l’eina Google Tag Manager per tal de “disparar” el codi adient segons el departament, el portal i la URL corresponent. D’aquesta manera, el codi recollirà les dades específiques que es podran consultar a les propietats determinades, per al departament en concret i pels usuaris que correspongui.
5
Comprovar si el marcatge és correcte
Els responsables del web, o els proveïdors encarregats de fer el marcatge d’analítica, poden comprovar si el marcatge s’ha realitzat de forma correcta utilitzant l’eina Tag Assistant, una extensió per al navegador Chrome que es pot descarregar aquí.
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-NH8MVLN" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
Aquesta eina permet veure si el contenidor de Google Tag Manager s’està activant a la pàgina visualitzada, i si el codi de Google Analytics es troba entre els elements del contenidor i s’activa també amb la visualització de la plana.
Instruccions:
1. Descarregar i incorporar l’extensió al navegador Google Chrome. 2. Activar l’extensió “Google Tag Assistant”:
3. Visitar la pàgina en qüestió a la mateixa pestanya on s’ha activat l’extensió i, un cop la pàgina s’ha carregat, desplegar l’extensió i comprovar que surtin quatre etiquetes:
GTM-NH8MVLN – codi del contenidor (verda)*
UA-88115817-1 – codi gencat global
*Si l’etiqueta del contenidor surt blava o vermella, s’haurà de revisar la implementació, i assegurar que el codi està inserit segons les instruccions del punt 3.
Nota: podria ser necessari recarregar la pàgina perquè Tag Assistant pugui llegir el codi correctament.
6
Mesurament d’elements per defecte
El contenidor de Google Tag Manager permet agilitzar el procés de marcatge i netejar els portals de codi addicional.
Des del propi contenidor, OTGencat generarà els disparadors necessaris per tal de mesurar, per defecte, els elements descarregables, les visualitzacions de vídeos i els clics a enllaços externs.
6.1
Elements descarregables
Per defecte, es mesuraran mitjançant esdeveniments “onClick” tots els elements amb les següents extensions: xls, xlsx, doc, docx, pdf, txt, csv, zip, epub, rdf, xml, flv, ics, json, kml, kmz, odf, rss, shp, sparql, tms, wms, gpx, mp3, exe, jnlp.
6.2
Enllaços externs
Per defecte, es mesuraran mitjançant esdeveniments “onClick” tots els enllaços que dirigeixin a un web diferent a la del portal.
6.3
Vídeos
Per defecte, es mesuraran mitjançant esdeveniments “onClick” tots els vídeos visualitzats de les plataformes BIG, Youtube i Vimeo que estiguin integrats als portals.
7
Convivència amb Webtrends
El manteniment del codi de Webtrends a partir de l’1 de gener de 2018 és innocu, per tant no és necessària una actuació immediata per eliminar el codi. Tot i així, és recomanable retirar aquest fragment de codi al més aviat possible. OTGencat s’encarregarà de retirar el fragment als portals GECO+.
8
Portals que ja tenen marcatge amb Google Analytics
Els portals que ja disposen de marcatge històric amb Google Analytics, han d’integrar igualment la marca global corporativa.
9
Canvis a la URL del web o aplicació
En cas de qualsevol canvi a la URL del web o aplicació cal comunicar a l’equip d’OTGencat la modificació del domini/subdomini.
El canvi a Google Analytics amb Tag Manager suposa una variació important en el codi respecte al de Webtrends. Amb la nova eina, el codi és únic però està directament relacionat amb l’URL i la configuració de GTM. Si es modifiquen el domini o subdomini del llocs web, Google Analytics deixarà de recollir les dades.
Per tant, és imprescindible comunicar a l’equip d’OTGencat qualsevol canvi al domini o subdomini del web o aplicació perquè l’eina reculli dades.
10
Suport
Per a qualsevol qüestió relacionada amb Analítica, podeu obrir un tiquet o posar-vos en contacte amb la bústia: [email protected]
Revisió Redactat per Revisat per Aprovat per Data
aprovació
Data publicació VASS
Revisió Apartat Data Modificació Motiu del canvi
RESPONSABLE DEL DOCUMENT: