Google Tag Manager W3C-konform integrieren

Veröffentlicht von itabs 28. April 2014 0 Kommentare 1337 Mal angesehen

Wenn man in seinem Online-Shop Google Analytics, AdWords Conversion-Tracking oder AdWords Remarketing nutzt stellt man relativ schnell fest, dass man eine Vielzahl an Tracking-Codes und Snippets an den unterschiedlichsten Stellen integrieren muss.

Da hierfür immer Anpassungen an der Online-Shop Software (Template / Logik) notwendig sind und man diese möglichst vermeiden möchte, stellt Google mit dem Tag Manager ein interessantes Tool zur Verfügung. Denn bei der Nutzung des Google Tag Manager wird letztendlich nur ein Code auf allen Seiten integriert, die eigentliche Integration der Dienste wie Analytics und AdWords erfolgt anschließend über die Oberfläche des Tag Managers und erfordert keinen weiteren technischen Eingriff.

Leider ist der zu integrierende Code aber nicht W3C-konform wie im folgenden Code-Beispiel zu sehen ist:

<!– Google Tag Manager –>
<noscript><iframe src=“//www.googletagmanager.com/ns.html?id=GTM-XYZ“
height=“0″ width=“0″ style=“display:none;visibility:hidden“></iframe></noscript>
<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=
‚//www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,’script‘,’dataLayer‘,’GTM-XYZ‘);</script>
<!– End Google Tag Manager –>

Wer also seine Seite bzw. Online-Shop regelmäßig durch den W3C Validator schickt, wird nach der Integration enttäuscht werden, da eine Vielzahl an Fehlern gemeldet werden. Eine W3C-konforme Integration ist aber kein Problem, letztendlich muss man nur anstelle des oben aufgeführten Code folgenden Integrationscode in den Online-Shop einfügen.

<!– Google Tag Manager –>
<noscript>
<div>
<object data=“//www.googletagmanager.com/ns.html?id=GTM-XYZ“ height=“0″ width=“0″ style=“height:0;width:0;display:none;visibility:hidden“></object>
</div>
</noscript>

<script type=“text/javascript“>
/* <![CDATA[ */
(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=
‚//www.googletagmanager.com/gtm.js?id=’+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,’script‘,’dataLayer‘,’GTM-XYZ‘);
/* ]]> */
</script>
<!– End Google Tag Manager –>

Anschließend klappt es dann auch mit dem W3C-Validator :-)!

Schreiben Sie einen Kommentar.

  • Onlineshop Erstellung

    Das kann so auf keinen Fall pauschal beantworten. …

  • Dominik Karch

    Ich finde die Frage was ein Onlineshop kostet wirk …

  • Alexander Steireif

    Die Kosten hängen letztendlich von der gewählten …

  • Pierre

    Cool mal wieder was neues, wie sind da die Kosten? …

  • Bernd

    Hallo ich würde wissen was ich bei Uses per Coupo …