项目简介

Webflow MCP Server 是一个基于 Model Context Protocol (MCP) 构建的服务器，旨在连接 Anthropic 的 Claude 桌面应用与 Webflow API。通过此服务器，Claude 可以调用预定义的工具来获取 Webflow 站点的信息，从而扩展 Claude 在网页内容管理和网站信息查询方面的能力。

主要功能点

获取站点列表 (get_sites): 允许 Claude 获取与 Webflow 用户账户关联的所有站点的基本信息，例如站点名称、ID、创建日期、预览 URL 等。
获取站点详情 (get_site): 允许 Claude 通过站点 ID 获取指定站点的详细信息，包括工作区信息、创建和发布日期、自定义域名、本地化设置等。

通过这些工具，用户可以通过 Claude 自然语言交互的方式，查询和了解其 Webflow 站点的信息。

安装步骤

安装 Node.js: 确保你的电脑上已安装 Node.js (v16 或更高版本)。
获取 Webflow API Token:
- 登录你的 Webflow 账户。
- 进入你的站点设置，找到 "Apps & Integrations" 或 "集成" 选项。
- 创建一个新的 API token 并复制 token 值。
下载仓库代码: 从 GitHub 克隆或下载此仓库的代码到本地。
安装依赖: 在项目根目录下打开终端，运行以下命令安装项目依赖：
```
npm install
```
配置环境变量:
- 在项目根目录下创建 '.env' 文件。
- 在 '.env' 文件中添加以下内容，并将 'your-api-token' 替换为你之前复制的 Webflow API token：
```
WEBFLOW_API_TOKEN=your-api-token
```

服务器配置

要将此 MCP 服务器连接到 Claude 桌面应用，你需要编辑 Claude 的配置文件 'claude_desktop_config.json'。

配置文件路径：

MacOS: '~/Library/Application\ Support/Claude/claude_desktop_config.json'
Windows: '%AppData%\Claude\claude_desktop_config.json'

配置内容：

在 'claude_desktop_config.json' 文件中，找到 '"mcpServers"' 部分（如果不存在则创建），并添加或更新 "webflow" 服务器的配置。请注意，你需要将 '/ABSOLUTE/PATH/TO/YOUR/build/index.js' 替换为你本地 'webflow-mcp-server' 项目 'build/index.js' 文件的绝对路径。

{
    "mcpServers": {
        "webflow": {
            "command": "node",
            "args": [
                "/ABSOLUTE/PATH/TO/YOUR/build/index.js"  // 替换为 build/index.js 的绝对路径
            ],
            "env": {
                "WEBFLOW_API_TOKEN": "your-api-token" // 此处可以留空，因为已经在 .env 文件中配置
            }
        }
    }
}

配置参数说明：

'"webflow"': 服务器名称，在 Claude 中用于标识和调用此服务器。
'"command": "node"': 启动服务器的命令，这里使用 Node.js 运行时。
'"args": ["/ABSOLUTE/PATH/TO/YOUR/build/index.js"]': 启动命令的参数，指向服务器入口文件 'build/index.js' 的绝对路径。请务必替换为你的实际路径。
'"env": { "WEBFLOW_API_TOKEN": "your-api-token" }': 传递给服务器的环境变量。虽然这里可以配置 'WEBFLOW_API_TOKEN'，但更推荐在 '.env' 文件中配置。

保存 'claude_desktop_config.json' 文件后，重启 Claude 桌面应用 以加载新的服务器配置。

基本使用方法

配置完成后，你可以在 Claude 中通过自然语言指令来使用 Webflow 工具。例如：

询问 Claude 列出你的 Webflow 站点：

使用 webflow 工具，列出我的所有站点。

询问 Claude 获取特定站点的详细信息（假设站点 ID 为 "站点ID"）：

使用 webflow 工具，获取站点 ID 为 "站点ID" 的站点详情。

Claude 将调用 Webflow MCP Server，并使用相应的工具来获取信息，然后将结果以自然语言文本的形式返回给你。

关键词

项目简介

主要功能点

安装步骤

服务器配置

基本使用方法

信息