es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

“Nuxt añade GTM (noscript) a la etiqueta body en cada página/ruta.”

15 Jun, 2023 Programación

Estoy intentando implementar Google Tag Manager en una aplicación Nuxt y me he quedado atascado en cómo agregar la etiqueta noscript a la aplicación en cada página / ruta dentro de la etiqueta de apertura del body. Intenté crear un script estático y agregar el archivo a través de la configuración de Nuxt:

{ src: " /scripts/gtm.js ", cuerpo: verdadero }

que agregó el archivo al cuerpo pero arrojó errores debido a la etiqueta noscript y al iframe anidado de gtm. No estoy seguro si hay una mejor manera de inyectar el script real directamente dentro del cuerpo.

<!-- Google Tag Manager (noscript) -->
<noscript><iframe
src="https://www.googletagmanager.com/ns.html?id=GT
M-4BXKY65"
height="0" width="0"
style="display:none;visibility:hidden"></iframe></n
oscript>
<!-- End Google Tag Manager (noscript) -->
Tags:  , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para agregar la etiqueta noscript de Google Tag Manager en cada página / ruta dentro de la etiqueta de apertura de body de una aplicación Nuxt, se puede usar el componente nuxt-head.

    Comience creando un archivo llamado head.js en el directorio layouts de su aplicación Nuxt. En este archivo, agregue el siguiente código:

    export default {
  head: {
    noscript: [
      {
        hid: 'gtm-noscript',
        innerHTML: `
          <iframe src="https://www.googletagmanager.com/ns.html?id=GTM-4BXKY65" height="0" width="0" style="display:none;visibility:hidden"></iframe>
        `,
      },
    ],
  },
}

    Esto agregará la etiqueta noscript necesaria dentro de la etiqueta de apertura de body en cada página / ruta en su aplicación Nuxt.

    Luego, en su archivo nuxt.config.js, importe el componente head y agréguelo a su diseño:

    import head from './layouts/head.js'

export default {
  layout: 'default',
  head,
}

    Asegúrese de reemplazar default con el nombre del diseño al que desea agregar la etiqueta noscript.

    Finalmente, en su cuenta de Google Tag Manager, asegúrese de configurar una etiqueta noscript con el ID correspondiente (GTM-4BXKY65 en este ejemplo).

    Con estos cambios, la etiqueta noscript de Google Tag Manager ahora debería agregarse a cada página / ruta en su aplicación Nuxt.

Comments are closed.