Menu

8 leitura mínima

Chat ao Vivo (Complemento)


Visão Geral

O Chat Ao Vivo permite que seus clientes enviem mensagens para os vendedores em tempo real sobre um produto ou sobre o vendedor em geral. Como o comerciante do marketplace, você pode ver e participar de todas as conversas, além de conversar privadamente com seus vendedores. O Chat Ao Vivo é um complemento, e apenas clientes que estão logados podem usá-lo, então certifique-se de que o complemento esteja ativo em seu plano e que as contas dos clientes estejam habilitadas no Shopify.

Neste guia, você aprenderá como:

  • Adicione o botão de Chat ao Vivo e a página de Mensagens ao seu tema Shopify.
  • Entenda o que os clientes veem quando conversam com um vendedor.
  • Encontre, responda e gerencie conversas na caixa de entrada do Chat ao Vivo.
  • Converse em particular com seus fornecedores.
  • Conecte uma loja personalizada usando a API de Chat ao Vivo.

1. Adicione o botão de Chat Ao Vivo às páginas de produtos.

No seu admin do Shopify:

  1. Ir paraCanais de Vendas → Loja Online → TemasAparentemente, sua mensagem está vazia. Poderia fornecer mais informações ou um texto específico que você gostaria que eu traduzisse?
  2. CliquePersonalizarem seu tema ao vivo.
  3. No menu de templates no centro superior, selecioneProdutos → Produto padrão.
  4. NaInformações do produtoseção, cliqueAdicionar blocoParece que sua mensagem está vazia. Como posso ajudar você?
  5. Abra o{{placeholder}}Aplicativosaba e selecionarChat ao Vivo. Coloque-o perto do {{local}}.Adicionar ao carrinhobotão.
  6. Ajuste as configurações e cliqueSalvar.

Configurações do bloco de Chat Ao Vivo

  • Botão de chat:texto do botão (padrão)Converse com {vendor}), largura, altura e cores.
  • Painel de bate-papo:cor de destaque eSugestões de respostas rápidasuma lista separada por vírgulas exibida como chips tocáveis. Deixe em branco para escondê-los.
  • Prefixo da URL do proxy do aplicativo:padrão/a/dashboard. Deve corresponder à URL do App Proxy emAdmin do Shopify → Configurações → Aplicativos → Shipturtle, sem uma barra final.

O bloco de Chat Ao Vivo só pode ser adicionado a templates de produtos.

Live chat 16

Editor de tema → Produto padrão → Adicionar bloco → Apps: Bloco de Chat Ao Vivo

2. Crie o Template da Página de Mensagens

A página de Mensagens é a caixa de entrada dos seus clientes para todas as suas conversas. Deve estar disponível em/páginas/mensagensOlá! Como posso ajudá-lo hoje?

  1. Ir paraCanais de vendas → Loja Online → Temas. No seu tema ao vivo, cliqueParece que você não enviou uma mensagem completa. Como posso ajudá-lo?e selecioneClaro! Por favor, forneça o código que você gostaria de editar e diga quais modificações você tem em mente.Claro! Como posso ajudá-lo hoje?
  2. No(a)modelospasta, adicionar um novo modelo de página chamadomensagens. Está salvo comoDesculpe, mas não tenho acesso a arquivos ou dados específicos como "page.messages.json". No entanto, posso ajudá-lo a entender o que poderia conter um arquivo JSON desse tipo ou a traduzi-lo, se você fornecer o conteúdo. Como posso ajudar?Claro! Como posso ajudá-lo hoje?

live-chat1

Loja Online → Temas → ⋯ menu: Editar código

live-chat2

Editar código → templates: page.messages.json

3. Adicionar a Página de Mensagens

  1. Ir paraCanais de vendas → Loja Online → Páginase cliqueAdicionar páginaParece que você enviou apenas um ponto. Como posso ajudá-lo? Se precisar de tradução ou ajuda com algo específico, por favor, forneça mais informações!
  2. Digite um título, por exemploMensagensClaro! Como posso ajudar você hoje?
  3. DebaixoModelo, selecionemensagens.
  4. AbaixoListagem em mecanismo de busca, verifique se a URL termina em/paginas/mensagens, então cliqueSalvar.

live-chat3

Loja Online → Páginas: Adicionar página

live-chat4

Página de mensagens: template de mensagens selecionado e URL /pages/messages

4. Adicione o Bloco de Mensagens

  1. Vá paraCanais de vendas → Loja Online → Temase cliquePersonalizarno seu tema ao vivo.
  2. Do menu de modelos no centro superior, selecionePáginas → mensagensClaro! Parece que você não forneceu uma frase ou texto para traduzir. Por favor, forneça o conteúdo que você gostaria que fosse traduzido para o português brasileiro.
  3. CliqueAdicionar bloco, abertoAplicativos, e selecioneMensagensClaro! Como posso ajudar você?
  4. Ajuste as configurações e cliqueSalvar.

Configurações de bloqueio de mensagens

  • Altura do painel:altura da caixa de entrada (padrão)640px).
  • Caixa de mensagem placeholdereSugestões de respostas rápidas:cada vírgula começa um novo chip.
  • CSS personalizado:escopo seus estilos para#st-mensagens-appassim eles não afetam o restante do seu tema.

Os visitantes desconectados são enviados para a página de login. Adicione umMensagenslink para seu cabeçalho ou menu de conta para que os clientes possam encontrar suas conversas.

live-chat5

Editor de tema → modelo de mensagens → Adicionar bloco → Apps: bloco de mensagens

live-chat6

Configurações do bloco de mensagens

5. Converse com o Vendedor nas Páginas de Perfil do Fornecedor

Se você usar o bloco de Perfil do Vendedor Shipturtle, umConverse com o vendedorO botão aparece automaticamente ao lado do nome do vendedor. Nenhuma configuração é necessária.

  • ClicandoConverse com o vendedorabre a página de Mensagens com esse fornecedor.
  • Se o cliente já tiver uma conversa com o vendedor, ela é aberta. Caso contrário, uma nova é iniciada com a primeira mensagem deles.
  • AContatoA aba do perfil do fornecedor está oculta enquanto o Chat Ao Vivo está ativo.

live-chat7

Página do perfil do vendedor: Botão de conversar com o vendedor

Para mais informações, veja {{url}}.Página de Perfil do Fornecedor

6. O que Seus Clientes Vêem

Conversando a partir de uma página de produto

  1. O cliente clicaConverse com . Se eles não estiverem logados, serão solicitados a fazer login e, em seguida, retornados ao produto.
  2. Um painel de chat se abre com o nome do vendedor e os detalhes do produto.
  3. O cliente digita uma mensagem ou toca em um chip de resposta rápida e a envia.

Cada produto tem sua própria conversa, então os clientes podem ver suas mensagens anteriores quando retornam. Arquivos podem ser anexados após a primeira mensagem de texto.

Usando a página de Mensagens

  • ACaixa de entradalista todas as conversas com uma prévia, horário e badge de não lido.
  • Os clientes podem pesquisar por produto ou vendedor e abrir uma conversa para responder ou anexar arquivos.
  • Entreguemudanças paraVistouma vez que o vendedor leia a mensagem.

live-chat8

Página do produto: Painel de Chat Ao Vivo com botões de resposta rápida

live-chat9

Página de mensagens: Caixa de entrada e conversa

7. Abra a Caixa de Entrada do Chat Ao Vivo

  1. Faça login no Shipturtle.
  2. SelecionarChat ao Vivodo menu de navegação à esquerda.
  3. Selecione uma conversa da lista à esquerda para abri-la.
  • Os comerciantes veem todas as conversas no mercado. Os vendedores veem apenas as conversas sobre seus próprios produtos e perfil.
  • SeChat Ao Vivonão está no menu, o complemento não está ativo na sua conta.

Pesquisar e filtrar conversas

  • Pesquisar conversas...:pesquise pelo nome ou e-mail do cliente, produto ou assunto. Os comerciantes também podem pesquisar por fornecedor.
  • Todos,Aberto, eResolvidoabas: alternar entre os status da conversa.
  • Filtros(ícone de funil): filtrar por e-mail do remetente, vendedor (apenas comerciantes), tipo (Produto ou Geral) e data.
live chat..

Painel do Shipturtle → Chat Ao Vivo: caixa de entrada

8. Responder a uma Conversa

  1. Abra a conversa da caixa de entrada. Está marcada como lida.
  2. Escreva sua resposta em Digite uma mensagem...caixa.
  3. Para adicionar arquivos, clique no ícone de clipe de papel e aguarde até que cada arquivo fique verde.
  4. ImprensaEntrarou clique no ícone de envio.
  • Entreguemudanças paraVistouma vez que a outra pessoa leia sua mensagem.
  • Você pode enviar até 10 arquivos por mensagem, com até 10 MB cada (JPG, PNG, GIF, WEBP, PDF, DOC, DOCX, XLS, XLSX, TXT, CSV).
  • As mensagens podem ter até 5.000 caracteres.

Visualizar contexto da conversa

ODetalhes do ContextoO painel à direita mostra onde a conversa começou, o nome e e-mail do cliente, e os detalhes do produto. Clique no título do produto para abrir o produto no Shipturtle.

live chat

Conversa de Chat Ao Vivo: histórico de mensagens e caixa de mensagem, e painel de detalhes de contexto: detalhes do cliente e do produto.

9. Resolver, Arquivar ou Deletar uma Conversa

Abra a conversa e clique em {button}.Parece que você enviou um símbolo de interrupção (⋮). Por favor, forneça o texto que você gostaria que eu traduzisse, e ficarei feliz em ajudar!menu no cabeçalho do chat:

  • Marcar como Resolvido(mercadores apenas): encerra a conversa e a move para oResolvidoaba.
  • Reabrir Chat(merchants only): reabre uma conversa resolvida.
  • Arquivo:esconde a conversa da sua caixa de entrada e da página de Mensagens do cliente.
  • Excluir conversa:remove para todos, incluindo o cliente. Isso não pode ser desfeito.Parece que você não inseriu nenhum texto para tradução. Por favor, forneça o conteúdo que você gostaria que eu traduzisse para o português brasileiro.
live chat

10. Se o cliente escrever novamente

  • Uma conversa resolvida ou arquivada é reaberta com todo o seu histórico.
  • Uma conversa excluída não é restaurada. A próxima mensagem do cliente inicia uma nova.

11. Notificações

  • Novas mensagens, indicadores de digitação e recibos de leitura aparecem em tempo real em uma conversa aberta.
  • Quando você responde, o cliente recebe um e-mail pedindo para fazer login e responder. No máximo um e-mail é enviado por conversa a cada 24 horas.
  • Os comerciantes e vendedores não recebem e-mails sobre novas mensagens de clientes, então verifique a caixa de entrada do Chat Ao Vivo regularmente.

Para mais informações, consulte Adicionar Domínio de E-mail Personalizado e Notificações.

12. Conectar um Frontend Personalizado com a API de Chat Ao Vivo

  • Se a sua loja não foi construída em um tema Shopify (por exemplo, um site headless), use a API de Chat ao Vivo para oferecer chat através da sua própria interface.
  • Vá para Configurações → Integrações.
  • Sob Integrações de Mensagem, encontre a API de Chat Ao Vivo e clique em Configurar.
  • Clique em Gerar credencial.

13. Salve suas Credenciais de API e Configurações do Pusher

  1. Copie oID da EmpresaParece que você enviou uma vírgula. Como posso ajudar você? Se precisar de tradução ou qualquer outra coisa, sinta-se à vontade para me informar!Chave da API, eapi_secretArmazene o segredo em segurança, pois ele é exibido apenas uma vez.
  2. SobConfiguração do Pusher, insira seu PusherID do aplicativo,Chave do App,Segredo do Aplicativo, eAgrupamento, então cliqueSalvar configuração do pusher.
  3. Compartilhe as credenciais com seu desenvolvedor para conectar sua loja.

Gerencie suas credenciais

  • Rotacionar credenciais:emite uma nova chave e segredo. As sessões de clientes existentes param de funcionar.
  • Revogar credencial:desliga o chat da API até que você rotate as credenciais.
  • Limpar Configuração do Pusher:para o chat em tempo real até que os novos detalhes do Pusher sejam salvos.

Para a referência completa da API, entre em contato com a equipe do Shipturtle.

Set up for live chat

Perguntas Frequentes & Solução de Problemas

  • Eu não vejo o Chat ao Vivo no menu do meu painel.
    O complemento de Chat Ao Vivo não está ativo em sua conta. Entre em contato com a equipe do Shipturtle para ativá-lo.
  • Os clientes veem um prompt de login em vez do chat.
    O Chat ao Vivo funciona apenas para clientes logados. Certifique-se de que as contas de cliente estão ativadas no Shopify.
  • O painel de chat abre, mas as mensagens não carregam ou não são enviadas.
    Verifique que oPrefixo da URL do proxy do aplicativono bloco de Chat Ao Vivo corresponde à URL do Proxy do App emAdmin do Shopify → Configurações → Aplicativos → Shipturtle, sem barra no final.
  • O chat com o vendedor mostra um erro de "página não encontrada".
    Criar uma página em/pages/mensagensusando omensagensModelo, e adicione o bloco de Mensagens a ele (veja seções 2–4).
  • Por que não consigo anexar um arquivo à primeira mensagem?
    Envie uma mensagem de texto primeiro. Você pode enviar arquivos a partir da próxima mensagem.
  • Como vendedor, por que não consigo responder a uma conversa resolvida?
    Somente o comerciante pode reabri-lo. Ele também reabre automaticamente quando o cliente escreve novamente.
  • Os vendedores conseguem ver as conversas uns dos outros?
    Não. Os vendedores veem apenas suas próprias conversas. O comerciante vê todas elas.
  • Uma nova conversa não está aparecendo na minha caixa de entrada.
    Troque de abas ou recarregue a página para atualizar a lista.
  • Quais idiomas o chat da loja suporta?
    O texto embutido está disponível em inglês, alemão, espanhol, holandês, português, norueguês e romeno. Outros idiomas exibem o inglês. O texto que você insere nas configurações do bloco é mostrado exatamente como digitado.

Artigos Relacionados

Precisa de ajuda?

Se você estiver com dificuldades, entre em contato com a equipe de suporte do Shipturtle emequipe@shipturtle.comou crie um chamado de suporte através da página de suporte do Shipturtle.