Keyda Business
PortugalEnglish Entrar Começar grátis
Documentação do Keyda BusinessReferência

API do widget

Para desenvolvedores, ou qualquer pessoa que queira que o chat abra a partir do seu próprio botão.

Instalando

<script src="https://keyda.in/business/widget.js"
        data-key="kb_live_your_key_here" async></script>

A tag do script só precisa de src e data-key. Tudo o resto — cores, posição, saudação, idioma — vem do seu painel, para que nunca tenha de reimplementar o seu site para os alterar.

O widget é apresentado no idioma definido em Instalar → Idioma que o seu bot fala: o seu botão, campos e avisos, e a direção do esquema (árabe e urdu são da direita para a esquerda). Os textos chegam com a configuração do widget, por isso não há um segundo pedido nem nada para traduzir do seu lado.

Modos

Flutuante (padrão). Um botão disparador no canto que abre um painel de chat.

Embutido. Coloque um container vazio na página e o chat o preencherá:

<div data-keyda-bot style="height:520px"></div>

O container precisa de uma altura. No modo embutido, o chat está sempre visível, portanto não há nada para abrir ou fechar.

API de JavaScript

Disponível em window.KeydaBot assim que o script carregar:

LigarO que ele faz
KeydaBot.open()Abre o painel de chat
KeydaBot.close()Fecha
KeydaBot.toggle()Abre ou fecha
KeydaBot.expand()Deixa o painel com a altura da janela e até 760px de largura
KeydaBot.shrink()Voltar para o cartão padrão
KeydaBot.isOpentrue quando o chat estiver visível
KeydaBot.isExpandedtrue enquanto o painel estiver expandido
KeydaBot.clientIdO client id que esta página está usando

Exemplo — abra o chat a partir do seu próprio botão "Fale conosco":

<button onclick="KeydaBot.open()">Chat with us</button>
O script é carregado de forma assíncrona, portanto window.KeydaBot pode não existir por um momento após o carregamento da página. Anexe manipuladores a um clique em vez de chamá-lo enquanto a página é analisada.

Como ele se comporta na sua página

  • O painel abre acima do botão do disparador, que permanece onde está e se torna o controle de fechar. Tocar nele novamente, no ✕ no cabeçalho ou pressionar Esc fecha o chat.
  • Um visitante pode expandir o painel a partir do cabeçalho — ele se ajusta à altura da janela e até 760px de largura — e a escolha é lembrada no navegador dele. Em celulares, o painel já ocupa a tela inteira, portanto esse controle não é exibido lá.
  • A definição de tamanho do logótipo altera o logótipo, não o botão: o iniciador mantém o seu tamanho e o logótipo cresce dentro dele. O Tamanho do botão (Instalar → Aparência) é o que redimensiona o próprio botão — pequeno, médio ou grande — seja qual for a forma.
  • Quatro formas de botão: uma pílula com o seu texto, um balão redondo, um quadrado arredondado e um balão de chat com cauda. A cauda fica no lado voltado para a sua página.
  • Tudo é renderizado dentro de um shadow root, para que o seu CSS não quebre o widget e o CSS do widget não afete o seu site.
  • O painel carrega apenas quando um visitante o abre, portanto não deixa sua página mais lenta.
  • A conversa de um visitante continua durante 24 horas se ele voltar, depois recomeça do zero. Reabrir o painel restaura a conversa — incluindo ficheiros, e uma pergunta do fluxo de boas-vindas que ainda aguardava resposta.
  • O clipe na caixa de escrita permite a um visitante anexar até três fotos ou documentos a uma mensagem (tamanhos e tipos em Limites e segurança). As fotos são reduzidas no navegador antes do carregamento, por isso uma fotografia de 12 megapixels sai da página com apenas algumas centenas de kilobytes. Desative os ficheiros em Instalar e o botão desaparece.
  • Um fluxo de boas-vindas funciona como balões normais: as escolhas tornam-se botões por baixo do balão, aparece um botão Saltar quando um passo é opcional, e o texto de exemplo da caixa de escrita torna-se a pergunta. Um fluxo concluído é memorizado no navegador do visitante durante 30 dias.
  • Se o assistente estiver inacessível, o widget exibe uma breve mensagem e nunca gera um erro na sua página.

Dentro dos SDKs de aplicação

O mesmo chat funciona em todos os SDKs, por isso anexos e fluxos de boas-vindas chegam à sua aplicação sem qualquer lançamento — com uma exceção. Abrir um seletor de ficheiros a partir de uma web view é tarefa do anfitrião. Os pacotes iOS, React Native e Ionic já o fazem; Android e Flutter precisam do SDK 0.1.4 ou posterior. Nas versões mais antigas, o widget reconhece o invólucro e esconde o clipe em vez de mostrar um botão que não faz nada.

No iOS, a folha do sistema oferece Tirar Foto sempre que imagens são aceites, e escolhê-la faz colapsar uma aplicação sem NSCameraUsageDescription no seu Info.plist. Adicione a chave antes de lançar uma compilação com o chat incluído.
Next: App SDKs →