Tích hợp Máy chủ MCP Webflow

Máy chủ “Webflow” MCP làm gì?

Máy chủ MCP Webflow là một tầng tích hợp giúp các trợ lý AI như Claude tương tác với API của Webflow. Bằng cách kết nối mô hình AI với Webflow, máy chủ này cho phép lập trình viên và các công cụ hỗ trợ AI truy cập, truy vấn và thao tác dữ liệu trang Webflow một cách tự động. Các tính năng chính bao gồm lấy thông tin chi tiết về các trang Webflow như tên trang, ID, domain, cài đặt địa phương hóa, và nhiều hơn nữa. Điều này giúp nâng cao quy trình phát triển bằng cách cho phép quản lý trang tự động, phân tích dữ liệu và tương tác theo ngữ cảnh trực tiếp từ nền tảng AI, giúp các nhóm dễ dàng tích hợp nguồn lực Webflow vào chuỗi công cụ và quy trình tự động hóa của mình.

Danh sách Prompt

Không có mẫu prompt nào được đề cập trong kho lưu trữ.

Danh sách Nguồn lực

Không có nguồn lực cụ thể nào được liệt kê trong tài liệu hoặc mã nguồn.

Danh sách Công cụ

• get_sites

  • Lấy danh sách tất cả các trang Webflow mà người dùng xác thực có quyền truy cập. Trả về các chi tiết như tên hiển thị, tên ngắn, ID trang và workspace, ngày tạo và cập nhật, URL xem trước, múi giờ, domain tùy chỉnh, cài đặt địa phương hóa, và các tùy chọn thu thập dữ liệu.

• get_site

  • Lấy thông tin chi tiết về một trang Webflow cụ thể, được xác định qua siteId. Trả về cùng bộ thông tin chi tiết như get_sites nhưng chỉ cho một trang.

Các trường hợp sử dụng của MCP Server này

• Khám phá trang Webflow
  • Lập trình viên hoặc AI agent có thể nhanh chóng liệt kê tất cả các trang Webflow liên kết với tài khoản, giúp quản lý nhiều dự án web dễ dàng hơn.
• Quản lý trang tự động
  • Lấy và giám sát metadata (như ngày xuất bản, domain tùy chỉnh, và ngôn ngữ) cho một hoặc nhiều trang, giúp đơn giản hóa các tác vụ quản trị.
• Tương tác AI theo ngữ cảnh
  • Trợ lý AI có thể lấy thông tin chi tiết về trang để trả lời câu hỏi của người dùng hoặc thực hiện các quy trình tự động dựa trên cấu hình trang hiện tại.
• Tích hợp với pipeline CI/CD
  • Sử dụng thông tin trang trong các quy trình tự động triển khai, xuất bản hoặc phân tích trong chuỗi phát triển tổng thể.

Cách thiết lập

Windsurf

Không có hướng dẫn riêng cho Windsurf trong kho lưu trữ.

Claude

1. Yêu cầu chuẩn bị
   • Đảm bảo đã cài đặt Node.js (v16+).
   • Đã cài đặt Ứng dụng Claude Desktop.
   • Lấy Webflow API Token.
2. Cài đặt các thư viện cần thiết
   • Chạy: npm install
3. Cấu hình biến môi trường
   • Tạo file .env với nội dung:

     WEBFLOW_API_TOKEN=your-api-token
     

4. Cấu hình Claude Desktop
   • Mở file cấu hình của Claude:
     • Trên MacOS: ~/Library/Application Support/Claude/claude_desktop_config.json
     • Trên Windows: %AppData%\Claude\claude_desktop_config.json
   • Thêm/cập nhật:

     {
         "mcpServers": {
             "webflow": {
                 "command": "node",
                 "args": [
                     "/ABSOLUTE/PATH/TO/YOUR/build/index.js"
                 ],
                 "env": {
                     "WEBFLOW_API_TOKEN": "your-api-token"
                 }
             }
         }
     }
     

   • Lưu và khởi động lại Claude Desktop.

Bảo mật API Key (ví dụ env):

{
    "mcpServers": {
        "webflow": {
            "command": "node",
            "args": [
                "/ABSOLUTE/PATH/TO/YOUR/build/index.js"
            ],
            "env": {
                "WEBFLOW_API_TOKEN": "your-api-token"
            }
        }
    }
}

Cursor

Không có hướng dẫn riêng cho Cursor trong kho lưu trữ.

Cline

Không có hướng dẫn riêng cho Cline trong kho lưu trữ.

Cài đặt qua Smithery

• Chạy:

  npx -y @smithery/cli install @kapilduraphe/webflow-mcp-server --client claude
  

Cách sử dụng MCP này trong flow

Sử dụng MCP trong FlowHunt

Để tích hợp máy chủ MCP vào workflow FlowHunt của bạn, hãy bắt đầu bằng cách thêm thành phần MCP vào flow và kết nối nó với AI agent của bạn:

Nhấp vào thành phần MCP để mở bảng cấu hình. Trong phần cấu hình MCP hệ thống, hãy nhập thông tin máy chủ MCP của bạn theo định dạng JSON sau:

{
  "webflow": {
    "transport": "streamable_http",
    "url": "https://yourmcpserver.example/pathtothemcp/url"
  }
}

Khi đã cấu hình xong, AI agent có thể sử dụng MCP này như một công cụ với đầy đủ chức năng. Lưu ý đổi “webflow” thành tên thật của máy chủ MCP của bạn và thay URL bằng địa chỉ máy chủ MCP của bạn.

Tổng quan

Dựa trên hai bảng tổng hợp trên, Máy chủ MCP Webflow cung cấp công cụ rõ ràng và hữu ích cho tích hợp Webflow/AI, nhưng thiếu mẫu prompt, định nghĩa nguồn lực và chưa hỗ trợ rõ ràng cho roots hoặc sampling. Việc thiết lập và tài liệu rất tốt cho Claude, nhưng các nền tảng khác chưa được hướng dẫn.

Điểm MCP