Wie Sie den Agenten auf einer Tilda-Website installieren
Schritt für Schritt: Wo Sie den Widget-Code in Tilda einfügen, wie Sie ihn mit dem Warenkorb verbinden, was Sie mit dem Cache tun müssen und wie Sie überprüfen, ob der Agent auf allen Seiten funktioniert.
Tilda ist der häufigste Fall bei unseren Shops: Die Website ist ansprechend, Produkte sind vorhanden, aber niemand ist da, um Fragen zu beantworten. Die Installation dauert fünf Minuten und erfordert keinen Programmierer.
Schritt 1. Code kopieren#
Öffnen Sie im Dashboard „Widget und Link“ und klicken Sie auf „Code kopieren“. Dies ist eine einzelne Zeile der Form <script src="…" async></script>.
Schritt 2. In Tilda einfügen#
- Öffnen Sie in Ihrem Tilda-Konto das gewünschte Projekt.
- Klicken Sie auf „Website-Einstellungen“.
- Gehen Sie zum Abschnitt „Mehr“ → „HTML-Code zum Einfügen in Head/Body“.
- Fügen Sie den Code in das Feld HTML-Code für Body ein (nicht in den Head).
- Speichern Sie.
Danach kommt ein obligatorischer Schritt, der oft vergessen wird: Veröffentlichen Sie alle Seiten erneut. Tilda wendet den Code beim Veröffentlichen an, daher wird das Widget auf nicht veröffentlichten Seiten nicht erscheinen. In der Seitenliste gibt es eine Schaltfläche, um alle auf einmal zu veröffentlichen.
Wenn der Code in das Head-Feld eingefügt wird, lädt das Widget ebenfalls, aber später und mit dem Risiko von Konflikten. Der richtige Ort ist der Body.
Schritt 3. Mit dem Warenkorb verknüpfen#
Wenn Sie einen Tilda-Shop mit eigenem Warenkorb haben, müssen Sie die Zahlung im Chat nicht aktivieren. Geben Sie stattdessen in den Shop-Einstellungen einen Link zum Warenkorb an: Dies ist normalerweise die Adresse der Warenkorbseite Ihrer Website. Der Agent führt den Käufer dorthin, und die Abwicklung erfolgt auf dem gewohnten Weg.
Wenn kein Warenkorb vorhanden ist und Produkte „auf Anfrage“ verkauft werden, aktivieren Sie die Zahlung im Chat – dann bleibt der gesamte Prozess innerhalb der Konversation. Details finden Sie im Artikel Zahlung im Chat.
Schritt 4. Katalog zusammenstellen#
Geben Sie in den Einstellungen die Website-Adresse an und starten Sie die Analyse. Der Crawler liest die Tilda-Produktkarten, einschließlich Preise, Eigenschaften und Fotos, und ermittelt gleichzeitig die Shop-Währung.
Wenn Ihre Produkte nicht im Tilda-Katalog sind, sondern in Blöcken auf Seiten beschrieben werden, findet der Crawler trotzdem Preise und Namen, aber die Produktkarten werden weniger detailliert sein. In diesem Fall hilft der CSV-Import aus dem „Katalog“ – Tilda kann Produkte in eine Datei exportieren.
Der Agent erzählt nicht über das Produkt – er führt zum Produkt#
Hier hört der Chat auf, ein Chat zu sein. Der Käufer fragt „was haben Sie bis dreitausend“, und der Agent antwortet nicht mit einem Textabsatz, sondern mit Produktkarten: Foto, Name, Preis, Schaltfläche. Ein Klick öffnet genau diese Produktseite auf Ihrer Website – im selben Fenster, ohne neuen Tab und ohne Kontextverlust.
Danach befindet sich die Person im gewohnten Tilda-Funnel: Ihre Produktkarte, Ihre „Kaufen“-Schaltfläche, Ihr Warenkorb. Der Agent hat geführt, der Shop hat verkauft.
Eine zweite Sache, die man normalerweise nicht erwartet: Der Agent sieht, welche Seite der Käufer gerade liest. Er erfasst die Produktauszeichnung von der Seite – Name, Artikelnummer, Preis – und versteht die Frage im Kontext. Eine Person steht auf der Produktkarte eines blauen Sessels und schreibt „gibt es Kissen dazu?“ – der Agent weiß, um welchen Sessel es geht, und schlägt vor, was wirklich passt.
Der Produktlink lebt auch dort, wo es keine Website gibt: Wenn die Produktkarte aus einem Instagram- oder TikTok-Post stammt, öffnet die Schaltfläche den ursprünglichen Post. Der Katalog wird aus verschiedenen Quellen zusammengestellt und führt immer dorthin, wo man kaufen kann.
- Öffnen Sie die Website im Inkognito-Modus. Die Chat-Schaltfläche sollte nach ein bis zwei Sekunden in der unteren rechten Ecke erscheinen.
- Stellen Sie eine Frage zum Produkt – der Agent sollte die Produktkarte anzeigen.
- Fragen Sie nach der Lieferung – die Antwort sollte mit Ihren Bedingungen übereinstimmen.
- Überprüfen Sie das Telefon: In der mobilen Version sollte die Schaltfläche den Tilda-Warenkorb nicht überdecken.
Wenn die Schaltfläche etwas Wichtiges überdeckt, ändern Sie ihre Position auf links im Bereich „Widget und Link“.
Chat im Stil der Website#
Tilda-Websites können sowohl hell als auch betont dunkel sein, daher hat das Widget drei Themenmodi: hell, dunkel und „wie beim Besucher“. Letzterer passt sich den Geräteeinstellungen der Person an und ist standardmäßig aktiviert.
Wenn Ihre Website in einem einheitlichen Stil gestaltet ist, stellen Sie dasselbe Thema fest ein – der Chat wird dann nicht mehr als Fremdkörper in der Ecke auffallen. Die Akzentfarbe bleibt dabei in jedem Thema Ihre eigene.
Schritt 5. Überprüfen#
Häufige Probleme#
Widget ist nicht erschienen. Neun von zehn Malen wurden die Seiten nach dem Einfügen des Codes nicht neu veröffentlicht. Veröffentlichen Sie erneut und aktualisieren Sie die Seite mit geleertem Cache.
Widget ist nicht auf allen Seiten sichtbar. Der Code wurde nicht in die Website-Einstellungen, sondern in einen separaten Block T123 auf einer Seite eingefügt. Verschieben Sie ihn in „Website-Einstellungen“ → „Mehr“.
Schaltfläche erscheint mit Verzögerung. Das ist normal: Das Skript wird asynchron geladen, nach dem Hauptinhalt, um die Seite nicht zu verlangsamen.
Konflikt mit einem anderen Chat. Zwei Chats in derselben Ecke überdecken sich gegenseitig. Belassen Sie einen oder verteilen Sie sie auf verschiedene Seiten.
Häufig gestellte Fragen#
Wird ein kostenpflichtiger Tilda-Tarif benötigt?#
Der Code wird in den Website-Einstellungen eingefügt, dies ist bei kostenpflichtigen Tilda-Tarifen verfügbar. Auf dem kostenlosen Tarif wird das Einfügen von beliebigem Code nicht unterstützt – verwenden Sie dann einen Link zum Agenten und platzieren Sie ihn als Schaltfläche auf der Seite.
Verlangsamt das Widget die Website?#
Nein. Das Skript wiegt wenig und wird asynchron geladen, das Chatfenster selbst wird nur beim Klicken auf die Schaltfläche nachgeladen. Dies beeinflusst die Ladegeschwindigkeit der Tilda-Seite nicht.
Kann der Agent nur auf einer Seite platziert werden?#
Ja, fügen Sie den Code nicht in die Website-Einstellungen, sondern in den Block „T123 HTML“ auf der gewünschten Seite ein. Dies wird zum Beispiel für eine Landingpage eines einzelnen Produkts gemacht.
Funktioniert das mit Tilda Store?#
Ja. Der Agent liest die Produktkarten und den Warenkorb, die Abwicklung überlässt er dem Tilda-Shop: Der Käufer geht mit dem ausgewählten Produkt zu Ihrem Warenkorb.
Wie entferne ich das Widget von der Website?#
Löschen Sie die Codezeile in den Website-Einstellungen und veröffentlichen Sie die Seiten neu. Daten und Dialoge bleiben dabei erhalten, der Link zum Agenten funktioniert weiterhin.
