O widget de chat do website permite que os visitantes do website entrem em contacto consigo através de chat ao vivo ou por outros canais de mensagens que tenha ligado.
Conectando um widget de chat para o site.
Veja o vídeo abaixo para um guia passo a passo sobre como ligar o chat do site ao respond.io.
Passo 1: Vá para Definições > Canais
Passo 2: Clique em Adicionar canal > Chat no site > Ligar
Passo 3: Preencha o(s) site(s) onde o widget será adicionado.
Consulte o seguinte sobre como os sites podem ser incluídos na lista de permissões.
Se o utilizador adicionar
https://app.respond.io, apenashttps://app.respond.ioserá incluído na lista de permissões. Qualquer outro subdomínio ou raiz não deve funcionar.Se o utilizador adicionar
https://*.respond.io, todos os subdomínios, incluindo o domínio raiz, serão incluídos na lista de permissões.Se o utilizador adicionar
https://respond.io, apenas o domínio raiz será incluído na lista de permissões.
Passo 4:Selecione uma cor de tema para o widget utilizando o seletor de cores interativo.
Escolha uma cor que combine com a sua marca cor e site.
Passo 5:Selecione um ícone para o widget apresentar no website. Se preferir enviar um ícone personalizado, pode enviar um ícone quadrado com um tamanho recomendado de 256px x 256px.
Os widgets podem ser ainda mais personalizados depois de ligados.
Passo 6: Clique emSeguinte> Adicione o script ao seu site preferido. Em alternativa, pode enviar as instruções de instalação a outra pessoa por e-mail.
Instalando o widget de chat
Pode precisar de um webmaster ou administrador técnico para ajudar a instalar o widget de chat no website. Se necessário, procure ajuda.
Dependendo do sistema que utiliza para criar e gerir o seu website, criámos um guia passo a passo para o orientar na instalação de um Chat Widget no seu website.
Para outras plataformas ou serviços, navegue até ao código HTML da página. Cole o script antes da etiqueta </body> .
<body>
...
...
...
<Paste Script Here>
</body>Se precisar de ajuda, pode reencaminhar o script juntamente com as instruções de instalação para o administrador do seu site. Marque a caixa de seleção correspondente e introduza o endereço de e-mail de alguém que o possa ajudar a instalar o plugin de chat.
O widget de chat do site respond.io aparecerá no seu site depois de o script ser instalado com sucesso.
Personalizando o widget de chat
Passo 1:No seu espaço de trabalho, aceda aDefinições>Canal
Passo 2: Localizar o canal de chat do site > clicar em Personalizar
Personalize o widget do site para corresponder à aparência do site, para que o widget tenha uma aparência uniforme. No lado direito da página, existe uma pré-visualização do widget de chat do site. Qualquer personalização feita no widget será refletida no widget para o ajudar a ter uma melhor ideia do que está a personalizar.
Exibir & Aparência
Pode personalizar o seguinte para alterar a aparência de exibição do widget no site.
Campo | Descrição |
|---|---|
Cor do tema | A cor escolhida será utilizada como cor primária do seu widget. |
Cor do texto | A cor escolhida será utilizada como cor principal do texto do seu widget. |
Ícone de chat do site | O ícone selecionado é utilizado dentro do balão do widget juntamente com a cor do tema. Pode carregar um ícone personalizado, se necessário. |
Mensagem pop-up | A mensagem pop-up é apresentada aos visitantes do website uma vez por dia, 5 segundos após o carregamento da página. Se não for definido, não será apresentada nenhuma mensagem pop-up aos visitantes do site. |
Validação para o ícone de chat do site:
Tamanho máximo de ficheiro: 1 MB
Dimensão máxima do ficheiro: 256 x 256 px
Formato: Quadrado
Posição
Campo | Descrição |
|---|---|
Alinhar a | Os utilizadores podem optar por especificar uma posição para exibir o widget à esquerda ou à direita da plataforma. |
Espaçamento vertical | Os utilizadores podem especificar a quantidade de espaçamento vertical entre o widget de chat do website e a parte inferior do ecrã. |
Espaçamento horizontal | Os utilizadores podem especificar a quantidade de espaçamento horizontal entre o widget de chat do website e a lateral do ecrã. |
Tamanho do widget | Os utilizadores podem escolher o tamanho do widget: Pequeno, Padrão ou Grande. |
Opções de visualização | Os utilizadores podem optar por exibir este widget no ambiente de trabalho, em dispositivos móveis ou em ambos. |
Elementos do Cabeçalho
Campo | Descrição |
|---|---|
Título | O título será apresentado no topo do seu widget de chat. |
Slogan | O slogan será apresentado abaixo do título. |
Logotipo do site de chat | Solte aqui a imagem do seu logótipo para que seja apresentada no topo do chat do site. O formato pode ser PNG, SVG ou JPG e o tamanho do ficheiro não pode ser superior a 4,0 MB. |
Ícones do canal | Esta opção permitirá que os Contactos entrem em contacto consigo através do Canal da sua preferência, desde que as opções sejam fornecidas. Pode adicionar até seis canais e eles serão apresentados no topo do widget de chat do site. |
Ícones do canal a cores | Os ícones do canal podem ser apresentados em branco ou a cores no seu widget de chat. Selecione Branco ou Colorido para combinar com a cor do tema do seu widget de chat. |
Validação para o logótipo do chat do site:
Tamanho máximo de ficheiro: 4 MB
Dimensão máxima do ficheiro: 1024 x 1024 px
Formato: Quadrado
Ícones do canal
Se o widget de chat do website nunca tiver sido configurado antes, os canais ligados com informações adequadas serão listados por predefinição como ligações de canais do widget.
Pode adicionar os links do canal do widget e especificar as informações necessárias para o canal selecionado.
Aqui está a lista de campos de entrada necessários para cada um dos links de canal suportados.
Links do canal | Campo de entrada obrigatório |
|---|---|
Número de telefone WhatsApp | |
Facebook Messenger | ID da página do Facebook |
Telegrama | Nome do bot do Telegram |
ID do Twitter | |
LINHA | ID DA LINHA |
Viber | Nome da conta pública Viber |
SMS | Número de telefone SMS |
Endereço de e-mail | |
Chamada telefónica | Número de telefone |
Link personalizado | Endereço URL e ícone |
QR personalizado | Imagem e ícone QR |
Validação para o ícone do canal:
Tamanho máximo de ficheiro: 1 MB
Dimensão máxima do ficheiro: 256 x 256 px
Formato: Quadrado
Formulário de pré-chat
A ativação desta opção irá adicionar um formulário de pré-chat ao chat do seu site. Se estiver ativado, os visitantes do seu website receberão um formulário para preencher antes de iniciar o chat.
Com esta opção ativada, pode incluir campos personalizados adicionais quando necessário. Além disso, também pode personalizar o rótulo dos campos padrão de acordo com a forma como aparecem aos seus Contactos.
Os rótulos dos campos podem ser personalizados para um idioma diferente, de modo a corresponder ao idioma do site'.
Configurações adicionais
Campo | Descrição |
|---|---|
Texto da barra de entrada | Este texto funcionará como um espaço reservado na área de digitação. |
Fonte do texto | A fonte que será utilizada para exibir a fonte no widget de chat do website. |
Restringir os anexos recebidos
Quando esta opção está marcada, o visitante do site não tem a opção de anexar um anexo no widget de chat do site.
Manter o chat do site oculto
Ao utilizar esta opção, o widget ficará completamente oculto. Até que a Referência de Âncora seja clicada ou quando o chat é aberto através da API programática.
#widget_de_chat_web
Usando a âncora acima, pode criar um botão na sua página para abrir o widget após ser clicado.
Ocultar a marca Respond.io
Utilizando esta opção pode remover a marca respond.io do seu widget.
Configuração de canal
Passo 1: Clique em Definições > Canais
Passo 2: Localizar o Chat do site > clicar em Gerir
Passo 3: Na página de configuração do chat do site verá as seguintes definições:
Link de chat - O link URL para o seu contacto aceder ao seu canal.
Nome do canal - O nome do canal pode ser alterado e é utilizado internamente para identificar o canal.
Domínios de sites - Site(s) que estão ligados ao seu widget.
Código de chat do site - O código que pode colar no código-fonte HTML do seu site se precisar de recuperar o trecho de código gerado.
Se não incluir seu site nesta lista, seu widget não será carregado. Você pode adicionar várias URLs se estiver usando o plugin em vários sites.
Passo 4: Clique em Guardar alterações para atualizar a página de configuração do chat do site
Identificando os utilizadores logados
Os utilizadores com sessão iniciada no seu site podem ser identificados adicionando um código JavaScript simples ao código do seu site. Depois de o identificador passado ser correspondido com um contacto existente, a conversa atual será retomada.
O termo “utilizador” é utilizado no contexto do seu website. Na plataforma respond.io, continuamos a referir-nos a eles como “Contactos”.
window.__respond_settings = {
identifier: "customer@example.com",
firstName: "Jane",
lastName: "Doe",
phone: "60123456789",
email: "customer@example.com",
profilePic: "https://static.independent.co.uk/s3fs-public/thumbnails/image/2015/07/08/14/pic.jpg",
countryCode: "MY",
language: "en",
// Campos personalizados
custom_fields: {
// slugs de campos personalizados
number: 123,
description: "algum texto",
},
};Guia sobre como utilizar o código
Edite o código (fornecido abaixo) para enviar ao respond.io o identificador do utilizador actualmente ligado. Pode ser o endereço de e-mail, o ID de contacto ou qualquer outro campo de contacto. Por favor, note que o
identificadoré um campo obrigatório.Cole o código diretamente na tag
headde cada página onde pretende que o chat do site apareça.O script para identificar os utilizadores com sessão iniciada deve ser colocado acima do código de chat do site, que pode ser encontrado na caixa de diálogo de configuração de chat do site.
Pode também enviar campos de contacto do respond.io associados aos seus contactos para que armazenemos o campo de contacto durante o processo de criação do contacto. O nome do campo (ou slug) pode ser encontrado no módulo Campos de contacto.
Note que se estiver a utilizar esta funcionalidade, o formulário pré-chat será ignorado, o que significa que os contactos não precisam de preencher as suas informações antes de iniciar uma conversa.
O exemplo acima está a passar um endereço de e-mail como identificador e, durante o processo de criação de contactos, todos os campos de contacto passados serão armazenados.
Controlo Programático (API para Utilizadores)
O widget de chat do website pode ser aberto e fechado através do código JavaScript do seu website. Isto permite-lhe criar um botão personalizado "Fale connosco" no seu website e acione o widget de chat do website para abrir quando um visitante clicar no botão.
Ações
Abrir bate-papo
Descrição: Abre o widget de chat.
Sintaxe:
$respond.do("chat:open")
Fechar bate-papo
Descrição: Fecha o widget de chat.
Sintaxe:
$respond.do("chat:close")
Ouvintes de eventos
A caixa de chat foi aberta
Descrição: Manipula o evento de abertura do widget de chat (aciona a sua função de callback
).Sintaxe:
$respond.on("chat:open", callback)
A caixa de chat foi fechada
Descrição: Manipula o evento fechado do widget de chat (despoleta a sua função de callback
).Sintaxe:
$respond.on("chat:closed", callback)
Métodos de verificação do estado
O chat está aberto?
Descrição: Retorna
truese o widget de chat estiver aberto, caso contráriofalse.Sintaxe:
$respond.is("chat:open")
O chat está fechado?
Descrição: Retorna
truese o widget de chat estiver fechado, caso contráriofalse.Sintaxe:
$respond.is("chat:fechado")
Perguntas frequentes e resolução de problemas
Porque é que as minhas mensagens não estão a ser entregues aos Contactos?
Pode haver algumas razões pelas quais as mensagens não estão sendo entregues:
O contato saiu do site.
A inatividade do contato pode ter excedido o período de tempo limite.
O cliente do contato pode ter problemas de conexão com a internet.
Por que meu widget não está aparecendo no meu site?
Certifique-se de que o código está instalado corretamente. Consulte as instruções aqui sobre como instalar o widget de chat do site.
Não se esqueça de colocar na lista de permissões o site onde o widget será instalado. Consulte o Passo 3 de Conectar o widget de chat do site para saber como colocar seu domínio na lista de permissões.