Ferramentas/Ecommerce./Usando Ecommerce no Fluxo

Usando Ecommerce no Fluxo

Você pode verificar este " Modelo de comércio eletrônico " para se inspirar depois de configurar seu sistema de comércio eletrônico.

2026-08-11

Você pode verificar este " Modelo de comércio eletrônico " para se inspirar depois de configurar seu sistema de comércio eletrônico.

Mostrar produtos

E-commerce no Nicochat: Como apresentar produtos ao cliente
YouTube

Na etapa Enviar mensagem, encontre "Comércio eletrônico"(1), "Produto"(2) e clique em "Editar"(3). Os botões adicionados na área 4 serão exibidos abaixo de cada produto. E não se esqueça de colocar o prompt na área 5 caso nenhum produto corresponda.

Atenção
AVISO - Devido ao fato de o Facebook permitir apenas 10 cartões exibidos por vez, pode ser necessário aplicar um filtro para restringir os produtos.
  • escolha quantos produtos mostrar de 1 a 10
  • selecione uma condição de classificação de acordo com a escolha do usuário
  • defina um filtro com quantas condições forem necessárias.

Adicionar ao carrinho

E-commerce no Nicochat: Adicionando produtos ao carrinho com facilidade
YouTube

Selecione "Adicionar ao carrinho" quando o botão for pressionado. É bom avisar também o que foi adicionado. Obtenha informações do produto adicionado na variável JSON "SHOP".

Mostrar carrinho

Encontre "Carrinho de compras" em "Comércio eletrônico" e clique em "Editar". Novamente, qualquer botão colocado na área 4 será exibido com todos os produtos.

A página de edição de "mostrar carrinho" é semelhante à de "mostrar produto". Mas é um pouco mais complicado. Porque um carrinho tem que mostrar todos os produtos para análise antes da finalização da compra.

Nota
DICA: se um cliente escolher mais de 10 produtos, mas menos de 20, tente usar “Mais novos” para mostrar os 10 primeiros e “Mais antigos” para mostrar o restante. É raro, mas e se for mais de 20? Talvez tente listar os produtos por faixa de preço ou primeira letra. Alternativamente, você também pode personalizar algumas etapas de envio de mensagem para mostrar o carrinho em vez de usar a função "mostrar carrinho". Acesse as informações do carrinho na variável JSON "SHOP" e "$.cart.num" de "SHOP" para o número dos itens no carrinho.

Remover do carrinho

E-commerce no Nicochat: Removendo produtos do carrinho passo a passo
YouTube

Selecione "Remover do carrinho" quando o botão for pressionado. Você pode querer usar uma etapa Ir para para ir ao carrinho novamente para atualizar, já que há quantidades mostradas com produtos que diferem da exibição de um menu estático.

Carrinho Vazio

Selecione "Esvaziar carrinho" quando a resposta rápida for pressionada. Por que não botão? Porque pode ser redundante ter mais de um carrinho vazio acompanhando todos os produtos. Além disso, “Esvaziar carrinho” está na etapa Ação, não em uma ação de botão. Portanto, você precisará selecionar uma etapa de Ação como a próxima etapa para a resposta rápida.

Checkout

E-commerce no Nicochat: Fechando pedidos e finalizando a compra
YouTube
Nota
DICA - para simular o processo de checkout, você também terá que configurar seu Stripe Integration. Veja como configurar o Stripe.

Acabamos de falar que é redundante ter um botão “Esvaziar carrinho” com cada produto, mas por que colocar vários “Checkout”? Isso ocorre porque as ações na etapa Ação são processadas no backend enquanto “Checkout” exige que o frontend abra um site, a página de checkout. Então você só pode chamar "Checkout" em um botão.

Se você não quiser colocar “Checkout” em cada produto, tente adicionar mais uma informação do tipo texto após mostrar o carrinho:

Ao finalizar a compra, uma lista de produtos será exibida primeiro com quantidade e preço, seguida de uma área para deixar os dados de contato do usuário:

Continue rolando para baixo e você verá as opções de entrega, o código do cupom e um resumo do pedido.

Por fim, ao selecionar uma opção de pagamento e clicar em “Pagar $xx.xx”, a página será direcionada para Stripe.com. Se você estiver no modo de texto, verá isto: