Was als überschaubares Projekt begann — ein KI-Chat auf der Website eines Kunden — wurde zu einem Lehrstück darüber, wie viel Handarbeit zwischen "die Plattformen können das alle" und "es funktioniert auf einer echten Kundenwebsite" liegt.

Der Ausgangspunkt

Die Tauros Diagnostik in Bielefeld ist seit über 25 Jahren auf veterinärmedizinische Analysen spezialisiert, vor allem DNA-Tests für Vögel und Fische. Auf der neuen Website sollte ein Chat eingebaut werden, der Kunden bei typischen Fragen unterstützt: Probenversand, benötigtes Material, Preise. Die Wahl fiel auf Mistral als KI-Provider — französischer Anbieter, EU-Datenhaltung, sauber dokumentierte API. Ein Pluspunkt für DSGVO-sensible Kunden im Tiergesundheitsbereich.

Stolperstein eins: Drei verschiedene Agent-Welten

Der erste Plan war pragmatisch: ein etabliertes WordPress-Plugin nehmen, das Mistral als Provider unterstützt. API-Key eintragen, Agent-ID rein, fertig.

Was die Mistral-Dokumentation nicht sofort verrät: Mistral hat drei verschiedene "Agent"-Welten, die nicht miteinander kompatibel sind. Le Chat (chat.mistral.ai) ist das Endnutzer-Interface mit komfortabler GUI für Wissensdokumente — aber Le-Chat-Agenten sind nicht über die API ansprechbar. Die Console (console.mistral.ai) ist der Developer-Hub, hier liegen die API-fähigen Agenten. Und schließlich gibt es noch direkt per API erstellte Agenten ohne GUI.

Die Trennung kostete einen Tag. Lösung: Den Agenten in der Console anlegen und dort die Document Library als Tool zuweisen. Nicht zu verwechseln mit "Document AI", das eine völlig separate OCR-Funktion ist.

Stolperstein zwei: Falscher API-Endpoint

Mit dem Agenten in der Console sollte alles funktionieren. Tat es aber nicht — der Chat antwortete generisch ohne Tauros-Kontext. Mistral hat zwei API-Endpoints: /v1/chat/completions für klassische Modell-Calls und /v1/conversations für Agent-Aufrufe mit agent_id. Nur der zweite nutzt automatisch die in der Console konfigurierten Instructions, Tools und Document Library.

Die gängigen WordPress-AI-Plugins sprechen alle nur den ersten Endpoint. Sie können Mistral als Modell verwenden, ignorieren aber die komplette Agent-Konfiguration. Wer den Mistral-Agenten als zentrale Konfigurationsstelle nutzen will, fliegt durchs Raster.

Die Entscheidung: Eigenes Plugin

Statt weiter im Plugin-Ökosystem zu suchen, entschieden wir uns für einen Eigenbau. Ein schlankes Plugin mit klar definiertem Job: einen REST-Endpoint in WordPress bereitstellen, der Anfragen an die Mistral Conversations API weiterreicht. Plus ein simples Chat-Widget im Frontend.

Architektur:

• Backend (PHP): Settings-Page, REST-Endpoint mit Nonce-Schutz, wp_remote_post gegen Mistral, Rate-Limiting pro IP
• Frontend (Vanilla JS): floatender Button, klickbares Chat-Fenster, DSGVO-Hinweis als Info-Popup. Bewusst kein React, kein Build-Step
• Sicherheit: API-Key bleibt strikt serverseitig

Erste Version stand nach einem halben Tag. Die nächsten zwei Tage gingen für Detail-Probleme drauf.

Die Detail-Probleme

Tool-Citation-IDs im Antworttext. Mistral hängt bei RAG-Antworten interne Referenz-IDs an, die wie kryptische UUIDs aussehen. Die landeten zunächst im sichtbaren Text. Lösung: strikt nach Output-Typ text filtern und Tool-Reference-Chunks ignorieren.

Markdown-Rendering. Mistral antwortet konsistent in Markdown. Anfangs zeigte das Widget rohen Text mit sichtbaren ### und **-Zeichen. Mit marked.js als Parser und DOMPurify als Sanitizer wird der Bot-Output sauber gerendert, mit eng kontrollierter Tag-Whitelist gegen XSS-Risiken.

Theme-CSS-Konflikte. Die Tauros-Website nutzt Avada — ein Theme, das mit aggressivem CSS auf alles zugreift. Listen bekamen riesige Abstände, Überschriften unerwartete Größen. Drei Override-Runden mit immer aggressiveren !important-Regeln brachten nur Teilerfolge. Die strukturelle Lösung: Shadow DOM. Das gesamte Widget rendert seitdem in einem abgeschotteten DOM-Bereich, in den kein Theme-CSS eindringen kann. Einmaliger Umbau von etwa einer Stunde — danach funktioniert das Widget auf jedem Theme identisch.

Antwortzeiten. Mit mistral-medium-latest lagen die Antwortzeiten bei über 20 Sekunden. Statt Streaming einzubauen (komplex auf gemeinsamen Hosting-Setups), reichten zwei einfache Hebel: Modellwechsel auf mistral-small-latest und Antwortlängenbegrenzung auf 80 Wörter per System-Prompt. Ergebnis: 3-5 Sekunden pro Antwort.

Branding: Der Papagei

Der Kunde wünschte sich statt eines generischen Buttons einen erkennbaren Papageienkopf — Tauros Diagnostik macht vor allem DNA-Analysen für Vögel. Das vorhandene Firmenlogo ließ sich als PNG ohne weiteres einbinden. Der Bilddatei-Pfad ist im Plugin austauschbar: anderes Logo, anderer Untertitel, andere Akzentfarbe per CSS-Variable — kein Code-Eingriff nötig.

Das Ergebnis

Der Chat läuft produktiv auf der Tauros-Website. Aus Kundensicht: ein einladender Button mit dem firmeneigenen Logo, der ein freundliches Chat-Fenster öffnet. Der Bot kennt die Tauros-Wissensbasis, antwortet in 3-5 Sekunden, formatiert sauber als Markdown und respektiert ein DSGVO-konformes Setup mit Hinweis-Popup.

Aus Entwicklersicht: ein knapp 700 Zeilen kleines Plugin mit klar definiertem Job. Die Architektur lässt sich auf andere Kunden übertragen — andere agent_id, andere Akzentfarbe, anderes Logo per Datei-Tausch.

Fazit

Mistral als KI-Provider funktioniert. Die API ist solide, die Latenz im EU-Rechenzentrum gut, die Qualität für FAQ-Use-Cases mehr als ausreichend. Was am Anfang nicht intuitiv ist: die drei Agent-Welten und die Trennung zwischen Modell-Calls und Conversation-Calls.

Den entstandenen Plugin-Code nutzen wir inzwischen als wiederverwendbaren Baustein für weitere Kundenprojekte. Bei Fragen zur Umsetzung eines ähnlichen Projekts — gerne melden.