Mostre cards de produto e permita adicionar ao carrinho pelo chat
Quando o Olvio recomenda outros produtos do seu catálogo, ele mostra cards de produto abaixo da resposta. Por padrão, cada card leva à página do produto. Você também pode permitir que os compradores escolham uma variante e a adicionem ao carrinho sem sair do chat. Os dois recursos estão disponíveis em todos os planos.
Quando os cards de produto aparecem
Os cards aparecem abaixo de uma resposta que recomenda, oferece ou descreve outros produtos do seu catálogo. Eles ficam em uma fileira que os compradores rolam na horizontal.
No chat da página de produto, uma resposta geralmente não mostra mais de 6 cards.
Nas conversas do Olvio Advisor, uma resposta mostra até 4 cards. O Olvio Advisor está disponível nos planos Growth e Scale. Veja O que é o Olvio Advisor?.
Não há nenhuma configuração para desativar os cards de produto.
O que um card mostra
Por padrão, cada card mostra a imagem do produto (quando o produto tem uma), o título e o preço. Clicar em um card abre a página do produto em uma nova aba.
Preço: um produto com um único preço mostra esse preço, formatado de acordo com o idioma da página da loja virtual, por exemplo €24.90 em inglês ou 24,90 € em francês. Os preços dos cards usam a moeda padrão da sua loja e os preços sincronizados do seu catálogo. Eles não são convertidos para a moeda em que o comprador está navegando. Um produto com vários preços mostra A partir de e o preço mais baixo. Um produto cujas variantes são todas gratuitas mostra Grátis.
Selo de desconto: quando um produto tem um único preço e um preço comparativo maior que esse preço, um selo como -20% aparece na imagem. A porcentagem é arredondada para baixo.
Selo Esgotado: quando nenhuma das variantes do produto está disponível para venda, um selo Esgotado aparece na imagem no lugar do selo de desconto. Produtos com 50 variantes ou mais nunca mostram esse selo.
Produtos sem imagem não mostram nenhum dos dois selos.
Ative adicionar ao carrinho no chat
Abra Aparência no menu do app Olvio.
Clique na aba Avançado.
No card Adicionar ao carrinho no chat, marque Ativar adicionar ao carrinho no chat.
Clique em Salvar na barra de salvamento. A mensagem Alterações salvas confirma a ação.
A opção vem desativada por padrão. Depois que você salva, ela vale para as próximas respostas no chat da página de produto e nas conversas do Olvio Advisor.
O que os compradores veem com adicionar ao carrinho ativado
Os cards mudam para produtos com pelo menos uma variante disponível que pode ser mostrada nos menus suspensos:
Um botão Adicionar ao carrinho aparece abaixo do preço.
Abaixo do botão, há um menu suspenso para cada opção com mais de um valor, como Cor ou Tamanho. Um produto sem opções desse tipo mostra apenas o botão.
Os menus suspensos começam na primeira variante disponível. Os valores que não estão disponíveis com as outras opções selecionadas aparecem esmaecidos e riscados, e não podem ser escolhidos.
O preço acompanha a variante selecionada. Uma variante gratuita mostra Grátis.
Se nenhuma variante disponível corresponder às opções selecionadas, o botão mostra Esgotado e não pode ser clicado.
A imagem, o título e o preço continuam abrindo a página do produto em uma nova aba. Esses cards não mostram o selo de desconto.
Os outros produtos mantêm o card padrão descrito acima. Os menus suspensos incluem no máximo 50 variantes de um produto.
O que acontece quando um comprador clica em Adicionar ao carrinho
O Olvio adiciona uma unidade da variante selecionada ao carrinho da Shopify do comprador. Os compradores não podem escolher a quantidade no chat.
O botão mostra A adicionar... com um indicador de carregamento e depois Adicionado ao carrinho com uma marca de seleção.
Cerca de um segundo depois, a página é recarregada para que o carrinho do seu tema mostre o novo item, e o painel de chat reabre.
Se o carrinho não aceitar o item, o botão mostra Erro - tentar novamente e volta a Adicionar ao carrinho depois de alguns segundos para que o comprador possa tentar de novo.
Ocultar variantes gratuitas
O card Adicionar ao carrinho no chat também tem a caixa Ocultar variantes gratuitas (preço 0). Ela vem marcada por padrão e afeta os preços dos cards mesmo quando Ativar adicionar ao carrinho no chat está desmarcada.
Marcada: as variantes com preço 0 são ignoradas quando o Olvio calcula o preço do card e, com adicionar ao carrinho ativado, ficam ocultas nos menus suspensos. Isso só acontece quando o produto também tem variantes pagas. Um produto cujas variantes são todas gratuitas continua aparecendo, com o preço Grátis, e com adicionar ao carrinho ativado suas variantes continuam selecionáveis. Se as únicas variantes disponíveis de um produto forem gratuitas, o card dele mantém a aparência padrão, sem adicionar ao carrinho.
Desmarcada: as variantes com preço 0 contam. Nos cards sem adicionar ao carrinho, um produto que mistura variantes gratuitas e pagas mostra A partir de com um preço zero, por exemplo A partir de € 0,00. Com adicionar ao carrinho ativado, as variantes gratuitas dele aparecem nos menus suspensos.
Clique em Salvar na barra de salvamento para aplicar a alteração.
O botão Adicionar ao carrinho no painel de chat
Nas páginas de produto que mostram o widget do Olvio, o painel de chat mostra um botão Adicionar ao carrinho acima do campo de pergunta, para o produto que o comprador está vendo. Esse botão não é controlado por Ativar adicionar ao carrinho no chat.
Ele mostra o preço e adiciona a variante selecionada no momento na página do produto.
Se essa variante estiver indisponível, ele mostra Esgotado e não pode ser clicado.
Um clique funciona como no botão de um card: uma unidade é adicionada, Adicionado ao carrinho aparece e a página é recarregada com o painel de chat aberto.
Ele fica oculto enquanto o painel de chat mostra uma conversa do Olvio Advisor.
Combine os cards e os botões com a sua marca
Cores: os botões de adicionar ao carrinho usam a sua Cor de destaque e o seu Primeiro plano de destaque. Os nomes de produto nos cards usam Texto, e os preços usam Texto atenuado. Se a caixa "Use custom colors for this block" estiver marcada no bloco Olvio — Product page do editor de temas, as cores do bloco substituem essas nas páginas de produto que mostram esse bloco. Veja Personalize as cores do widget.
Raio dos cantos: o controle deslizante Botão de adicionar ao carrinho, no card Forma da aba Painel de chat, define os cantos tanto dos botões dos cards quanto do botão do painel de chat. Os menus suspensos de variantes seguem o controle Campo de entrada, e as imagens dos cards seguem o controle Balão de conversa. Veja Personalize o raio dos cantos do widget.
CSS personalizado: use
.olvio-cardpara cada card,.olvio-card-atcpara os botões dos cards e.olvio-atc-btnpara o botão do painel de chat. Adicione!importanta cada propriedade que você substituir. Veja Adicione CSS personalizado ao widget.
A Pré-visualização ao vivo da página Aparência mostra o botão Adicionar ao carrinho do painel de chat, mas não os cards de produto. Confira os cards na sua loja virtual.
Texto dos cards em outros idiomas
Nos cards, A partir de, Grátis, Esgotado, Adicionar ao carrinho, A adicionar..., Adicionado ao carrinho e Erro - tentar novamente seguem o idioma da página da loja virtual. Esse texto existe em inglês, francês, alemão, espanhol, italiano e português, e os cards usam o inglês em páginas de outros idiomas. Você não pode editá-lo. Os títulos dos produtos e os valores dos menus suspensos de variantes vêm do seu catálogo no idioma padrão da loja, seja qual for o idioma da página. Os links dos cards abrem a página do produto no endereço padrão, sem o prefixo de idioma da página em que o comprador está, então a nova aba pode mostrar a página no idioma padrão da sua loja. Veja Multilíngue: escolha quais idiomas o seu widget cobre.
Acompanhe os resultados de adição ao carrinho
Quando um comprador que conversou com o Olvio adiciona um produto ao carrinho em uma página de produto que mostra o widget do Olvio, nos 7 dias antes ou depois da conversa, seja por um card, pelo botão do painel de chat ou pelo botão do próprio tema quando ele adiciona o produto sem carregar uma nova página:
A conversa é marcada na coluna Adicionado ao carrinho de Conversas.
Ela conta para a Taxa de adição ao carrinho com o Olvio no Painel (clique em Olvio no menu do app).
Uma adição feita antes da primeira mensagem do comprador só é vinculada se o mesmo carrinho já tiver sido usado em uma conversa anterior com o Olvio. Se não tiver, as adições seguintes feitas com o botão do seu tema também não são vinculadas até o comprador recarregar a página ou abrir outra, mesmo que ele converse nesse meio-tempo.
As adições feitas pelos cards do Olvio Advisor em páginas que não mostram o bloco do widget do Olvio não são registradas como adições ao carrinho. Essas conversas só são marcadas como Adicionado ao carrinho se o comprador também adicionar ao carrinho em uma página de produto que mostra o widget do Olvio dentro dos 7 dias, ou se tiver um pedido atribuído.
Uma conversa com um pedido atribuído nos 7 dias antes ou depois dela também é marcada como Adicionado ao carrinho e conta para a Taxa de adição ao carrinho com o Olvio. Veja Como funciona a atribuição de conversão.
Teste a sua configuração
Marque Ativar adicionar ao carrinho no chat e clique em Salvar.
Abra uma das suas páginas de produto e peça alternativas, por exemplo "Mostre outras opções."
Em um card com várias opções, escolha um valor em um menu suspenso, depois abra outro menu suspenso e confira se os valores sem estoque com essa escolha aparecem riscados.
Se um produto mistura variantes gratuitas e pagas, confira se o card dele corresponde à sua escolha em Ocultar variantes gratuitas (preço 0).
Clique em Adicionar ao carrinho em um card. Depois que a página recarregar, confira se o seu carrinho contém a variante e se o painel de chat está aberto de novo.
Abra Conversas no menu do app Olvio e confira se a sua conversa de teste está marcada como Adicionado ao carrinho.
Para uma verificação completa da sua loja, veja Teste o Olvio na sua loja.