Guide: Sådan tilføjer du Google Tag Manager i PrestaShop 1.7

I PrestaShop 1.7 er arkitekturen anderledes i temafilerne, hvor <head> og <body> teknisk set ligger i flere filer, modsat PrestaShop 1.6, hvor der i header.tpl både er inkluderet <head> og <body> tag. Det betyder også at indsættelse af et tag som Google Tag Manager skal indsættes anderledes i PrestaShop 1.7 end det skal i Prestashop 1.6.

I denne guide gennemgår vi step-by-step, hvordan du tilføjer Google Tag Manager i PrestaShop 1.7. Inden vi kigger på guiden, er der en vigtig ting du bør vide om tags i PrestaShop. PrestaShop er bl.a. bygget i smarty, hvilket betyder at javascripts skal klamperes i et tag der hedder {literal}. Derfor er det vigtigt at alle javascript tags hvor der indgår “<script” altid skal klamperes med {literal} {/literal}.

Når du skal implementere Google Tag Manager får du to tags. Et tag i <head> og et tag i <body>. I tilfældet med Google Tag Manager er det kun <head> tagget som skal klamperes med {literal}.

1. Når du skal implementere Google Tag Manager får du to tags. Det tag som skal indsættes i din header <head> ser sådan ud:

{literal}
<!-- 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-XXXXXXX');</script>
<!-- End Google Tag Manager -->
{/literal}

Dette tag skal indsættes i din head.tpl temafil, som du finder her: /themes/dit-tema/templates/_partials/head.tpl Google anbefaler at du indsætter koden så højt oppe i filen som overhovedet muligt, men i princippet kan du indsætte det et vilkårligt sted. Du kan f.eks. tilføje tagget på linje 31 lige før linjen {block name='head_seo'}

Som det ses på billedet, er koden sat ind mellem {literal}-tags.

2. Den anden kode du får af Google, er den kode som skal indsættes i din <body>. Koden ser således ud:

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Denne kode er ikke et script, men blot en iframe. Derfor skal koden ikke sættes ind mellem {literal}-tags.

Koden kan indsættes flere steder, det skal blot være en fil som indeholder et body tag. Den fil vi plejer at tilføje det i, er i layout-both-columns.tpl som ligger i din temafil her: /themes/transformer/templates/layouts/layout-both-columns.tpl.

I filen kan du tilføje koden efter <body> tagget som det første, f.eks. på linje 18 efter det første {/block} tag (linjenumrene afhænger af dit tema):

3. Når du har tilføjet de to tags, og gemt filerne på din FTP, så skal du evt. slette din cache for at ændringerne træder i kraft. Du kan slette PrestaShop cachen i dit PrestaShop administrationspanel under menuen: Avancerede funktioner > Ydelser. Heraf trykker du på knappen “Ryd cache” øverst til højre.