Webflow MCP

Webflow MCP

site icon
2025.04.21 0
JavaScriptWebflow 管理自动化工具开发效率
Webflow MCP 是一个基于 Node.js 的服务器,实现了 Model Context Protocol (MCP) 协议,用于与 Webflow API 进行交互。它允许 AI 代理通过 Webflow JavaScript SDK 访问和操作 Webflow 的数据和功能。该服务适用于需要自动化管理 Webflow 网站内容、页面和 CMS 集合的开发者和团队。
View on GitHub

Overview

基本能力

产品定位

Webflow MCP 是一个中间件服务,旨在为 AI 代理提供与 Webflow API 交互的能力,简化 Webflow 网站的管理和自动化操作。

核心功能

  • 站点管理:列出站点、获取站点详情、发布站点变更。
  • 页面管理:列出页面、获取页面元数据、更新页面设置、获取和更新页面内容。
  • CMS 管理:管理集合(创建、获取、更新)、管理集合字段(静态、选项、引用)、管理集合项(创建、更新、发布)。

适用场景

  • 自动化管理 Webflow 网站内容和结构。
  • 批量更新 CMS 集合项。
  • 集成 AI 代理以增强 Webflow 工作流。

工具列表

  • Sites:管理 Webflow 站点。
  • Pages:管理站点页面。
  • CMS:管理 CMS 集合和项。

常见问题解答

  • API 令牌无效:确保从 Webflow API Playground 生成并复制正确的令牌。
  • Node 和 NPM 未安装:确认已安装并配置 Node.js 和 NPM。
  • NPM 缓存问题:尝试清除 NPM 缓存。
  • 全局包权限问题:可能需要修复 NPM 全局包权限。

使用教程

使用依赖

  • 安装 Node.js 和 NPM: shell # 确认安装 node -v npm -v
  • 注册 Webflow 账户并获取 API 令牌。

安装教程

  1. 获取 Webflow API 令牌。
  2. 在 AI 编辑器中配置 MCP 服务器: json { "mcpServers": { "webflow": { "command": "npx", "args": ["-y", "[email protected]"], "env": { "WEBFLOW_TOKEN": "<YOUR_WEBFLOW_TOKEN>" } } } }
  3. 重启 AI 编辑器(如 Cursor 或 Claude Desktop)。

调试方式

  • 确认 API 令牌有效。
  • 检查 Node 和 NPM 版本。
  • 清除 NPM 缓存: shell npm cache clean --force
  • 修复全局包权限(如有必要)。

许可证

该项目遵循 MIT 开源许可条款,请参阅 MIT 了解完整条款。