Añadir botón de llamada con Tag Manager

28 de agosto de 2018

Hace poco que uso Google Tag Manager y todavía no he sabido sacarle demasiado partido. Aún así, veo que tiene grandes posibilidades, y cada día más.

Sé que existen otras herramientas semejantes, pero no las he usado nunca.

Hace unos día descubrí la aplicación de las etiquetas HTML y hoy se me ocurrió usarlas para insertar un Call-To-Action en algunas páginas en las que un formulario de contacto, no era suficientemente cómodo para que los visitantes quisiesen  conocernos.

Voy a dar por hecho que ya tenemos GTM configurado correctamente en nuestro sitio.

Añadimos una nueva etiqueta “CTA-llamada” de tipo “etiqueta HTML” en donde añadimos el siguiente código.

<script type="text/javascript">
  window.onload = function() { 
    var tel = document.createElement('span');
    tel.setAttribute('id', 'tel-cta');
    document.body.appendChild('tel');
    document.getElementById('tel-cta')
       .innerHTML = '<a href="tel:XXXXXXXXX">XXX XXX XXX</a>'; 
  };
</script>Lenguaje del código: HTML, XML (xml)

Guardamos y configuramos como disparador ‘página vista’ o en todas, o en las que nos interese.

Probamos que todo está correcto con la vista previa del contenedor y, si es así, publicamos la versión.

Nos quedará ahora, maquetar el botón para que aparezca y se comporte como nos apetezca. En mi caso, lo dejé fijo, al fondo de la pantalla de modo que sea accesible, bastante seguro en cuanto a pulsaciones por error, y no estorba a la navegación.