NNext.js × Asyntai50 Nachrichten gratis

KI-Chatbot für Next.jsEine Komponente im Root-Layout, auf jeder Seite.

Größen, Versand, Rückgabe, Material: Ihr KI-Assistent antwortet in Sekunden aus den Inhalten Ihrer Website. Sie installieren nextjs-ai-chatbot und setzen eine Komponente in Ihr Root-Layout.

Kostenlos starten Zur Installation

Ohne Kreditkarte App Router und Pages Router Ohne use client

linnea-studio.de/kleider/iris

Linnea Studio

Kleid „Iris“

149 €

Bio-BaumwolleGr. 34–44Fair produziert

In den Warenkorb

Linnea StudioOnline

Hallo! Kann ich Ihnen bei der Auswahl helfen?

1Komponente für alle Seiten

24/7Beratung, auch nachts

0Änderungen an Ihren Seiten

50kostenlose Nachrichten zum Start

Was er beantwortet

Die Fragen, die Kunden vor dem Kauf stellen

Ihr Next.js-Shop ist schnell. Kunden haben trotzdem Fragen. Der Chatbot beantwortet sie sofort, mit Ihren eigenen Inhalten.

Welche Größe passt mir?Aus welchem Material ist das?Wie wasche ich das?Wie lange dauert der Versand?Wie funktioniert die Rückgabe?Ist das fair produziert?

Gibt es Gutscheine?Gibt es Rabatte?Liefern Sie ins Ausland?Wie kann ich bezahlen?Wo ist meine Bestellung?Wie erreiche ich Sie?

Funktionen

Gemacht für Next.js-Websites

Für Shops, SaaS-Websites und Dokumentationen mit Next.js, auch mit Fumadocs und Nextra.

Er kennt Ihre Produkte

Er liest Ihre veröffentlichten Seiten. Laden Sie PDFs hoch (Größentabelle, Pflegehinweise, Bedingungen) und fügen Sie Fragen und Antworten hinzu.

Kleid „Iris“149 €

Bluse „Ondine“79 €

Größentabelle.pdfVon der KI gelesen

Eine Komponente

Paket installieren, AsyntaiChatbot ins Root-Layout, bauen.

1Zeile

Spricht die Sprache Ihrer Kunden

Kunden aus Österreich, der Schweiz oder den Niederlanden: Er antwortet in der Sprache der Frage.

DEENNLFRITES

Er sammelt Anfragen

Größe ausverkauft, Firmenbestellung, Rückfrage: Er fragt nach der E-Mail-Adresse und speichert sie für Sie.

Julia L.Kleid „Iris“ in Gr. 44

Neu

Desktop und Smartphone

Die meisten Kunden kaufen am Handy. Das Chatfenster passt sich jedem Bildschirm an.

Sie sehen, was Kunden wissen wollen

Die Gespräche zeigen, welche Fragen immer wieder kommen. So verbessern Sie Ihre Produktseiten gezielt.

Größen38%

Rückgabe26%

Versand17%

Nur Ihre Inhalte

Die KI antwortet aus Ihren Seiten und Dokumenten. Sie erfindet keine Preise, Rabatte oder Zusagen und beantwortet keine fachfremden Fragen.

Schreibst du mir ein Gedicht?Ich beantworte nur Fragen zu Linnea Studio. Darf ich Ihnen unsere neue Kollektion zeigen?

In Aktion

Ein Assistent, der Ihr Sortiment kennt

Er antwortet aus Ihren Inhalten, empfiehlt passende Produkte und erscheint in den Farben Ihrer Marke.

Antworten aus Ihren Seiten
Größen, Material, Versand: Er nutzt Ihre eigenen Angaben und erfindet nichts.
Er empfiehlt Produkte
Er zeigt passende Produkte als Karten, mit Bild, Preis und Link.
Er leitet Anfragen weiter
Für eine fehlende Größe oder Firmenbestellung fragt er nach der E-Mail-Adresse.

Probieren Sie eine Farbe

Installation

Einfache Installation in Next.js

Asyntai hat eine eigene React-Komponente für Next.js. Sie setzen sie einmal in Ihr Root-Layout, dann ist der Chat auf jeder Seite.

Widget-ID kopieren

Erstellen Sie ein kostenloses Asyntai-Konto und öffnen Sie die Seite Install. Ihre Widget-ID steht im Code bei data-asyntai-id und beginnt mit asyntai_.

Paket installieren

Führen Sie in Ihrem Projekt npm install nextjs-ai-chatbot aus.

Komponente einsetzen

Setzen Sie <AsyntaiChatbot /> mit Ihrer Widget-ID ans Ende von <body> in app/layout.tsx, wie im Beispiel. Beim Pages Router nutzen Sie pages/_app.js.

Bauen und veröffentlichen

Bauen Sie die Website und veröffentlichen Sie sie. Die Chat-Blase erscheint auf jeder Seite unten in der Ecke.

Die Komponente funktioniert in Server Components, ohne use client. Statt im Code können Sie die Widget-ID als NEXT_PUBLIC_ASYNTAI_WIDGET_ID beim Build setzen.

Ihr Projekt app/layout.tsx

app/layout.tsx

Paket

nextjs-ai-chatbot

Root-Layout

import { AsyntaiChatbot } from 'nextjs-ai-chatbot'; <body> {children} <AsyntaiChatbot widgetId="asyntai_IHRE_ID" /> </body>

next build

Warum Asyntai

Was Next.js-Websites davon haben

Starten Sie kostenlos mit 50 Nachrichten und wachsen Sie mit Ihrem Projekt.

Preise ansehen Kostenlos starten

Mehr Verkäufe

Kunden, die eine schnelle Antwort zu Größe oder Versand bekommen, kaufen eher. Auch nachts.

Weniger Support-Mails

Fragen zu Rückgabe, Versand und Pflege beantwortet der Chatbot. Ihr Team hat mehr Zeit.

Sauber für Entwickler

Eine Komponente, kein use client, Widget-ID auch per Umgebungsvariable.

FAQ

Häufige Fragen

Alles, was Sie wissen müssen, um Ihrer Next.js-Website einen KI-Chatbot hinzuzufügen.

Wie installiere ich den Chatbot in Next.js?

Führen Sie npm install nextjs-ai-chatbot aus und setzen Sie <AsyntaiChatbot widgetId="..." /> ans Ende von <body> in app/layout.tsx. Bauen Sie dann die Website.

Funktioniert das mit dem Pages Router?

Ja. Beim Pages Router setzen Sie dieselbe Komponente in pages/_app.js.

Brauche ich use client?

Nein. Die Komponente funktioniert in Server Components. Ihr Layout braucht kein use client.

Kann ich die Widget-ID als Umgebungsvariable setzen?

Ja. Setzen Sie NEXT_PUBLIC_ASYNTAI_WIDGET_ID in .env und schreiben Sie <AsyntaiChatbot /> ohne widgetId. Setzen Sie die Variable dort, wo next build läuft.

Welche Next.js-Versionen werden unterstützt?

Next.js 13.4 und neuer. Wir testen mit Next.js 14 und 16.

Funktioniert das mit Fumadocs und Nextra?

Ja. Beide sind Next.js-Apps. Setzen Sie die Komponente in das Root-Layout, neben den Provider der Doku.

Woher kennt der Chatbot meine Inhalte?

Asyntai liest Ihre veröffentlichten Seiten. Geben Sie die Adresse Ihrer Website im Dashboard ein. Zusätzlich können Sie Dokumente sowie Fragen und Antworten hinzufügen.

Was kostet das Paket?

Das Paket ist kostenlos. Bei Asyntai starten Sie mit kostenlosen Nachrichten und wechseln bei Bedarf in einen größeren Plan.

Ratgeber

Wie ein KI-Chatbot Next.js-Websites hilft

Schneller Shop, offene Fragen

Next.js macht Shops und Websites schnell. Doch Kunden haben vor dem Kauf fast immer Fragen: Welche Größe passt? Wie wasche ich das? Wie läuft die Rückgabe?

Ein KI-Chatbot beantwortet diese Fragen sofort, mit Ihren eigenen Seiten als Quelle.

Eine Komponente statt Integration

Das Paket nextjs-ai-chatbot ist eine React-Komponente. Sie setzen sie einmal ins Root-Layout, dann ist der Chat auf jeder Seite.

Sie funktioniert mit App Router und Pages Router, in Server Components und mit Doku-Frameworks wie Fumadocs und Nextra.

Weniger Retouren, mehr Verkäufe

Gute Beratung zur Größe hilft, dass Kunden gleich das Richtige bestellen. Der Chatbot nutzt dafür Ihre Größentabelle und Ihre Hinweise zur Passform.

Zeigt er passende Produkte als Karten, kaufen Kunden oft ein Teil mehr.

Kunden in ihrer Sprache

Der Chatbot erkennt die Sprache der Frage und antwortet automatisch in dieser Sprache, auch wenn Ihr Shop nur auf Deutsch ist.

So beraten Sie auch Kunden aus dem Ausland.

Gespräche zeigen, was Ihrer Website fehlt

Jedes Gespräch wird gespeichert und ist im Dashboard durchsuchbar. Nach einigen Wochen sehen Sie, welche Fragen am häufigsten kommen.

Mit diesen Hinweisen verbessern Sie Ihre Produktseiten und Infoseiten gezielt.

Bereit für einen KI-Assistenten auf Ihrer Next.js-Website?

Starten Sie kostenlos mit 50 Nachrichten und sehen Sie, wie viele Fragen Ihre Kunden jeden Tag stellen.

Kostenlos starten Preise ansehen

Andere Plattformen

Vendure Payload CMS Gatsby Nuxt Astro Eleventy Jekyll Shopify Webflow Framer Lightspeed Alle Plattformen