Ir para conteúdo principal

Adicione o widget Olvio às suas páginas de produto

Adicione o bloco Olvio a um modelo de produto no editor de temas da Shopify para que o widget apareça nas suas páginas de produto.

Adicione o widget Olvio às suas páginas de produto

O widget Olvio é um bloco que você adiciona ao seu modelo de produto no editor de temas da Shopify. Nas suas páginas de produto, ele mostra seu Nome do especialista, sua Pergunta de chamariz, perguntas sugeridas e um campo de pergunta, e o painel de chat se abre quando um cliente envia uma pergunta. Você não precisa editar nenhum código do tema.

Antes de começar

  • Seu tema precisa ser um tema Online Store 2.0. Se o Olvio detectar um tema Online Store 1.0 mais antigo, o Painel mostra o banner Seu tema não é compatível com o widget do Olvio. Consulte Online Store 1.0 não suportada — o que fazer.

  • O widget só aparece na sua loja enquanto você tiver a assinatura de um plano, inclusive durante o teste gratuito.

  • Conecte sua chave de API da Anthropic. Sem uma chave, o bloco continua mostrando seu Nome do especialista, sua Pergunta de chamariz e o campo de pergunta, mas nenhuma pergunta sugerida, e enviar uma mensagem mostra uma mensagem de erro (em português: Lamentamos, ocorreu um erro. Por favor, tente novamente.). Consulte Conecte sua chave de API da Anthropic (Claude).

Adicionar o bloco pelo guia de configuração

  1. Abra o Olvio no admin da Shopify. No Painel, encontre o card Prepare o Olvio para seu primeiro cliente.

  2. Na etapa Adicione o bloco Olvio à sua página de produto, clique em Abrir editor de temas. O editor de temas da Shopify abre em uma nova aba em um modelo de produto, com o bloco Olvio adicionado em uma nova seção Apps para você visualizar.

  3. Arraste a seção até o ponto da página onde você quer que o widget apareça.

  4. Clique em Salvar para adicioná-lo ao seu tema. O bloco só aparece na sua loja se esse tema for o seu tema publicado.

O card desaparece quando todas as etapas são concluídas. Se você clicou em Ocultar no card, ele não volta, então adicione o bloco manualmente como descrito abaixo. Consulte Seu guia de configuração: prepare o Olvio para seu primeiro cliente.

Adicionar o bloco manualmente

  1. No admin da Shopify, acesse Loja virtual.

  2. Encontre seu tema publicado e clique em Editar tema. Se você adicionar o bloco a outro tema, ele só aparece na sua loja depois que esse tema for publicado.

  3. Abra o seletor de página no topo do editor (ele mostra Página inicial) e selecione o modelo de produto que você quer editar.

  4. Na barra lateral, clique em Adicionar seção ou em Adicionar bloco dentro da seção onde você quer o widget.

  5. No menu suspenso, na seção Apps, selecione Olvio — Product page.

  6. Arraste o bloco até a posição desejada, se necessário, e clique em Salvar.

O bloco Olvio só está disponível em modelos de produto. As alterações em um modelo se aplicam a todos os produtos que o usam; por isso, se alguns dos seus produtos usam outro modelo de produto (escolhido na configuração Modelo de tema do produto), adicione o bloco a esse modelo também.

Se o bloco não estiver na lista, consulte Não consigo encontrar o bloco Olvio no editor de temas.

Substituir cores ou tamanho da fonte para um modelo (opcional)

Por padrão, o widget usa as cores e o tamanho da fonte definidos na página Aparência do Olvio. Para alterá-los apenas em um modelo, selecione o bloco Olvio no editor de temas e use as configurações dele:

  • Use custom colors for this block: quando a caixa está marcada, o widget usa as cores Accent, Accent foreground, Background, Surface, Border, Text e Muted text definidas no bloco.

  • Use custom font size for this block: quando a caixa está marcada, o widget usa o Base font size do bloco, de 12 a 20 px (14 px por padrão).

Essas substituições se aplicam a todos os produtos que usam o modelo e também ao painel de chat que abre a partir do widget. A fonte, o raio dos cantos, o avatar e o CSS personalizado sempre vêm da página Aparência. Consulte Personalize as cores do widget.

Verificar se o widget está no ar

Abra uma página de produto na sua loja: o widget aparece onde você posicionou o bloco. Na primeira vez que o widget carrega em um produto ativo que o Olvio já importou, o guia de configuração marca esta etapa como concluída (se ainda houver outras etapas pendentes, o botão dela muda para Ver conversas). Esta etapa também pode ser marcada enquanto você visualiza o bloco no editor de temas; por isso, confira uma página de produto na sua loja no ar para confirmar que o bloco foi salvo: uma prévia sozinha não o publica. Para testar uma conversa completa, consulte Teste o Olvio na sua loja.

Se você marcou Ocultar o widget nos idiomas que a Olvio não cobre no card Idiomas da aba Avançado de Aparência, o widget não aparece quando um cliente navega pela sua loja em um idioma que o widget não cobre. Quando a caixa está desmarcada, o widget continua aparecendo nessas páginas: as perguntas sugeridas ficam no seu idioma principal, e o chat começa nesse idioma. Em uma página em um idioma que o Olvio não suporta, as perguntas sugeridas ficam, nesse caso, em inglês, e o chat começa em inglês, se o seu widget oferecer inglês. Abaixo da caixa de seleção, o Olvio lista os idiomas publicados pela sua loja que o widget não cobre. Se o widget cobrir todos os idiomas publicados pela sua loja, a caixa de seleção fica acinzentada. O editor de temas sempre mostra o bloco, qualquer que seja o idioma visualizado. Consulte Multilíngue: escolha quais idiomas o seu widget cobre.

Se o widget ainda não aparecer, consulte O widget não está aparecendo na minha loja.

Usar o Olvio Advisor (Growth e Scale)

O bloco da página de produto é separado do Olvio Advisor. Se a sua loja está no plano Growth ou Scale e você usa links do Advisor, ative também a incorporação de app Olvio Advisor no seu tema publicado: no editor de temas, clique no ícone Incorporações de apps, ative Olvio Advisor e clique em Salvar. Os links do Advisor precisam dessa incorporação: depois que ela é ativada, um link abre o Advisor em qualquer página da sua loja, exceto nos idiomas ocultados por Ocultar o widget nos idiomas que a Olvio não cobre. Consulte Ative o Olvio Advisor e adicione links do Advisor à sua loja.

Isto respondeu à sua pergunta?