Vai al contenuto

Integrazione Google Tag Manager

Aggiungi un chatbot AI con Google Tag Manager

Carica il tuo agente intoCHAT su ogni pagina con un tag HTML personalizzato, senza modificare i template del sito. Il codice qui sotto passa l'ID dell'agente in un modo che GTM non rimuove.

Crea il tuo agente gratis

Ultimo aggiornamento:

Come funziona intoCHAT con GTM

Google Tag Manager ti permette di aggiungere script al sito da un unico punto. intoCHAT funziona tramite GTM, con un dettaglio importante: GTM rimuove gli attributi data dai tag script nei tag HTML personalizzati, e lo script di intoCHAT legge l'ID dell'agente proprio da uno di questi attributi. Il codice di questa pagina aggira il problema creando l'elemento script con JavaScript, così il widget si carica con l'agente giusto. Tutto il resto, dai colori alle conoscenze, si gestisce in intoCHAT.

Installare intoCHAT con Google Tag Manager

  1. Copia l'ID dell'agente

    In intoCHAT apri la scheda Share del tuo agente. L'ID compare nella scheda WordPress Plugin ed è anche il valore di data-chatbot-id nel tag script.

  2. Crea un attivatore Pronto per DOM

    Nel contenitore GTM vai su Attivatori e clicca su Nuovo. Apri Configurazione attivatore, scegli Pronto per DOM, lascialo attivo su tutti gli eventi, dagli un nome e salva.

  3. Aggiungi un tag HTML personalizzato

    Vai su Tag e clicca su Nuovo. Apri Configurazione tag, scegli HTML personalizzato e incolla il codice qui sotto, con il tuo ID al posto di YOUR_AGENT_ID. Seleziona l'attivatore Pronto per DOM e salva.

  4. Prova in modalità anteprima

    Avvia la modalità anteprima di GTM, apri il sito nella finestra collegata e controlla che il tag sia stato attivato e che la bolla della chat compaia nell'angolo in basso.

  5. Invia e pubblica

    Invia le modifiche e pubblica il contenitore. La bolla della chat ora si carica su ogni pagina in cui gira il tuo contenitore GTM.

Il tag HTML personalizzato

<script>
  (function () {
    if (document.getElementById('intochat-embed')) return;
    var s = document.createElement('script');
    s.id = 'intochat-embed';
    s.src = 'https://www.intochat.ai/api/embed.js';
    s.setAttribute('data-chatbot-id', 'YOUR_AGENT_ID');
    document.body.appendChild(s);
  })();
</script>

Non incollare in GTM il semplice tag script della scheda Share, perché GTM ne rimuove l'attributo data-chatbot-id. Questa versione imposta l'attributo con JavaScript e non carica nulla se il widget è già nella pagina.

Cosa fa l'agente su un sito gestito con GTM

  • Si installa senza rilasciare codice

    Se sul sito gira già un contenitore GTM, puoi aggiungere, provare e rimuovere l'agente da GTM senza toccare i template del sito.

  • Impara dal tuo sito

    Incolla l'indirizzo del sito e intoCHAT trova fino a 500 pagine tramite sitemap e link, esegue il rendering delle pagine basate su JavaScript e ti lascia scegliere cosa includere.

  • Raccoglie lead

    Un modulo nella chat chiede email o numero di telefono secondo le regole che imposti. I lead ti arrivano via email e puoi esportarli in CSV.

  • Esegue azioni sulla tua pagina

    Le azioni lato client chiamano funzioni JavaScript che registri sulla tua pagina, e le azioni API personalizzate permettono all'agente di chiamare la tua API HTTP durante la chat.

  • Rispecchia il tuo brand

    Imposta colori, avatar, icona del pulsante, testo del suggerimento e posizione in intoCHAT. Le modifiche valgono senza toccare il tag GTM.

  • Mostra cosa chiedono i visitatori

    Leggi ogni conversazione con ricerca e filtri per data, e segui conversazioni, messaggi e lead nella dashboard.

Domande frequenti

Posso incollare in Google Tag Manager il normale tag script di intoCHAT?

No. GTM rimuove gli attributi personalizzati come data-chatbot-id dagli elementi script nei tag HTML personalizzati, quindi il widget non saprebbe quale agente mostrare e la bolla non comparirebbe. Il codice di questa pagina crea l'elemento script con JavaScript e imposta l'attributo da sé, e questo GTM non lo tocca.

Quale attivatore GTM devo usare per intoCHAT?

Usa un attivatore Pronto per DOM. Il widget aggiunge la bolla al body della pagina appena parte, e Pronto per DOM si attiva quando il browser ha finito di costruire la pagina, quindi il body c'è sempre. Per mostrare la chat solo su alcune pagine, imposta l'attivatore su alcuni eventi e aggiungi una condizione come Page Path inizia con /support.

Caricare intoCHAT con GTM rallenta il sito?

La pagina non lo aspetta. GTM carica il contenitore in modo asincrono, e un elemento script aggiunto con JavaScript non blocca il rendering. La finestra della chat gira poi in un proprio iframe servito da intoCHAT, separata dal codice del sito.

In una single-page app la bolla della chat compare due volte?

No. Il codice controlla se il suo elemento script esiste già prima di aggiungerlo, quindi se il tag si riattiva sulla stessa pagina, ad esempio con un attivatore di modifica della cronologia, non viene aggiunto nulla. Una volta caricata, la bolla resta fino al successivo caricamento completo della pagina, quindi le condizioni decidono solo dove compare la prima volta.

Devo aggiornare il tag GTM quando modifico l'agente?

No. Il tag contiene solo l'ID dell'agente. Colori, posizione, messaggio di benvenuto, domande suggerite e conoscenze vengono caricati da intoCHAT a ogni apertura di pagina, quindi non serve pubblicare una nuova versione GTM.

Il mio sito ha una Content Security Policy. Cosa devo consentire?

Consenti www.intochat.ai per script, connessioni e frame. Il widget carica lo script da lì, recupera le impostazioni dallo stesso dominio e apre la chat in un iframe servito da intoCHAT.

Guardalo rispondere dal tuo sito

Incolla l’indirizzo del tuo sito e chatta con un agente creato dalle tue pagine. Ci vuole circa un minuto.

Crea il tuo agente gratis

Piano gratuito, nessuna carta di credito.