custom-code-management

bởi webflow

Thêm, xem lại hoặc xóa các tập lệnh tùy chỉnh nội tuyến trên trang Webflow (tối đa 10.000 ký tự). Sử dụng cho phân tích, pixel theo dõi, tiện ích trò chuyện hoặc bất kỳ tùy chỉnh nào…

npx skills add https://github.com/webflow/webflow-skills --skill custom-code-management

Custom Code Management

Add, review, and manage inline custom scripts on a Webflow site — analytics, tracking pixels, chat widgets, or any custom JavaScript.

Important Note

ALWAYS use Webflow MCP tools for all operations:

  • Use Webflow MCP's webflow_guide_tool to get best practices before any other tool call
  • Use Webflow MCP's data_sites_tool with action list_sites to identify available sites
  • Use Webflow MCP's data_scripts_tool with action list_registered_scripts to list all registered scripts
  • Use Webflow MCP's data_scripts_tool with action list_applied_scripts to list scripts applied to pages
  • Use Webflow MCP's data_scripts_tool with action add_inline_site_script to register a new inline script
  • Use Webflow MCP's data_scripts_tool with action delete_all_site_scripts to remove ALL site scripts (no selective delete)
  • Use Webflow MCP's data_scripts_tool with action get_page_script to get custom code for a specific page
  • Use Webflow MCP's data_scripts_tool with action upsert_page_script to add or update page-level custom code
  • Use Webflow MCP's data_scripts_tool with action delete_all_page_scripts to remove all custom code from a page
  • All tool calls must include the required context parameter (15-25 words, third-person perspective)

Instructions

Phase 1: Discovery

  1. Call webflow_guide_tool first — always the first MCP tool call
  2. Get the site: Use data_sites_tool with action list_sites. If only one site, use it automatically.

Phase 2: Analysis

  1. List scripts: Call list_registered_scripts and list_applied_scripts in parallel
  2. Check page-level scripts (if relevant): Use get_page_script for specific pages
  3. Present findings: Name, version, location (header/footer), registration vs application status

Phase 3: Planning & Confirmation

Before any mutation, present the plan and require explicit confirmation:

  • Adding scripts: user must type "add"
  • Removing ALL site scripts: user must type "delete all" (warn: no selective delete)
  • Page-level changes: user must type "update"

Phase 4: Execution

  1. Add site script: add_inline_site_script with displayName, sourceCode, version, location, canCopy
  2. Remove all site scripts: delete_all_site_scripts
  3. Add/update page script: upsert_page_script
  4. Remove page scripts: delete_all_page_scripts

Phase 5: Verification

  1. Re-list scripts to confirm success
  2. Report what changed (name, location, version, char count)
  3. Remind user to publish — suggest using safe-publish skill

Examples

Example 1: View scripts

User: "What scripts are on my site?"

  1. webflow_guide_tooldata_sites_toollist_registered_scripts + list_applied_scripts in parallel
  2. Present summary of all scripts

Example 2: Add Google Tag Manager

User: "Add GTM to my site"

  1. webflow_guide_tooldata_sites_tool → ask for GTM container ID
  2. Preview script, require "add" → add_inline_site_script (header, version "1.0.0")
  3. Verify and remind to publish

Example 3: Remove all scripts

User: "Remove all scripts"

  1. webflow_guide_tooldata_sites_tool → list current scripts
  2. Warn: removes ALL scripts. Require "delete all" → delete_all_site_scripts
  3. Verify and remind to publish

Example 4: Page-specific tracking

User: "Add conversion tracking to my thank-you page"

  1. webflow_guide_tooldata_sites_toolget_page_script to check existing
  2. Preview, require "update" → upsert_page_script
  3. Verify and remind to publish

Guidelines

  • webflow_guide_tool always first — before any other MCP tool
  • No <script> tags — Webflow adds them automatically
  • Max 10,000 characters per script; displayName + version must be unique
  • Site-level scripts (add_inline_site_script) apply to all pages; page-level scripts (upsert_page_script) apply to one page
  • No selective deletedelete_all_site_scripts removes everything; always list scripts first so user knows what will be lost
  • Hosted/external scripts not available via MCP — inline only
  • Recommend header for analytics (GA, GTM); footer for chat widgets and non-critical scripts
  • If displayName + version exists, suggest incrementing the version
  • Always remind users to publish after changes

Thêm skills từ webflow

cms-collection-setup
webflow
Tạo một bộ sưu tập CMS mới trong Webflow với các trường và mối quan hệ được chỉ định. Sử dụng khi thiết lập bài viết blog, sản phẩm, thành viên nhóm, danh mục đầu tư hoặc các nội dung khác…
official
bulk-cms-update
webflow
Tạo hoặc cập nhật nhiều mục CMS trong một bộ sưu tập Webflow với xác thực và xem trước khác biệt. Sử dụng khi thêm nhiều bài đăng blog, sản phẩm hoặc cập nhật các trường…
official
cms-collection-setup
webflow
Tạo một bộ sưu tập CMS mới trong Webflow với các trường và mối quan hệ được chỉ định. Sử dụng khi thiết lập bài viết blog, sản phẩm, thành viên nhóm, danh mục đầu tư hoặc các mục khác…
official
link-checker
webflow
Tìm và sửa các liên kết hỏng hoặc không an toàn trên toàn bộ trang web, bao gồm cả nội dung CMS, để cải thiện SEO và trải nghiệm người dùng. Kiểm tra các vấn đề HTTP/HTTPS và xác thực…
official
custom-code-management
webflow
Thêm, xem xét hoặc xóa các tập lệnh tùy chỉnh nội tuyến trên trang Webflow (tối đa 10.000 ký tự). Sử dụng cho analytics, tracking pixels, chat widgets hoặc bất kỳ mã tùy chỉnh…
official
accessibility-audit
webflow
Chạy kiểm tra khả năng truy cập toàn diện (WCAG 2.1) trên các trang Webflow - kiểm tra nút bấm, biểu mẫu, liên kết, trạng thái tiêu điểm, tiêu đề, điều hướng bàn phím và tạo ra…
official
asset-audit
webflow
Phân tích tài sản trên trang Webflow để tối ưu hóa SEO. Xác định tài sản thiếu văn bản thay thế và tài sản có tên không thân thiện với SEO, sau đó tạo và áp dụng…
official
bulk-cms-update
webflow
Tạo hoặc cập nhật nhiều mục CMS trong một bộ sưu tập Webflow kèm xác thực và xem trước khác biệt. Sử dụng khi thêm nhiều bài đăng blog, sản phẩm hoặc cập nhật các trường…
official