Claude zu HubSpot: Claude verbinden und Ihre Website bauen

Claude to HubSpot Connector

„Claude zu HubSpot“ meint meist eines von zwei Dingen. Entweder soll Claude in HubSpot mitarbeiten: Deals nachschlagen, Kampagnen zusammenfassen, E-Mails entwerfen, Datensätze aktualisieren. Oder Sie haben etwas mit Claude gebaut, in Claude Design, Claude Code oder im Chat, und daraus soll eine HubSpot-Website werden, die Ihr Marketing-Team selbst betreibt.

Dieser Leitfaden behandelt beides: zuerst, wie Sie Claude mit HubSpot verbinden und was der Konnektor kann, dann die Wege von einem Claude-Build zu einem HubSpot-Theme.

Teil 1: Claude mit HubSpot verbinden

HubSpot bietet zwei offizielle Verbindungen zu Claude, für zwei verschiedene Aufgaben.

Der HubSpot-Konnektor für Claude (für alle)

HubSpot hat seinen Konnektor für Claude im Juli 2025 gestartet, als ersten CRM-Konnektor für Claude. Seitdem ist er stark gewachsen. Laut HubSpot-Dokumentation, zuletzt aktualisiert im September 2026, kann Claude jetzt lesen und schreiben:

  • CRM-Datensätze: Kontakte, Unternehmen, Deals, Tickets und benutzerdefinierte Objekte
  • Marketing-E-Mails, Landingpages, Blogbeiträge und Website-Seiten
  • Anrufe, Meetings, Notizen, Aufgaben und E-Mails
  • Produkte, Angebote, Rechnungen und Bestellungen

Was Sie brauchen: einen kostenpflichtigen Claude-Plan (Pro, Max, Team oder Enterprise) und einen HubSpot-Account in beliebiger Edition, auch das kostenlose CRM. Ein Super-Admin muss den Konnektor freigeben und festlegen, auf welche Daten er zugreifen darf.

So richten Sie ihn ein: Öffnen Sie in Claude Einstellungen → Konnektoren, suchen Sie HubSpot, fügen Sie ihn hinzu und verbinden Sie Ihren Account.

Grenzen, die Sie kennen sollten: Massenänderungen sind auf 10 Datensätze pro Vorgang begrenzt, Claude kann nichts löschen, und sensible Daten bleiben außen vor. Jede Aktion wird im Audit-Log von HubSpot unter dem Benutzer und dem Konnektor protokolliert. HubSpot empfiehlt, Schreibwerkzeuge vor der Ausführung um Bestätigung fragen zu lassen, und das empfehlen wir auch.

Der Developer-MCP-Server (für Entwickler)

Für die Entwicklung auf HubSpot gibt es einen separaten, lokalen Developer-MCP-Server, allgemein verfügbar seit Februar 2026. Sie installieren ihn über die HubSpot CLI mit hs mcp setup, und er gibt Claude Code Werkzeuge, um CMS-Themes, Templates und Module zu erstellen und zu verwalten, dazu Apps und Serverless Functions.

Über diese Verbindung baut ein Entwickler mit Claude Code ein HubSpot-Theme. Sie setzt trotzdem jemanden voraus, der HubL, die Template-Sprache von HubSpot, beherrscht und das Ergebnis prüft.

Teil 2: Aus einem Claude-Build eine HubSpot-Website machen

Ob Sie eine Website in Claude Design gestaltet, ein Frontend mit Claude Code gebaut oder eine Seite im Chat bekommen haben: Das Ergebnis ist Code, also HTML, CSS und JavaScript. Eine HubSpot-Website läuft auf einem Theme: Templates, Module, die Ihr Marketing-Team im Drag-and-Drop-Editor hinzufügt, verschiebt und bearbeitet, ein gemeinsamer Header und Footer, ein Blog und Formulare.

Von einem zum anderen führen drei Wege.

1. Eine einzelne Seite mit dem Konnektor importieren

Der HubSpot-Konnektor kann ein Design aus Claude Design als neue HubSpot-Landingpage importieren. Er übernimmt das Design als eine in sich geschlossene HTML-Datei und legt die Seite an. Wird dasselbe Projekt erneut importiert, aktualisiert er diese Seite, statt eine Kopie anzulegen. Derselbe Import funktioniert auch für E-Mails, Social-Media-Grafiken und Blog-Layouts.

Gut für: eine Kampagnen-Landingpage, schnell.

Der Haken: Sie bekommen eine importierte Seite, keine Website. Es gibt keine wiederverwendbaren Module über mehrere Seiten, keinen gemeinsamen Header und Footer und keine Blog-Templates. Wer das Design später ändern will, ändert es in Claude Design und importiert erneut.

2. Ein Theme mit Claude Code und der HubSpot CLI bauen

So geht’s: Übergeben Sie das Projekt an Claude Code, verbinden Sie den HubSpot-Developer-MCP-Server und lassen Sie Claude Code ein Theme schreiben: HubL-Templates, Module mit Feldern, eine theme.json und CSS. Laden Sie es mit der HubSpot CLI hoch und testen Sie es. Diesen Ablauf beschreiben wir in Migration zu HubSpot CMS mit KI und Claude Code.

Gut für: HubSpot-Entwickler, die volle Kontrolle wollen.

Der Haken: Jemand muss HubL beherrschen und jedes Modul prüfen. Die Felder so anzulegen, dass das Marketing einen Abschnitt bearbeiten kann, ohne ihn zu zerstören, ist der langsame Teil. Jede Runde verbraucht außerdem Ihr Claude-Kontingent.

3. Mit transjt in ein natives HubSpot-Theme umwandeln

Für diesen Weg haben wir transjt gebaut: Ein Design oder ein Repository geht hinein, ein natives HubSpot-Theme kommt heraus, mit echten HubL-Modulen, die Ihr Marketing-Team im Drag-and-Drop-Editor bearbeitet.

Aus Claude Code oder Claude Design:

  1. Wenn Sie in Claude Design begonnen haben, übergeben Sie das Projekt an Claude Code.
  2. Bitten Sie Claude Code, das Frontend in React mit Vite, ohne serverseitiges Rendering zu bauen. Das ist die eine Vorgabe, die für die Umwandlung zählt, und Claude Code hält sie ein, wenn Sie sie gleich zu Beginn nennen.
  3. Pushen Sie das Projekt in ein GitHub-Repository.
  4. Verbinden Sie das Repository mit transjt, wählen Sie HubSpot und prüfen Sie die Vorschau.

Über Figma: Wenn Ihr Team Designs in Figma abstimmt, bringen Sie das Design zuerst dorthin, mit Claude Code und dem MCP-Server von Figma oder einem HTML-Import-Tool wie html.to.design, und exportieren Sie es mit dem transjt-Figma-Plugin nach HubSpot.

Was Sie bekommen:

  • Ein natives HubSpot-Theme mit HubL-Modulen, die Ihr Marketing-Team ohne Entwickler neu anordnet.
  • Texte, Bilder und die Reihenfolge der Abschnitte, die sich im HubSpot-Editor ändern lassen.
  • Einen nativen Blog und native Formulare.
  • Layouts für Desktop, Tablet und Mobilgeräte.
  • Fertig in wenigen Stunden, nicht in Wochen.

Gut für: Agenturen und Marketing-Teams, die eine ganze Website in HubSpot wollen, nicht nur eine Seite.

Der Haken: Es ist ein kostenpflichtiges Produkt. Sie können kostenlos starten und die Vorschau sehen, bevor Sie bezahlen; die aktuellen Pläne finden Sie unter Preise.

Die drei Wege im Vergleich

Konnektor-ImportClaude Code + HubSpot CLItransjt
ErgebnisEine Landingpage (oder E-Mail, Blog-Layout)Ein individuelles ThemeEin natives HubSpot-Theme
AufwandMinutenTageWenige Stunden
Nötige KenntnisseKeineHubL und HubSpot-CMS-EntwicklungKeine
Wiederverwendbare ModuleNeinJa, wenn Sie sie bauenJa
Header, Footer, BlogNeinJa, wenn Sie sie bauenJa
Am besten fürEine KampagnenseiteEntwickler, die Kontrolle wollenEine ganze Website, die Ihr Team bearbeitet

Stand: September 2026.

Welchen Weg sollten Sie wählen?

  • Eine Kampagnenseite, schnell: mit dem Konnektor importieren.
  • Sie sind HubSpot-Entwickler: das Theme mit Claude Code und dem Developer-MCP-Server bauen.
  • Ein Team betreibt die ganze Website in HubSpot: mit transjt in ein natives Theme umwandeln.

Behalten Sie den Konnektor, sobald die Website live ist: Dann hilft Claude Ihnen bei CRM, E-Mails und Inhalten auf der Website, die Sie gerade gebaut haben.

Sie arbeiten mit WordPress? Lesen Sie Claude zu WordPress für die Verbindungsmöglichkeiten und die Wege zu einem nativen WordPress-Theme.

Häufige Fragen

Ja. Der offizielle HubSpot-Konnektor für Claude funktioniert mit jeder HubSpot-Edition, auch dem kostenlosen CRM, und braucht einen kostenpflichtigen Claude-Plan. Ein Super-Admin gibt ihn frei und legt fest, auf welche Daten Claude zugreifen darf.

Ship custom HubSpot CMS themes up 17x faster

transjt.ai uses AI to generate production-ready HubSpot CMS themes, cutting build time by up to 80–90%—with clean, editable code and brand-safe components.
Kostenlos starten