Insertar el código Google Tag Manager en PrestaShop

Home Insertar el código Google Tag Manager en PrestaShop

Insertar el código Google Tag Manager en PrestaShop

Estás en:
Tiempo estimado de lectura: 2 min
In this article

Como sabes Google Tag Manager es una herramienta que te permite gestionar y medir el rendimiento de tu sitio web de forma sencilla y eficaz. Para integrarlo en tu web sin usar módulos, debes seguir estos pasos

Google Tag te indica que tienes que añadir en tu web dos códigos uno en el <head>  y otro en el <body>

 

PRIMERA PARTE DEL CODIGO GTM: Pegue este código lo más arriba posible en la sección <head> en todas y cada una de las páginas de la web. Incluso en la página de finalizar pedido.

<!-- 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','XXXXXXXXXXXX');</script>

<!-- End Google Tag Manager -->

SEGUNDA PARTE DEL CODIGO GTM: Pegue este código justo después de la etiqueta de apertura <body> en todas y cada una de las páginas de la web. Incluso en la página de finalizar pedido:

<!-- Google Tag Manager (noscript) -->

<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=XXXXXXXXXXX"

height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>

<!-- End Google Tag Manager (noscript) -->

 

Instalar Google Tag Manager (GTM) en PrestaShop 1.6

Para la primera parte de código haz lo siguiente

  • Accede al archivo header.tpl que se encuentra en la carpeta /themes/tu-tema de tu sitio web.
  • Busca la etiqueta <head> y copia la primera parte del código GTM que te proporciona Google.
  • Pega el código entre las etiquetas {literal} y {/literal} justo después de la etiqueta <head>.
{literal}
PRIMERA PARTE DEL CODIGO GTM
{/literal}

Para la segunda parte de código haz lo siguiente:

  • Busca la etiqueta <body> y copia la segunda parte del código GTM que te proporciona Google.
  • Pega el código entre las etiquetas {literal} y {/literal} justo después de la etiqueta <body>.
  • Guarda los cambios y comprueba que el código se ha insertado correctamente en tu sitio web.
{literal}
SEGUNDA PARTE DEL CODIGO GTM
{/literal}

Con estos pasos, habrás instalado Google Tag Manager en tu tienda online de PrestaShop 1.6 y podrás gestionar tus etiquetas de forma fácil y rápida.

 

Instalar Google Tag Manager (GTM) en PrestaShop 1.7

 

Te explicamos cómo localizar y modificar las etiquetas <head> y <body> en la versión 1.7 de PrestaShop, que utiliza el framework Symfony.

A diferencia de la versión 1.6, estas etiquetas no se encuentran en la misma ruta, sino que hay que buscarlas o crearlas en la carpeta /template/_partials/ del tema hijo. Por ejemplo, para editar la etiqueta <head>, hay que crear o modificar el archivo head.tpl en dicha carpeta.

{block name='head_icons'}
   
{literal}
EVENTUAL DATA LAYER DE ECOMMERCE  O PERSONALIZADO
{/literal}

{/block}
{literal}
PRIMERA PARTE DEL CODIGO GTM
{/literal}

 

Para localizar la etiqueta <body> localiza el archivo layout-both-columns.tpl en la carpeta de tu tema hijo /templates/layouts/. Aquí pegarás la segunda parte del código GTM del siguiente modo:

{block name='head'}
{include file='_partials/head.tpl'}
{/block}

{literal}
SEGUNDA PARTE DEL CODIGO GTM
{/literal}

{block name='hook_after_body_opening_tag'}
{hook h='displayAfterBodyOpeningTag'}
{/block}
Was this article helpful?
Dislike 0
Visualizaciones: 175