Paso 6: Configura el Google Tag Manager

Para realizar la configuración del Google Tag Manager es necesario contar con una cuenta de Google con acceso al Google Tag Manager del sitio VTEX que se está configurando.

1. Hacer login en Google Tag Manager para la tienda que vamos a configurar. Ingresar al apartado etiquetas (tags) para configurar el device fingerprint id:

2. Crearemos un TAG para un producto de HTML Personalizado dando clic en el menú izquierdo ETIQUETAS como se en la siguiente imagen:

3. En el campo de Configuración de la etiqueta agregaremos el tipo de etiqueta:

4. En el campo *Personalizado > HTML de la configuración debemos pegar el código HTML que realiza el llamado al código que realiza:

5. Nota: En el llamado a la función debe ingresar la llave pública que se proporcionó previamente en la pantalla de administración de Conekta:

6. A continuación, se muestra el código HTML que se debe ingresar durante la configuración de la etiqueta dentro de Google Tag Manager.

<script type="text/javascript" src="https://cdn.conekta.io/js/latest/conekta.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
      
      document.getElementsByClassName("pg-oxxo").item(0).getElementsByTagName('span').item(0).textContent='Conekta - OXXO Pay';
      
      document.getElementsByClassName("pg-3ds").item(0).getElementsByTagName('span').item(0).textContent='Tarjeta de crédito y débito';
      
      
		vtexjs.checkout.getOrderForm().done(function(orderForm){
            Conekta.setPublicKey('Key_LlavePUBLICO123456789');
  			var sessionId = Conekta._helpers.getSessionId();
			window.vtex.deviceFingerprint = sessionId;
          	console.log('Conekta Device Fingerprint', window.vtex.deviceFingerprint);
		});
	});
</script>

7. Recuerda que deberás configurar el momento en que se dispara la etiqueta:

8. IMPORTANTE: Para activarlo y dejar el google tag manager conectado a tu tienda VTEX, debes de colocar el Google Tag Manager ID/ Name que se vio visible al terminar la creación del Google Tag Manager: En este caso es GMT-6-MEXICO.

9. Para conectarlo, debes de ir al menú izquierdo CHECKOUT > Click en el engrane del checkout, normalmente es Default > Después abrir el menu CHECKOUT:

10. Coloca el Google Tag Manager ID

11. Dar clic en guardar.