custom-code-management

โดย webflow

Add, review, or remove inline custom scripts on a Webflow site (up to 10,000 chars). Use for analytics, tracking pixels, chat widgets, or any custom…

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

Skills เพิ่มเติมจาก webflow

cms-collection-setup
webflow
สร้างคอลเลกชัน CMS ใหม่ใน Webflow พร้อมฟิลด์และความสัมพันธ์ที่ระบุ ใช้เมื่อตั้งค่าโพสต์บล็อก สินค้า สมาชิกทีม ผลงาน หรืออื่นๆ…
official
bulk-cms-update
webflow
สร้างหรืออัปเดตรายการ CMS หลายรายการในคอลเลกชัน Webflow พร้อมการตรวจสอบความถูกต้องและตัวอย่างการเปรียบเทียบ ใช้เมื่อเพิ่มโพสต์บล็อกหลายรายการ สินค้า หรืออัปเดตฟิลด์…
official
cms-collection-setup
webflow
Create a new CMS collection in Webflow with specified fields and relationships. Use when setting up blog posts, products, team members, portfolios, or other…
official
link-checker
webflow
Find and fix broken or insecure links across an entire site, including CMS content, to improve SEO and user experience. Audits HTTP/HTTPS issues and validates…
official
accessibility-audit
webflow
ดำเนินการตรวจสอบการเข้าถึงอย่างครอบคลุม (WCAG 2.1) บนหน้าเว็บ Webflow — ตรวจสอบปุ่ม ฟอร์ม ลิงก์ สถานะโฟกัส หัวข้อ การนำทางด้วยแป้นพิมพ์ และสร้าง…
official
asset-audit
webflow
Analyze assets on a Webflow site for SEO optimization. Identifies assets missing alt text and assets with non-SEO-friendly names, then generates and applies…
official
bulk-cms-update
webflow
สร้างหรืออัปเดตรายการ CMS หลายรายการในคอลเลกชัน Webflow พร้อมการตรวจสอบความถูกต้องและการแสดงตัวอย่างความแตกต่าง ใช้เมื่อเพิ่มบทความบล็อก ผลิตภัณฑ์หลายรายการ หรืออัปเดตฟิลด์ต่างๆ…
official
cms-best-practices
webflow
Expert guidance on Webflow CMS architecture and best practices. Use when planning collections, setting up relationships, optimizing content structure, or…
official