Salta ai contenuti

Costruire

Ottenere lo snippet e inserirlo nel tuo sito

Lo snippet si copia dalla piattaforma stessa, in Canali → Widget Web. Ogni agenzia ha il proprio snippet, con un identificatore unico già incluso — non serve scrivere né modificare nulla, solo copiare e incollare il blocco completo.

Il blocco ha questa forma (i valori di data-widget e data-token arrivano già compilati, identificando la tua agenzia e questa specifica istanza di Widget Web):

<script>
(function(w,d,t){
w.Widget=w.Widget||function(){(w.Widget.q=w.Widget.q||[]).push(arguments)};
var s=d.createElement(t);s.async=1;
s.src='https://widget.example.com/v1/embed.js';
s.setAttribute('data-widget','xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx');
s.setAttribute('data-locale','es');
s.setAttribute('data-token','xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx');
d.head.appendChild(s);
})(window,document,'script');
</script>

Nota — Il dominio dello script (s.src) non cambia con il marchio del tuo fornitore

A differenza del resto dell’interfaccia, il piccolo script che carica il widget viene sempre servito dall’infrastruttura del fornitore della piattaforma, così come appare nello snippet che copi — non viene personalizzato per marchio bianco in questa versione del prodotto. Puoi vedere quel dominio nel codice sorgente del tuo sito se ispezioni il tag <script>; non influisce su ciò che vede il tuo visitatore, che non raggiunge mai quell’indirizzo con il browser.

  • data-widget identifica la tua agenzia. Non condividerlo tra siti di clienti diversi né copiarlo a mano: usa sempre il pulsante «Copia» per non tagliare il valore per errore.
  • data-locale fissa la lingua dell’interfaccia della chat. Lo snippet che copi porta già scritta la lingua predefinita che hai scelto per quell’istanza in Canali → (il tuo Widget Web) → Lingua predefinita del widget (manuale dell’amministratore, capitolo «Canali») — nel caso normale non serve modificarlo a mano.
  • data-token identifica questa istanza specifica di Widget Web. Conta solo se hai più di un canale di tipo Widget Web nel tuo account (per esempio, un sito diverso per marchio o per lingua): ogni istanza ha il proprio snippet con il proprio data-token, quindi copia sempre lo snippet dell’istanza corretta dalla sua scheda in Canali — non mescolare il data-token di un’istanza con il data-widget di un’altra.

Nota — Lingue supportate e cosa succede se ne chiedi un’altra

I valori supportati sono es (spagnolo), en (inglese) e it (italiano). Se data-locale arriva con un qualsiasi altro valore, è vuoto, o non arriva, il widget si mostra in inglese — non fallisce mai né smette di caricare per una lingua non riconosciuta.

Avviso — Forzare una lingua diversa in una pagina specifica

Se il tuo sito è multilingua (per esempio, hai una versione in inglese su /en/), puoi annullare la lingua predefinita solo in quella pagina: modifica a mano il valore di s.setAttribute('data-locale', …) nello snippet incollato in quella pagina specifica, senza toccare gli altri valori. Il resto del tuo sito continua a usare la lingua predefinita configurata in Canali.

Nota — Attributo opzionale: data-api

Si applica solo se la tua installazione usa un backend proprio diverso da quello condiviso della piattaforma. Si aggiunge così: s.setAttribute('data-api','https://api.tuodominio.it/api/v1');. Nel caso normale non devi toccare questo attributo — il widget usa il backend della piattaforma per impostazione predefinita.

Lo snippet è HTML standard e funziona allo stesso modo in entrambi i punti: subito prima della chiusura di </head>, o subito prima della chiusura di </body>. Poiché lo script si carica in modo asincrono, la posizione esatta non influisce sulla velocità del tuo sito. Usa lo spazio che il tuo template o la tua piattaforma ti offre; molti gestori di contenuti permettono di toccare solo uno dei due.

Deve comparire una sola volta, in un template o layout condiviso da tutte le pagine (footer o header globale) — non incollarlo pagina per pagina.

Avviso — Percorso rapido (3 passaggi)

  1. Copia lo snippet da Canali → Widget Web. 2) Incollalo prima di </head> o </body> nel template globale del tuo sito. Con questo il widget funziona già. 3) Facoltativo (consigliato): limita su quali siti può caricarsi aggiungendo il tuo dominio in Impostazioni → Personalizzazione widget → Domini consentiti (capitolo 4).

Il blocco «Incolla questo snippet nel tuo sito» con il codice completo dello script, incluso il dominio di embed del widget e il data-token della tua istanza, e il pulsante Copia in alto
Il blocco «Incolla questo snippet nel tuo sito» con il codice completo dello script, incluso il dominio di embed del widget e il data-token della tua istanza, e il pulsante Copia in alto