Integrations
Enables interaction with Webflow APIs, providing tools for managing sites (listing, retrieving details, publishing), pages (listing, getting metadata, updating settings and content), and CMS collections (listing collections, creating and updating collection items).
Offizieller MCP-Server von Webflow
Ein Node.js-Server, der das Model Context Protocol (MCP) für Webflow mithilfe des Webflow JavaScript SDK implementiert. Ermöglicht KI-Agenten die Interaktion mit Webflow-APIs. Weitere Informationen zur Webflow-Daten-API finden Sie in der Entwicklerdokumentation .
ℹ Voraussetzungen
▶️ Schnellstart (gehostet auf Cloudflare-Workern)
Für Cursor:
- Gehen Sie zu
Settings
→Cursor Settings
→MCP
- Klicken Sie auf
+ Add New Global MCP Server
- Fügen Sie die folgende Konfiguration ein (oder fügen Sie den
webflow
-Teil zu Ihrer vorhandenen Konfiguration hinzu)
- Speichern. Cursor öffnet automatisch ein neues Browserfenster mit einer OAuth-Anmeldeseite, um die Webflow-Sites zu autorisieren, auf die der MCP-Server Zugriff haben soll.
Für Claude Desktop:
- Öffnen Sie
Settings
→Developer
- Klicken Sie
Edit Config
- Öffnen Sie
claude_desktop_config.json
in einem Code-Editor und fügen Sie die folgende Konfiguration ein (oder fügen Sie denwebflow
-Teil zu Ihrer vorhandenen Konfiguration hinzu).
- Speichern Sie die Datei und starten Sie Claude Desktop neu (Befehl/Strg + R). Beim Neustart öffnet sich automatisch ein neues Browserfenster mit einer OAuth-Anmeldeseite zur Autorisierung der Webflow-Sites, auf die der MCP-Server Zugriff haben soll.
Für Windsurfen:
- Navigieren Sie zu
Windsurf - Settings
→Advanced Settings
- Scrollen Sie nach unten zum Abschnitt
Cascade
→Add Server
→Add custom server +
- Fügen Sie die folgende Konfiguration ein (oder fügen Sie den
webflow
-Teil zu Ihrer vorhandenen Konfiguration hinzu)
- Klicken Sie auf
Save
. Windsurf öffnet automatisch ein neues Browserfenster mit einer OAuth-Anmeldeseite, um die Webflow-Sites zu autorisieren, auf die der MCP-Server Zugriff haben soll.
Wichtiger Hinweis
Alle diese Methoden basieren auf dem npm-Paket mcp-remote
, das am 30.04.2025 noch als experimentell gilt. Sollten Probleme auftreten und Sie Ihre OAuth-Token zurücksetzen möchten, können Sie vor dem Neustart Ihres MCP-Clients den folgenden Befehl ausführen:
▶️ Schnellstart (lokale Installation)
- Holen Sie sich Ihr Webflow-API-Token
- Gehen Sie zum API-Spielplatz von Webflow
- Anmelden und Token generieren
- Kopieren Sie das Token aus dem Request Generator
- Zu Ihrem KI-Editor hinzufügen
Für Cursor:
- Gehen Sie zu Einstellungen → Cursoreinstellungen → MCP
- Klicken Sie auf
+ Add New Global MCP Server
- Konfiguration einfügen
- Ersetzen Sie
YOUR_WEBFLOW_TOKEN
durch das Token, das Sie zuvor kopiert haben - Cursor speichern und neu starten
Für Claude Desktop:
- Öffnen Sie Einstellungen → Entwickler
- Klicken Sie
Edit Config
- Öffnen Sie
claude_desktop_config.json
in einem Code-Editor und fügen Sie die Konfiguration ein - Ersetzen Sie
YOUR_WEBFLOW_TOKEN
durch das Token, das Sie zuvor kopiert haben. 5. Speichern Sie und starten Sie Claude neu.
❓ Fehlerbehebung
Wenn Sie Probleme beim Starten des Servers in Ihrem MCP-Client, z. B. Cursor oder Claude Desktop, haben, versuchen Sie Folgendes.
Stellen Sie sicher, dass Sie über ein gültiges Webflow-API-Token verfügen
- Gehen Sie zum API Playground von Webflow , melden Sie sich an und generieren Sie ein Token. Kopieren Sie dann das Token aus dem Request Generator
- Ersetzen Sie
YOUR_WEBFLOW_TOKEN
in Ihrer MCP-Clientkonfiguration durch das Token, das Sie kopiert haben - Speichern und starten Sie Ihren MCP-Client neu
Stellen Sie sicher, dass Sie Node und NPM installiert haben
Führen Sie die folgenden Befehle aus, um zu bestätigen, dass Sie Node und NPM installiert haben:
Leeren Sie Ihren NPM-Cache
Manchmal können Probleme mit npx
durch das Leeren Ihres NPM-Cache behoben werden.
Korrigieren Sie die globalen Paketberechtigungen von NPM
Wenn npm -v
bei Ihnen nicht funktioniert sudo npm -v
jedoch schon, müssen Sie möglicherweise die globalen Paketberechtigungen von NPM korrigieren. Weitere Informationen finden Sie in der offiziellen NPM-Dokumentation .
Hinweis: Wenn Sie Änderungen an Ihrer Shell-Konfiguration vornehmen, müssen Sie Ihre Shell möglicherweise neu starten, damit die Änderungen wirksam werden.
🛠️ Verfügbare Tools
Seiten
Seiten
CMS
🗣️ Eingabeaufforderungen und Ressourcen
Diese Implementierung enthält keine prompts
oder resources
aus der MCP-Spezifikation. Dies kann sich jedoch in Zukunft ändern, wenn die Unterstützung durch gängige MCP-Clients breiter wird.
🚧 Entwicklungsmodus
Wenn Sie den Server im Entwicklungsmodus ausführen möchten, können Sie Abhängigkeiten installieren und den Server mit dem folgenden Befehl ausführen:
- Klonen und installieren:
- Fügen Sie Ihr Token zu einer
.env
Datei im Stammverzeichnis des Projekts hinzu:
- Entwicklungsserver starten:
📄 Webflow-Entwicklerressourcen
You must be authenticated.
hybrid server
The server is able to function both locally and remotely, depending on the configuration or use case.
Tools
Interagieren Sie mit Webflow-Sites, -Seiten und -Sammlungen.
- ℹ Voraussetzungen
- ▶️ Schnellstart (gehostet auf Cloudflare-Workern)
- ▶️ Schnellstart (lokale Installation)
- ❓ Fehlerbehebung
- 🛠️ Verfügbare Tools
- 🗣️ Eingabeaufforderungen und Ressourcen
- 🚧 Entwicklungsmodus
Related Resources
Related MCP Servers
- AsecurityAlicenseAqualityEnables browser automation with Puppeteer, supporting navigation, form interactions, and connection to active Chrome instances for comprehensive web page interaction.Last updated -84708TypeScriptMIT License
- AsecurityAlicenseAqualityEnables Claude to interact with Webflow's APIs for managing sites, retrieving information, and executing tasks using natural language.Last updated -24TypeScriptMIT License
- -securityAlicense-qualityA Model Context Protocol server implementation that integrates Wordware flows as tools directly within Claude conversations, supporting features like founder research, lead enrichment, Notion integration, and task solving with Google search.Last updated -50JavaScriptMIT License
- -securityFlicense-qualityA Model Context Protocol server that integrates with AWS CodePipeline, allowing users to manage pipelines through Windsurf and Cascade using natural language commands.Last updated -4TypeScript