Il Widget Chat del sito web consente ai visitatori del sito web di contattarti tramite chat dal vivo o tramite altri Canali di messaggistica che hai connesso.
Guarda il video qui sotto per una guida passo-passo su Come collegare la chat del sito web per respond.io.
Step 1: Vai a Impostazioni > Canali
Step 2: Click Add Channel > Website Chat > Connect
Passo 3: Compila il sito web in cui verrà aggiunto il widget.
Fare riferimento a quanto segue su come siti web possono essere whitelisted.
Se l'utente aggiungehttps://app.respond.ioallora solohttps://app.respond.iosarà whitelisted. Qualsiasi altro sottodominio o root non dovrebbe funzionare.
Se l'utente aggiungehttps://*.respond.io, tutti i sottodomini, compreso il dominio root, saranno whitelisted.
Se l'utente aggiungehttps://respond.io, allora solo il dominio radice sarà whitelisted.
Passo 4:Seleziona un colore del tema per il widget usando il selettore interattivo del colore.
Scegli un colore che corrisponde al tuo marchio colore e sito web.
Passo 5:Selezionare un'icona per il Widget da mostrare sul sito web. Se preferisci caricare un'icona personalizzata, puoi caricare un'icona quadrata con una dimensione consigliata di 256px x 256px.
I widget possono essere ulteriormente personalizzati una volta connessi.
Step 6: CliccaNext> Aggiungi script al tuo sito preferito. In alternativa, è possibile inviare le istruzioni di installazione a qualcun altro via e-mail.
Si può richiedere un webmaster o amministratore tecnico per assistere nell'installazione del widget chat sul sito web. Si prega di chiedere assistenza, se necessario.
A seconda del sistema utilizzato per creare e gestire il tuo sito web, abbiamo creato una guida passo-passo per passeggiare attraverso l'installazione di un widget di chat sul tuo sito web.
Per altre piattaforme o servizi, vai al sorgente 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. Selezionare la rispettiva casella di controllo e inserire l'indirizzo email di qualcuno che può aiutare a installare il plugin di chat.
Il Widget di Chat del sito web respond.io apparirà sul tuo sito una volta che lo script è stato installato correttamente.
Step 1:Nel tuo Workspace, vai aImpostazioni>Channel
Passo 2: Individuare il Sito Web Chat Channel > fare clic su Personalizzare
Personalizza il widget del sito web per abbinare l'aspetto's del sito web in modo che il widget apparirà senza soluzione di continuità. Sul lato destro della pagina, c'è un'anteprima del widget chat del sito web. Qualsiasi personalizzazione fatta per il widget rifletterà sul widget per aiutarti a ottenere una migliore idea di ciò che stai personalizzando.
È possibile personalizzare quanto segue per modificare l'aspetto di visualizzazione del widget sul sito web.
Campo | Descrizione |
|---|---|
Colore Tema | Il colore scelto sarà usato come colore principale del tuo widget. |
Colore Del Testo | Il colore scelto sarà usato come colore del testo principale del tuo widget. |
Icona Chat Sito | L'icona selezionata viene usata all'interno della bolla del widget insieme al Colore del tema. Se necessario, puoi caricare un'icona personalizzata. |
Messaggio A Comparsa | Il messaggio popup viene mostrato ai visitatori del sito una volta al giorno 5 secondi dopo il caricamento della pagina. Se non definito, nessun messaggio popup apparirà ai visitatori del sito. |
Convalida per l'icona della chat del sito:
Dimensione massima del file: 1MB
Dimensione massima del file: 256 x 256 px
Forma: Quadrato
Campo | Descrizione |
|---|---|
Allinea A | Gli utenti possono scegliere di specificare una posizione se visualizzare il widget a sinistra o a destra della piattaforma. |
Spaziatura Verticale | Gli utenti possono specificare la quantità di spaziatura verticale tra il widget di chat del sito web e la parte inferiore dello schermo. |
Spaziatura Orizzontale | Gli utenti possono specificare la quantità di spaziatura orizzontale tra il widget di chat del sito web e il lato dello schermo. |
Dimensione Widget | Gli utenti possono scegliere la dimensione del widget da piccolo, standard o grande. |
Opzioni Di Visualizzazione | Gli utenti possono scegliere di visualizzare questo widget sul desktop, dispositivi mobili o entrambi. |
Campo | Descrizione |
|---|---|
Titolo | Il titolo verrà mostrato nella parte superiore del widget chat. |
Tagline | La Tagline verrà visualizzata sotto il titolo. |
Logo Chat Sito | Trascina qui la tua immagine del logo in modo che mostri nella parte superiore della chat del sito web. Il formato può essere in PNG, SVG o JPG e la dimensione del file non è superiore a 4.0 MB. |
Icone Canale | Questa opzione permetterà ai contatti di contattarti attraverso il canale preferito fornendo le opzioni. È possibile aggiungere fino a sei canali e sarà mostrato nella parte superiore del sito Chat Widget. |
Colore Icone Canale | Le icone dei canali possono essere visualizzate in forma bianca o colorata sul widget della chat. Selezionare Bianco o Colorato per andare con il Colore del tema del widget chat. |
Convalida per il logo della chat del sito:
Dimensione massima del file: 4MB
Dimensione massima del file: 1024 x 1024 px
Forma: Quadrato
Se il Widget Chat del sito web non è mai stato configurato prima, i Canali connessi con informazioni adeguate saranno elencati come collegamenti di canale widget.
È possibile aggiungere i collegamenti del canale widget e specificare le informazioni necessarie per il canale selezionato.
Ecco l'elenco di Campo di Input richiesto per ciascuno dei Link di Canale supportati.
Collegamenti Ai Canali | Campo Di Input Richiesto |
|---|---|
Numero Di Telefono WhatsApp | |
Facebook Messenger | Id Pagina Facebook |
Telegram | Nome Telegram Bot |
Twitter ID | |
LINE | ID LINEA |
Viber | Nome Account Pubblico Viber |
SMS | Numero Di Telefono SMS |
Indirizzo Email | |
Chiamata Telefonica | Numero Di Telefono |
Link Personalizzato | Indirizzo URL e icona |
Custom QR | Immagine QR e icona |
Convalida per l'icona del canale:
Dimensione massima del file: 1MB
Dimensione massima del file: 256 x 256 px
Forma: Quadrato
Abilitando questa opzione verrà aggiunto un modulo di pre-chat alla chat del tuo sito Web. Se abilitato, i visitatori del tuo sito web saranno presentati con un modulo da compilare prima di iniziare la chat.
Con questa opzione abilitata, è possibile includere ulteriori campi personalizzati quando necessario. In aggiunta a ciò, è anche possibile personalizzare l'etichetta per i campi predefiniti su come appaiono ai tuoi contatti.
Le etichette del campo possono essere personalizzate in una lingua diversa per corrispondere al sito web's lingua.
Campo | Descrizione |
|---|---|
Input Bar Text | Questo testo funzionerà come segnaposto nell'area di digitazione. |
Text Font | Il carattere che verrà utilizzato per visualizzare il carattere nel widget chat del sito web. |
Quando questa opzione è selezionata, il visitatore del sito web non ha la possibilità di allegare un allegato nel widget chat del sito.
Quando si utilizza questa opzione, il widget sarà completamente nascosto. Fino a quando il riferimento di ancoraggio è stato cliccato o quando la chat è aperta tramite l'API programmatica.
#webchat_widget
Utilizzando l'ancora sopra puoi creare un pulsante sulla tua pagina, per aprire il widget una volta cliccato.
Utilizzando questa opzione puoi rimuovere il branding respond.io dal tuo Widget.
Step 1: Click Settings > Channels
Passo 2: Individuare il sito web Chat > fare clic su Gestisci
Passo 3: Nella pagina di configurazione della chat del sito web vedrai le seguenti configurazioni:
Chat Link - Il link URL per il tuo contatto per raggiungere il tuo canale.
Nome del canale - Il nome del canale può essere modificato ed è usato internamente per identificare il canale.
Website Domains - Siti web collegati al tuo Widget.
Website Chat Code - Il codice che puoi incollare nel codice HTML del tuo sito web se hai bisogno di recuperare il codice generato del codice.
Se doni't includi il tuo sito web in questa lista, il tuo widget ha vinto't load. È possibile aggiungere più URL se're utilizzando il plugin su più siti web.
Step 4: Fare clic su Salva modifiche per aggiornare la pagina di configurazione della chat del sito
Gli utenti registrati del tuo sito web possono essere identificati aggiungendo un semplice codice JavaScript al codice del tuo sito web. Una volta che l'identificatore passato è abbinato a un contatto esistente, la conversazione corrente verrà ripresa.
Il termine “utente” è utilizzato nel contesto del tuo sito web. Nella piattaforma respond.io, continuiamo a riferirli come “Contatti”.
window.__respond_settings = {
identifier: "customer@example. om",
firstName: "Jane",
lastName: "Doe",
phone: "60123456789",
email: "customer@esempio. om",
profilePic: "https://static.indipendent.co. k/s3fs-public/thumbnails/image/2015/07/08/14/pic. pg",
Paese: "MY",
lingua: "it",
// Campi personalizzati
custom_fields: {
// slugs of custom fields
number: 123,
descrizione: "some text",
},
};Guida su come utilizzare il codice
Modificare il codice (indicato di seguito) per inviare respond.io l'identificatore dell'utente attualmente registrato. Questo può essere l'indirizzo email o l'ID del contatto o in base a qualsiasi altro campo di contatto. Nota 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.
Lo script per identificare gli utenti registrati deve essere posizionato sopra il codice di chat del sito web che può essere trovato nella finestra di configurazione della chat del sito.
Puoi anche inviare i campi dei contatti respond.io associati ai tuoi contatti in modo da memorizzare il campo di contatto durante il processo di creazione del contatto. Il nome del campo (o slug) può essere trovato nel modulo Campi di contatto.
Si prega di notare che se si utilizza questa funzione, il modulo pre-chat verrà ignorato, il che significa che i Contatti non devono compilare le loro informazioni prima di iniziare una conversazione.
L'esempio di cui sopra sta passando un indirizzo email come identificatore e durante il processo di creazione di contatti, tutti i campi di contatto passati verranno memorizzati.
Il Widget Chat del Sito Web può essere aperto e chiuso tramite il codice JavaScript del tuo sito Web. Questo ti permette di creare un pulsante "Chat con noi" personalizzato sul tuo sito Web, e attivare il Sito Web Chat Widget per aprire quando un visitatore fa clic sul pulsante.
Apri chat
Descrizione: Apre il widget chat.
Sintassi: $respond.do("chat:open")
Chiudi chat
Descrizione: Chiude il widget chat.
Sintassi: $respond.do("chat:close")
La chat è stata aperta
Descrizione: Gestisce l'evento aperto del widget chat (attiva la funzione callback).
Sintassi:$respond.on("chat:opened", callback)
Chatbox è stato chiuso
Descrizione: Gestisce l'evento chiuso del widget chat (attiva la funzione callback).
Sintassi:$respond.on("chat:closed", callback)
La chat è aperta?
Descrizione: Restituisce true se il widget chat è aperto, altrimenti false.
Sintassi: $respond.is("chat:open")
La chat è chiusa?
Descrizione: Restituisce true se il widget chat è chiuso, altrimenti false.
Sintassi: $respond.is("chat:closed")
Ci potrebbero essere alcuni motivi per cui i messaggi non vengono consegnati:
Il contatto ha lasciato il sito web.
Il contatto's inattività può superare il periodo di timeout.
Contatto's client può avere problemi di connessione a Internet.
Assicurarsi che il codice sia installato correttamente. Fare riferimento alle istruzioniquisu come installare il widget chat del sito web.
Assicurarsi di whitelist il sito web dove il widget deve essere installato. Fare riferimento al punto 3 diConnecting Website Chat Widgetsu come whitelist il tuo dominio.
Articoli correlati 👩💻