KI-Chatbot für Framer-Websites: Der Setup-Guide für 2026

Framer ist zum Standardwerkzeug für Gründer geworden, die eine Marketing-Site wollen, die wirklich live geht. Klare Typografie, saubere CMS-Strukturen, weiche Animationen — alles ohne eine einzige Zeile React. Aber sobald der erste Besucher mit einer Frage ankommt, hört Framer auf, zu helfen: kein eingebauter Live-Chat, kein FAQ-Widget, und die wenigen Community-Plug-ins sind entweder einfache E-Mail-Formulare oder hinter Enterprise-Preisen versteckt.

Diese Lücke kostet Geld. Der Großteil der B2B-Kaufentscheidungen fällt lange bevor jemand mit dem Vertrieb spricht — meist zu Uhrzeiten, an denen niemand das Postfach beobachtet. Eine statische FAQ-Seite ist ein Grabstein für Deals: Leute überfliegen, finden nichts zu ihrer konkreten Situation und schließen den Tab.

Ein echter KI-Chatbot schließt die Lücke. Kein Entscheidungsbaum aus 2018, sondern ein LLM-gestützter Assistent, der Ihre Docs, Ihre Preise, Ihre Case Studies liest und mit Quellen antwortet. Speziell für Framer hat der richtige Chatbot drei Eigenschaften:

1. Keine Build-Zeit-Abhängigkeit — nichts, was im Framer-Projekt installiert wird, keine Custom-Code-Komponente, kein Next.js-Re-Export. Ein einzelnes Embed-Script, fertig.
2. Funktioniert mit Framer-CMS-Inhalten — crawlt Ihre veröffentlichte Framer-Site und bleibt synchron, wenn Sie neue Seiten ausliefern.
3. Passt zu Ihrem visuellen System — Framer-Designer sind gnadenlos mit Markenfragen. Ein Chatbot, der wie eine 2019er-Support-Blase aussieht, wird sofort wieder entfernt.

Chatloom wurde genau für diese drei Bedingungen gebaut — und das ist der Grund, warum der Name 2026 so häufig in Slack-Channels von Framer-Gründern auftaucht.

Der schnellste Weg ist das Custom-Code-Embed, verfügbar in jedem Framer-Tarif inklusive des kostenlosen Hobby-Plans. Der komplette Ablauf hat vier Schritte und dauert unter drei Minuten, sobald Sie einen Chatloom-Account haben:

Agent anlegen → Framer-Site crawlen → Embed kopieren → In Framer Custom Code einfügen → Publish

1. Agent anlegen. Bei chatloom.app registrieren, dem Agenten einen Namen geben, Modell wählen (GPT-4.1 Mini ist der Default und beantwortet 95 % aller Marketing-Site-Fragen für Cent-Beträge pro Monat).
2. Framer-Site verknüpfen. Der Chatloom-Crawler nimmt Ihre veröffentlichte Framer-URL (ihredomain.framer.website oder Ihre Custom-Domain) und indexiert jede erreichbare Seite. Für eine typische 12-Seiten-Site sind das etwa 90 Sekunden. Der Crawler respektiert robots.txt und hält Rate-Limits ein, sodass Framers eigener Bot-Schutz nicht auslöst.
3. Embed-Snippet holen. Im Agent-Dashboard Install → Custom embed öffnen und das dreizeilige Script kopieren:

<script>
  window.CHATLOOM_AGENT_ID = "agt_xxxxxxxxxxxxxxxx";
</script>
<script async src="https://chatloom.app/widget.js"></script>

1. In Framer einfügen. Framer-Projekt öffnen, Site Settings → General → Custom Code, Snippet in End of body einfügen. Speichern, publishen. Das Widget erscheint global auf jeder Seite — auch auf allen, die Sie künftig hinzufügen.

Das ist der komplette Entwicklerpfad. Kein npm, keine API-Route, kein Framer-Plug-in zur Freigabe. Das Widget liegt auf Chatlooms CDN und aktualisiert sich selbst. Sie fassen diesen Code nie wieder an.

Framer-Designer haben eine Obsession: Der Chatbot darf nicht aufgesetzt wirken. Genau dafür wurde der Chatloom-Widget-Builder gebaut. Jede visuelle Eigenschaft, die zählt, ist ein Control — kein CSS-Klassenname.

Im Bereich Widget konfigurieren Sie:

• Launcher-Modus — Button, Compact Panel, Fullscreen-Overlay oder Sidebar. Fullscreen funktioniert auf Framer-Landingpages hervorragend, weil es das Hero-Viewport respektiert und den Hintergrund sauber ausblendet.
• Markenfarben — Primär, Akzent, Surface. Die komplette Chat-Oberfläche (Header, Bubbles, Vorschläge, Typing-Indicator) rendert sich in Echtzeit neu.
• Radius der Ecken — Framers 12px-Default treffen, für editoriale Sites schärfer, für verspielte Marken vollständig rund.
• Custom Fonts — eigene .woff2 hochladen oder aus Google Fonts wählen. Auf Marketing-Sites wird die Schlacht über Schrift gewonnen, und genau das ist das meistgewünschte Feature in der Framer-Community.
• Icon & Avatar — Ihr Brand Mark als transparentes PNG. Der Launcher respektiert Alphakanäle und rendert retinascharf.
• Chat-Hintergrund — Gradient, Volltonfarbe oder Bild. Kombiniert mit dem Framer-Hero wirkt das Widget wie Teil der Seite, nicht wie ein Drittanbieter-Einbau.

Jeder Builder-Abschnitt hat einen Test Live-Button, der das echte Widget in einer simulierten Viewport-Größe öffnet. Nichts ausliefern, was den Test Live nicht bestanden hat.

Ein Chatbot mit leerer Wissensbasis ist schlimmer als kein Chatbot — er erfindet Antworten und vertreibt Besucher. Framer-Sites lassen sich ungewöhnlich gut trainieren, weil die Inhalte bereits strukturiert sind: Hero-Sections haben klare Überschriften, CMS-Items konsistente Felder, Preis-Tabellen leben in Framers eigenen Komponenten.

Chatloom bietet vier Ingestion-Wege, und alle vier funktionieren auf einem Framer-Projekt:

1. Crawl — einmal die Framer-Domain einfügen, Chatloom läuft die Sitemap ab, zieht den Hauptinhalt, entfernt die Framer-UI-Umgebung (Navbar, Cookie-Banner, Footer) und chunked den Rest für RAG. Deckt allein schon 80 % der Marketing-Fragen ab.
2. Sitemap-Upload — wenn die Site passwortgeschützt ist oder Sie eine Teilmenge trainieren wollen, laden Sie eine sitemap.xml hoch und wählen die URLs.
3. PDF- und Doc-Upload — Pitch Deck, Onepager, Preisliste, Onboarding-Doc. Chatloom parst sie mit derselben Embedding-Pipeline wie den Crawl.
4. Manueller Text — für die nuancierten Antworten, die noch nicht auf der Site stehen („Was passiert, wenn ich mitten in der Testphase kündige?"). Diese werden zu First-Class-Chunks und schlagen im Zweifel den Crawl.

Die Hybrid-Search-Engine darunter (dichte Vektoren + BM25 + Reciprocal Rank Fusion + Cohere-Reranker) sorgt dafür, dass Sie nicht über Keyword-Überschneidungen nachdenken müssen. „Wie downgrade ich?" findet die richtige Antwort, auch wenn Ihre Docs „Tarif wechseln" schreiben.

KI ist auf einer Framer-Site nicht das ganze Produkt. Sobald der Bot einem ernsthaften Käufer begegnet, muss er sich zurückziehen. Chatloom liefert drei Eskalationspfade eingebaut:

Menschliche Übergabe. Jede Konversation kann von einem menschlichen Operator in der Chatloom-Inbox übernommen werden. Der Operator sieht das komplette Transkript, den Seitenpfad des Besuchers (also welche Section der Framer-Site den Chat ausgelöst hat) und die Confidence-Scores der KI. Framer-Gründer übernehmen das typischerweise im ersten Monat selbst und delegieren es danach an einen Freelancer oder Contract-SDR.

Lead-Capture. Der Bot sammelt Name, E-Mail und ein, zwei qualifizierende Fragen in natürlicher Konversation und pusht den Lead via Webhook, Zapier oder direkter HubSpot/Pipedrive-Integration ins CRM. Ohne Formular.

Kalender-Booking. Cal.com- oder Calendly-Link im System-Prompt hinterlegen, und der Bot verteilt Buchungs-URLs, sobald der Käufer Dinge sagt wie „Kann ich eine Demo bekommen?" oder „Wie fange ich an?". Für High-Intent-Sales konvertiert das dramatisch besser als ein statischer „Demo buchen"-Button in der Nav.

Alle drei Pfade teilen denselben Konversations-Datensatz. Wenn die KI die ersten drei Nachrichten beantwortet hat und der Mensch ab Nachricht vier übernimmt, bekommt das CRM die komplette Historie — kein „Können Sie wiederholen, was Sie dem Bot gesagt haben?"-Moment.

Hier machen sich Framer-Gründer typischerweise auf das Intercom-Angebot gefasst. Die Ökonomie ist mittlerweile völlig anders.

Chatloom Free (0 $/Monat) deckt 100 KI-Nachrichten pro Monat, unbegrenzte Seiten-Crawls, Branding und das Embed-Script ab. Für eine Framer-Landingpage mit Waitlist reicht das tatsächlich.

Chatloom Starter (29 $/Monat) schaltet 2.000 Nachrichten, Live-Chat-Übergabe, Analytics, CRM-Webhooks frei und entfernt das „Powered by Chatloom"-Badge. Auf diese Stufe wechseln die meisten Gründer, sobald echter Traffic kommt.

Chatloom Pro (99 $/Monat) ergänzt Custom Model Routing, Priority Support, höhere Nachrichten-Limits und Multi-Seat-Zugriff — nützlich, sobald ein Contract-SDR oder eine Teilzeit-Support-Person die Inbox mitbenutzt.

Vergleichen Sie das mit den Platzhirschen:

Für eine Framer-gebaute Marketing-Site stehen diese Zahlen in keinem Verhältnis zum Traffic. Die Break-even-Rechnung ist freundlicher, als viele denken: Auf Starter-Niveau rechnet sich der Chatbot schon, wenn er zwei E-Mails pro Monat abfängt, die sonst an eine 75 $/Stunde-Freelance-VA gegangen wären. In der Praxis ist das Verhältnis eher 40 zu 1.