Il widget Chat del sito Web consente ai visitatori del sito Web di contattarti tramite chat dal vivo o tramite altri canali di messaggistica a cui ti sei connesso.

Collegamento di un widget di chat del sito Web

Guarda il video qui sotto per una guida dettagliata su come collegare la chat del sito Web a respond.io.

How to Connect Website Chat to respond.io

Passaggio 1: Vai a Impostazioni > Canali

Passaggio 2: Fai clic su Aggiungi canale > Chat del sito web > Connetti

Passaggio 3: Inserisci il/i sito/i web in cui verrà aggiunto il widget.

Di seguito vengono fornite informazioni su come inserire i siti web nella whitelist.

Se l'utente aggiungehttps://app.respond.io, solohttps://app.respond.ioverranno inseriti nella whitelist. Qualsiasi altro sottodominio o root non dovrebbe funzionare.
Se l'utente aggiungehttps://*.respond.io, tutti i sottodomini, incluso il dominio radice, verranno inseriti nella whitelist.
Se l'utente aggiungehttps://respond.io, solo il dominio radice verrà inserito nella whitelist.

Passaggio 4:Seleziona un colore tema per il widget utilizzando il selettore colori interattivo.

Scegli un colore che corrisponda al colore del tuo marchio e al tuo sito web.

Passaggio 5:Seleziona un'icona da mostrare sul sito web per il widget. Se preferisci caricare un'icona personalizzata, puoi caricare un'icona quadrata con una dimensione consigliata di 256px x 256px.

Una volta connessi, i widget possono essere ulteriormente personalizzati.

Passaggio 6: Fai clic suAvanti> Aggiungi lo script al tuo sito web preferito. In alternativa, puoi inviare le istruzioni di installazione a qualcun altro tramite e-mail.

Installazione del widget di chat

Potrebbe essere necessario l'aiuto di un webmaster o di un amministratore tecnico per installare il widget della chat sul sito web. Se necessario, chiedi assistenza.

A seconda del sistema che utilizzi per creare e gestire il tuo sito web, abbiamo creato una guida dettagliata per aiutarti a installare un widget di chat sul tuo sito web.

Per altre piattaforme o servizi, vai al codice HTML della pagina. Incolla lo script prima del tag </body> .

<body>
...
...
...
<Paste Script Here>
</body>

Se hai bisogno di assistenza, puoi scegliere di inoltrare lo script insieme alle istruzioni di installazione all'amministratore del tuo sito web. Seleziona la casella di controllo corrispondente e inserisci l'indirizzo email di qualcuno che può aiutarti a installare il plugin della chat.

Il widget della chat del sito web respond.io apparirà sul tuo sito una volta che lo script sarà stato installato correttamente.

Personalizzazione del widget della chat

Passaggio 1:Nella tua area di lavoro, vai aImpostazioni>Canale

Passaggio 2: Individua il canale chat del sito web > fai clic su Personalizza

Personalizza il widget del sito web in modo che corrisponda all'aspetto del sito web', in modo che il widget risulti uniforme. Sul lato destro della pagina è presente un'anteprima del widget della chat del sito web. Ogni personalizzazione apportata al widget verrà riflessa sul widget stesso, per aiutarti a farti un'idea migliore di ciò che stai personalizzando.

Visualizza & Aspetto

È possibile personalizzare quanto segue per modificare l'aspetto del widget visualizzato sul sito web.

Campo	Descrizione
Colore del tema	Il colore scelto verrà utilizzato come colore primario del tuo widget.
Colore del testo	Il colore scelto verrà utilizzato come colore primario del testo del tuo widget.
Icona della chat del sito Web	L'icona selezionata viene utilizzata all'interno della bolla del widget insieme al colore del tema. Se necessario, puoi caricare un'icona personalizzata.
Messaggio popup	Il messaggio popup viene mostrato ai visitatori del sito web una volta al giorno, 5 secondi dopo il caricamento della pagina. Se non definito, ai visitatori del sito web non verrà visualizzato alcun messaggio popup.

Convalida per l'icona della chat del sito web:

Dimensione massima del file: 1 MB
Dimensione massima del file: 256 x 256 px
Forma: quadrata

Posizione

Campo	Descrizione
Allinea a	Gli utenti possono scegliere di specificare una posizione per visualizzare il widget a sinistra o a destra della piattaforma.
Spaziatura verticale	Gli utenti possono specificare la quantità di spaziatura verticale tra il widget della chat del sito web e la parte inferiore dello schermo.
Spaziatura orizzontale	Gli utenti possono specificare la quantità di spaziatura orizzontale tra il widget della chat del sito web e il lato dello schermo.
Dimensione del widget	Gli utenti possono scegliere la dimensione del widget tra Piccola, Standard o Grande.
Opzioni di visualizzazione	Gli utenti possono scegliere di visualizzare questo widget sul desktop, sui dispositivi mobili o su entrambi.

Elementi dell'intestazione

Campo	Descrizione
Titolo	Il titolo verrà visualizzato nella parte superiore del widget della chat.
Slogan	Lo slogan verrà visualizzato sotto il titolo.
Logo della chat del sito web	Trascina qui l'immagine del tuo logo in modo che venga visualizzata nella parte superiore della chat del sito web. Il formato può essere PNG, SVG o JPG e la dimensione del file non deve superare i 4,0 MB.
Icone del canale	Questa opzione consentirà ai Contatti di contattarti tramite il loro Canale preferito, a condizione che vengano fornite le opzioni necessarie. Puoi aggiungere fino a sei canali, che verranno mostrati nella parte superiore del widget della chat del sito web.
Colore delle icone del canale	Le icone dei canali possono essere visualizzate in bianco o a colori sul widget della chat. Seleziona Bianco o Colorato per abbinare il colore del tema del tuo widget di chat.

Validazione per il logo della chat del sito web:

Dimensione massima del file: 4 MB
Dimensione massima del file: 1024 x 1024 px
Forma: quadrata

Icone del canale

Se il widget Chat del sito Web non è mai stato configurato prima, i canali connessi con informazioni adeguate verranno elencati per impostazione predefinita come link ai canali widget.

È possibile aggiungere i collegamenti al widget Canale e specificare le informazioni necessarie per il Canale selezionato.

Ecco l'elenco dei campi di input richiesti per ciascuno dei collegamenti canale supportati.

Link del canale	Campo di input obbligatorio
WhatsApp	Numero di telefono WhatsApp
Facebook Messenger	ID della pagina Facebook
Telegramma	Nome del bot di Telegram
Cinguettio	ID Twitter
LINEA	ID LINEA
Viber	Nome dell'account pubblico Viber
sms	Numero di telefono SMS
E-mail	Indirizzo e-mail
Telefonata	Numero di telefono
Collegamento personalizzato	Indirizzo URL e icona
QR personalizzato	Immagine e icona QR

Convalida per l'icona del canale:

Dimensione massima del file: 1 MB
Dimensione massima del file: 256 x 256 px
Forma: quadrata

Modulo pre-chat

Abilitando questa opzione verrà aggiunto un modulo di pre-chat alla chat del tuo sito web. Se abilitata, ai visitatori del tuo sito web verrà presentato un modulo da compilare prima di avviare la chat.

Abilitando questa opzione, puoi includere campi personalizzati aggiuntivi quando necessario. Oltre a ciò, puoi anche personalizzare l'etichetta dei campi predefiniti in base al modo in cui vengono visualizzati nei tuoi Contatti.

Le etichette dei campi possono essere personalizzate in una lingua diversa per adattarsi alla lingua del sito web.

Impostazioni aggiuntive

Campo	Descrizione
Testo della barra di input	Questo testo fungerà da segnaposto nell'area di digitazione.
Carattere del testo	Il font che verrà utilizzato per visualizzare il font nel widget della chat del sito web.

Limita gli allegati in arrivo

Se questa opzione è selezionata, il visitatore del sito web non avrà la possibilità di allegare un allegato nel widget della chat del sito web.

Mantieni nascosta la chat del sito web

Utilizzando questa opzione il widget sarà completamente nascosto. Finché non si clicca sul riferimento di ancoraggio o quando la chat viene aperta tramite l'API programmatica.

#widget_webchat

Utilizzando l'ancoraggio sopra puoi creare un pulsante sulla tua pagina, per aprire il widget una volta cliccato.

Nascondi il marchio Respond.io

Utilizzando questa opzione puoi rimuovere il marchio respond.io dal tuo widget.

Configurazione del canale

Passaggio 1: Fai clic su Impostazioni > Canali

Passaggio 2: Individua la chat del sito web > fai clic su Gestisci

Passaggio 3: Nella pagina di configurazione della chat del sito web vedrai le seguenti configurazioni:

Link chat - Il link URL che consente al tuo contatto di raggiungere il tuo canale.
Nome canale - Il nome del canale può essere modificato e viene utilizzato internamente per identificare il canale.
Domini di siti web - Siti web collegati al tuo widget.
Codice chat del sito web - Il codice che puoi incollare nel codice sorgente HTML del tuo sito web se hai bisogno di recuperare il frammento di codice generato.

Se non includi il tuo sito web in questo elenco, il tuo widget non verrà caricato. Puoi aggiungere più URL se'stai utilizzando il plugin su più siti web.

Passaggio 4: Fai clic su Salva modifiche per aggiornare la pagina di configurazione della chat del sito web

Identificazione degli utenti registrati

Gli utenti registrati al tuo sito web possono essere identificati aggiungendo un semplice codice JavaScript al codice del tuo sito web. Una volta che l'identificatore passato viene abbinato a un contatto esistente, la conversazione in corso verrà ripresa.

Il termine "utente" viene utilizzato nel contesto del tuo sito web. Sulla piattaforma respond.io continuiamo a chiamarli "Contatti".

window.__respond_settings = {
  identificativo: "cliente@example.com",
  nome: "Jane",
  cognome: "Doe",
  telefono: "60123456789",
  email: "cliente@example.com",
  immagine del profilo: "https://static.independent.co.uk/s3fs-public/thumbnails/image/2015/07/08/14/pic.jpg",
  countryCode: "MY",
  language: "en",
  // Campi personalizzati
  custom_fields: {
    // slug dei campi personalizzati
    number: 123,
    description: "del testo",
  },
};

Guida su come utilizzare il codice

Modifica il codice (riportato di seguito) per inviare a respond.io l'identificativo dell'utente attualmente connesso. Può trattarsi dell'indirizzo email, dell'ID contatto o di qualsiasi altro campo Contatto. Si prega di notare che un identificatore è un campo obbligatorio.
Incolla il codice direttamente nel tag head di ogni pagina in cui vuoi che appaia la chat del sito web.
- Lo script per l'identificazione degli utenti registrati deve essere posizionato sopra il codice della chat del sito web, reperibile nella finestra di dialogo di configurazione della chat del sito web.
Puoi anche inviare a respond.io i campi Contatti associati ai tuoi Contatti, in modo che memorizzeremo il campo Contatto durante il processo di creazione del Contatto. Il nome del campo (o slug) si trova nel modulo Campi contatto.
Tieni presente che se utilizzi questa funzione, il modulo pre-chat verrà ignorato, il che significa che i Contatti non dovranno inserire le proprie informazioni prima di avviare una conversazione.

Nell'esempio sopra riportato viene passato un indirizzo email come identificatore e durante il processo di creazione del contatto, tutti i campi del contatto passati verranno memorizzati.

Controllo programmatico (API per gli utenti)

Il widget della chat del sito web può essere aperto e chiuso tramite il codice JavaScript del sito web. Ciò ti consente di creare un pulsante "Chatta con noi" personalizzato sul tuo sito web e di attivare l'apertura del widget della chat del sito web quando un visitatore fa clic sul pulsante.

Azioni

Apri la chat
1. Descrizione: Apre il widget della chat.
2. Sintassi: $respond.do("chat:open")
Chiudi la chat
1. Descrizione: Chiude il widget della chat.
2. Sintassi: $respond.do("chat:close")

Ascoltatori di eventi

La chatbox è stata aperta
1. Descrizione: Gestisce l'evento di apertura del widget della chat (attiva la funzione di callback ).
2. Sintassi:$respond.on("chat:opened", callback)
La chatbox è stata chiusa
1. Descrizione: Gestisce l'evento di chiusura del widget chat (attiva la funzione di callback ).
2. Sintassi:$respond.on("chat:closed", callback)

Metodi di controllo dello stato

La chat è aperta?
1. Descrizione: Restituisce true se il widget della chat è aperto, altrimenti false.
2. Sintassi: $respond.is("chat:open")
La chat è chiusa?
1. Descrizione: Restituisce true se il widget della chat è chiuso, altrimenti false.
2. Sintassi: $respond.is("chat:closed")

FAQ e risoluzione dei problemi

Perché i miei messaggi non vengono recapitati ai Contatti?

Potrebbero esserci diversi motivi per cui i messaggi non vengono recapitati:

Il contatto ha abbandonato il sito web.
L'inattività del contatto potrebbe superare il periodo di timeout.
Il cliente del contatto potrebbe avere problemi di connessione a Internet.

Perché il mio widget non viene visualizzato sul mio sito web?

Assicurati che il codice sia installato correttamente. Fare riferimento alle istruzioni qui su come installare il widget della chat del sito web.
Assicuratevi di aggiungere alla whitelist il sito web in cui desiderate installare il widget. Fai riferimento al passaggio 3 di Collegamento del widget della chat del sito web per informazioni su come aggiungere il tuo dominio alla whitelist.

Avvio rapido del widget della chat del sito Web.