NNext.js × Asyntai50 mensagens grátis

Chatbot IA para Next.jsUm componente no layout raiz, em todas as páginas.

Tamanhos, frete, trocas, tecidos: seu assistente de IA responde em segundos com base no conteúdo do seu site. Você instala o nextjs-ai-chatbot e coloca um componente no seu layout raiz.

Comece grátis Ver a instalação
Sem cartão de crédito App Router e Pages Router Sem use client
ateliejacaranda.com.br/vestidos/clara
Ateliê Jacarandá
Vestido Clara
R$ 389
Algodão orgânicoTam. 36 a 46Produção responsável
Adicionar ao carrinho
Ateliê JacarandáOnline
Olá! Posso ajudar você a escolher?
Powered by Asyntai
1componente para todas as páginas
24/7atendimento, também à noite
0alterações nas suas páginas
50mensagens grátis para começar
O que ele responde

As perguntas que os clientes fazem antes de comprar

Sua loja em Next.js é rápida, mas os clientes ainda têm dúvidas. O chatbot responde na hora, com o seu próprio conteúdo.

Qual tamanho fica bom em mim?Qual é o tecido?Como devo lavar?Qual é o prazo de entrega?Como funciona a troca?A produção é responsável?
Vocês têm vale-presente?Vocês têm cupom de desconto?Vocês entregam fora do Brasil?Posso parcelar a compra?Onde está o meu pedido?Como falo com vocês?
Recursos

Feito para sites com Next.js

Para lojas, sites de SaaS e documentações com Next.js, também com Fumadocs e Nextra.

Conhece os seus produtos

Ele lê as suas páginas publicadas. Envie PDFs (tabela de medidas, instruções de lavagem, termos) e adicione perguntas e respostas.

Vestido ClaraR$ 389
Blusa HelenaR$ 219
Tabela-de-medidas.pdfLido pela IA

Um componente

Instale o pacote, coloque o AsyntaiChatbot no layout raiz e faça o build.

1linha

Fala o idioma dos seus clientes

Clientes do Brasil, de Portugal ou da Argentina: ele responde no idioma da pergunta.

PTENESFRITDE

Coleta solicitações

Tamanho esgotado, pedido para empresas, dúvida específica: ele pede o e-mail e salva para você.

JS
Juliana S.Vestido Clara no tamanho 46
Novo

Computador e celular

A maioria dos clientes compra pelo celular. A janela do chat se adapta a cada tela.

Você vê o que os clientes querem saber

As conversas mostram quais perguntas se repetem. Assim você melhora as páginas de produto onde é preciso.

Tamanhos38%
Trocas26%
Frete17%

Só o seu conteúdo

A IA responde com base nas suas páginas e documentos. Ela não inventa preços, descontos nem promessas e não responde a perguntas fora do tema.

Você escreve um poema para mim?Só respondo perguntas sobre o Ateliê Jacarandá. Posso mostrar a nossa nova coleção?
Em ação

Um assistente que conhece o seu catálogo

Ele responde com base no seu conteúdo, recomenda os produtos certos e aparece com as cores da sua marca.

  • Respostas das suas páginas

    Tamanhos, tecidos, frete: ele usa os seus próprios dados e não inventa nada.

  • Recomenda produtos

    Ele mostra produtos adequados em cartões, com imagem, preço e link.

  • Encaminha as solicitações

    Para um tamanho em falta ou um pedido para empresas, ele pede o e-mail.

Experimente uma cor
Instalação

Instalação simples no Next.js

A Asyntai tem um componente React próprio para Next.js. Você coloca o componente uma vez no layout raiz, e o chat aparece em todas as páginas.

Copiar o ID do widget

Crie uma conta gratuita na Asyntai e abra a página Install. O seu ID do widget está no código, em data-asyntai-id, e começa com asyntai_.

Instalar o pacote

Execute npm install nextjs-ai-chatbot no seu projeto.

Adicionar o componente

Coloque <AsyntaiChatbot /> com o seu ID do widget no final de <body> em app/layout.tsx, como no exemplo. Com o Pages Router, use pages/_app.js.

Fazer o build e publicar

Faça o build do site e publique. A bolha do chat aparece no canto inferior de todas as páginas.

O componente funciona em Server Components, sem use client. Em vez de escrever o ID do widget no código, você pode defini-lo como NEXT_PUBLIC_ASYNTAI_WIDGET_ID no momento do build.

Seu projeto app/layout.tsx
app/layout.tsx
nextjs-ai-chatbot
import { AsyntaiChatbot } from 'nextjs-ai-chatbot'; <body> {children} <AsyntaiChatbot widgetId="asyntai_SEU_ID" /> </body>
next build
Por que a Asyntai

O que os sites com Next.js ganham

Comece grátis com 50 mensagens e cresça com o seu projeto.

Ver preços Comece grátis
01

Mais vendas

Clientes que recebem resposta rápida sobre tamanho ou frete compram com mais facilidade. Também à noite.

02

Menos e-mails de suporte

O chatbot responde sobre trocas, frete e cuidados com as peças. Sua equipe tem mais tempo.

03

Limpo para desenvolvedores

Um componente, sem use client, e o ID do widget também como variável de ambiente.

FAQ

Perguntas frequentes

Tudo o que você precisa saber para adicionar um chatbot com IA ao seu site Next.js.

Como instalo o chatbot no Next.js?

Execute npm install nextjs-ai-chatbot e coloque <AsyntaiChatbot widgetId="..." /> no final de <body> em app/layout.tsx. Depois, faça o build do site.

Funciona com o Pages Router?

Sim. Com o Pages Router, coloque o mesmo componente em pages/_app.js.

Preciso de use client?

Não. O componente funciona em Server Components. O seu layout não precisa de use client.

Posso definir o ID do widget como variável de ambiente?

Sim. Defina NEXT_PUBLIC_ASYNTAI_WIDGET_ID no .env e escreva <AsyntaiChatbot /> sem widgetId. Defina a variável onde o next build é executado.

Quais versões do Next.js são compatíveis?

Next.js 13.4 e versões mais recentes. Testamos com Next.js 14 e 16.

Funciona com Fumadocs e Nextra?

Sim. Os dois são aplicações Next.js. Coloque o componente no layout raiz, ao lado do provider da documentação.

Como o chatbot conhece o meu conteúdo?

A Asyntai lê as suas páginas publicadas. Informe o endereço do seu site no painel. Você também pode adicionar documentos e perguntas com respostas.

Quanto custa o pacote?

O pacote é gratuito. Na Asyntai, você começa com mensagens grátis e muda para um plano maior quando precisar.

Guia

Como um chatbot com IA ajuda os sites com Next.js

Loja rápida, dúvidas em aberto

O Next.js deixa lojas e sites rápidos. Mesmo assim, antes de comprar, os clientes quase sempre têm dúvidas: Qual tamanho fica bom? Como devo lavar? Como funciona a troca?

Um chatbot com IA responde a essas perguntas na hora, usando as suas próprias páginas como fonte.

Um componente em vez de uma integração

O pacote nextjs-ai-chatbot é um componente React. Você coloca o componente uma vez no layout raiz, e o chat aparece em todas as páginas.

Ele funciona com App Router e Pages Router, em Server Components e com frameworks de documentação como Fumadocs e Nextra.

Menos trocas, mais vendas

Uma boa orientação sobre o tamanho ajuda o cliente a pedir a peça certa logo na primeira compra. Para isso, o chatbot usa a sua tabela de medidas e as suas informações sobre a modelagem.

Quando ele mostra produtos adequados em cartões, os clientes costumam levar uma peça a mais.

Clientes no próprio idioma

O chatbot reconhece o idioma da pergunta e responde automaticamente nesse idioma, mesmo que a sua loja esteja só em português.

Assim você também atende clientes de outros países.

As conversas mostram o que falta no seu site

Cada conversa fica salva e pode ser pesquisada no painel. Depois de algumas semanas, você vê quais perguntas são as mais frequentes.

Com essas pistas, você melhora as páginas de produto e as páginas de informação onde é preciso.

Pronto para um assistente de IA no seu site Next.js?

Comece grátis com 50 mensagens e veja quantas perguntas os seus clientes fazem todos os dias.

Comece grátis Ver preços
Sem cartão de crédito. Cancele quando quiser.
Outras plataformas
Docusaurus Framer Ghost Filament Bubble Webflow Shopify WordPress Todas as plataformas CMS