API del widget
Per gli sviluppatori o chiunque voglia che la chat si apra da un proprio pulsante.
Installazione
<script src="https://keyda.in/business/widget.js"
data-key="kb_live_your_key_here" async></script>Il tag script richiede solo src e data-key. Tutto il resto — colori, posizione, saluto, lingua — arriva dalla tua dashboard, così non devi mai ripubblicare il sito per cambiarli.
Il widget viene mostrato nella lingua impostata in Installa → Lingua del tuo bot: pulsante, campi e avvisi, e la direzione del layout (arabo e urdu sono da destra a sinistra). Le stringhe arrivano insieme alla configurazione del widget, quindi non c'è una seconda richiesta e non c'è nulla da tradurre da parte tua.
Modalità
Fluttuante (predefinito). Un pulsante di avvio nell'angolo che apre un pannello di chat.
Incorporato. Inserisci un contenitore vuoto nella pagina e la chat lo riempirà:
<div data-keyda-bot style="height:520px"></div>Il contenitore ha bisogno di un'altezza. Nella modalità in linea la chat è sempre visibile, quindi non c'è nulla da aprire o chiudere.
API JavaScript
Disponibile su window.KeydaBot una volta caricato lo script:
| Chiama | Cosa fa |
|---|---|
KeydaBot.open() | Apre il pannello della chat |
KeydaBot.close() | Lo chiude |
KeydaBot.toggle() | Apre o chiude |
KeydaBot.expand() | Rende il pannello alto quanto la finestra e largo fino a 760px |
KeydaBot.shrink() | Torna alla scheda standard |
KeydaBot.isOpen | true quando la chat è visibile |
KeydaBot.isExpanded | true mentre il pannello è espanso |
KeydaBot.clientId | Il client id utilizzato da questa pagina |
Esempio: apri la chat dal tuo pulsante "Chatta con noi":
<button onclick="KeydaBot.open()">Chat with us</button>window.KeydaBot potrebbe non esistere per un istante subito dopo il caricamento della pagina. Associa i gestori a un evento di click anziché eseguirlo mentre la pagina viene analizzata.Come si comporta sulla tua pagina
- Il pannello si apre sopra il pulsante di attivazione, che rimane dov'è e diventa il controllo di chiusura. Toccandolo di nuovo, la ✕ nell'intestazione o premendo Esc chiude la chat.
- Un visitatore può espandere il pannello dall'intestazione — questo si estende fino all'altezza della finestra e fino a 760px di larghezza — e la preferenza viene salvata nel browser. Sui telefoni il pannello occupa già tutto lo schermo, quindi questo comando non viene mostrato.
- L'impostazione delle dimensioni del logo modifica il logo, non il pulsante: il launcher mantiene le sue dimensioni e il logo si ingrandisce al suo interno. Dimensione del pulsante (Installa → Aspetto) è ciò che ridimensiona il pulsante stesso — piccolo, medio o grande — qualunque sia la sua forma.
- Quattro forme del pulsante: una pillola con la tua etichetta, una bolla rotonda, un quadrato arrotondato e un fumetto con una coda. La coda si trova sul lato rivolto verso la tua pagina.
- Tutto viene eseguito all'interno di uno shadow root, in modo che il tuo CSS non possa compromettere il widget e il CSS del widget non possa toccare il tuo sito.
- Il pannello si carica solo quando un visitatore lo apre, quindi non rallenta la pagina.
- La conversazione di un visitatore continua per 24 ore se torna, poi ricomincia da capo. Riaprire il pannello ripristina il filo del discorso — file inclusi, e una domanda del flusso di benvenuto che era ancora in attesa di risposta.
- La graffetta nel campo di scrittura permette a un visitatore di allegare fino a tre foto o documenti a un messaggio (dimensioni e tipi in Limiti e sicurezza). Le foto vengono ridimensionate nel browser prima del caricamento, così uno scatto da 12 megapixel lascia la pagina a poche centinaia di kilobyte. Disattiva i file in Installa e il pulsante scompare.
- Un flusso di benvenuto funziona come normali bolle: le scelte diventano pulsanti sotto la bolla, un pulsante Salta appare quando un passaggio è facoltativo, e il segnaposto del campo di scrittura diventa la domanda. Un flusso completato viene ricordato nel browser del visitatore per 30 giorni.
- Se non è possibile raggiungere l'assistente, il widget mostra un breve messaggio e non genera mai errori nella pagina.
Negli SDK per app
La stessa chat funziona in ogni SDK, quindi allegati e flussi di benvenuto arrivano alla tua app senza bisogno di una release — con un'eccezione. Aprire un selettore di file da una web view è compito dell'app ospitante. I pacchetti iOS, React Native e Ionic lo fanno già; Android e Flutter richiedono SDK 0.1.4 o successivo. Sulle versioni precedenti il widget riconosce il contenitore e nasconde la graffetta invece di mostrare un pulsante che non fa nulla.
NSCameraUsageDescription nel suo Info.plist. Aggiungi la chiave prima di distribuire una build che includa la chat.