К основному содержанию
скилл CX Codex

webflow-mcp:custom-code-management — скилл для Claude Code

Управляет встроенным JavaScript на сайте Webflow через MCP. Позволяет добавлять и удалять скрипты аналитики или чат-виджетов на уровне сайта или отдельных страниц.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add webflow/webflow-skills --skill webflow-mcp:custom-code-management -a claude-code
npx skills add webflow/webflow-skills --skill custom-code-management -a claude-code
Открыть на GitHub

Что делает webflow-mcp:custom-code-management

Агент находит сайты через data_sites_tool и проверяет подключённый код с помощью data_scripts_tool. Затем он вставляет инлайн-скрипты в заголовок или подвал страниц. Теги <script> ставить не нужно. Webflow добавит их сам при публикации.

Для работы обязательно настроить сервер Webflow MCP. Выборочного удаления на уровне сайта нет. Команда delete_all_site_scripts стирает всё разом, поэтому перед запуском агент требует подтверждения словом delete all. Каждый скрипт ограничен 10 000 символов. При обновлении связка displayName и version не должна совпадать с уже сохранённой записью. Внешние файлы по ссылке через этот инструмент не подключить, поддерживается только инлайн-код.

Какие задачи решает

  • внедрить контейнер Google Tag Manager в заголовок сайта
  • проверить список подключённых скриптов на страницах Webflow
  • добавить код отслеживания конверсий на конкретную страницу
  • очистить устаревший JavaScript со страницы или всего проекта

Примеры запросов агенту

  • Покажи все скрипты, подключённые к моему сайту в Webflow
  • Добавь Google Tag Manager с моим ID контейнера в шапку сайта
  • Подключи код отслеживания конверсий на страницу thank-you

Как установить webflow-mcp:custom-code-management

1Через Skills CLI (Vercel)

npx skills add webflow/webflow-skills --skill webflow-mcp:custom-code-management -a claude-code
npx skills add webflow/webflow-skills --skill custom-code-management -a claude-code

2Вручную: положить файлы

~/.claude/skills/custom-code-management/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/custom-code-management/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о webflow-mcp:custom-code-management

Как установить webflow-mcp:custom-code-management в Claude Code?

Выполните команду npx skills add webflow/webflow-skills --skill webflow-mcp:custom-code-management -a claude-code.

Что делает webflow-mcp:custom-code-management?

Скилл помогает агенту находить, добавлять и удалять встроенные JavaScript-скрипты на страницах или на всём сайте Webflow через вызовы Webflow MCP.

Можно ли удалить один конкретный скрипт сайта?

Нет, выборочное удаление кода на уровне сайта в Webflow MCP не поддерживается. Инструмент delete_all_site_scripts стирает сразу все скрипты сайта после подтверждения фразой delete all.

Исходный текст

SKILL.md · MIT
---
name: webflow-mcp:custom-code-management
description: 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 JavaScript. Also manages page-level scripts.
---

# 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
3. **List scripts**: Call `list_registered_scripts` and `list_applied_scripts` in parallel
4. **Check page-level scripts** (if relevant): Use `get_page_script` for specific pages
5. **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
6. **Add site script**: `add_inline_site_script` with displayName, sourceCode, version, location, canCopy
7. **Remove all site scripts**: `delete_all_site_scripts`
8. **Add/update page script**: `upsert_page_script`
9. **Remove page scripts**: `delete_all_page_scripts`

### Phase 5: Verification
10. Re-list scripts to confirm success
11. Report what changed (name, location, version, char count)
12. Remind user to publish — suggest using `safe-publish` skill

## Examples

### Example 1: View scripts
**User:** "What scripts are on my site?"
1. `webflow_guide_tool` → `data_sites_tool` → `list_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_tool` → `data_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_tool` → `data_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_tool` → `data_sites_tool` → `get_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 delete** — `delete_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

© webflow · MIT · webflow/webflow-skills

Похожие скиллы

Всё по теме «Фронтенд и UI» →
frontend-design официальный anthropics Скилл задаёт осмысленное визуальное направление для новых интерфейсов и редизайна. Подойдёт, когда стандартный шаблонный UI не устраивает. 1 025 790установок design-taste-frontend Leonxlnx Скилл задаёт арт-дирекцию для публичных страниц и рабочих экранов, а затем проверяет результат в браузере по скриншотам. Нужен, когда интерфейс выглядит шаблонным или недоработанным. CX Codex +1 678 700установок prototype Matt Pocock Создаёт временный прототип, чтобы проверить логику, модель состояния или вид интерфейса до работы над основным кодом. 986 201установок hyperframes heygen-com Скилл задаёт агенту правила рендера HTML-кода в видео через HyperFrames. Помогает собирать проморолики, эксплейнеры и титры прямо в коде проекта. CX Codex +1 1 200 000установок hyperframes-cli heygen-com Управляет проектами HyperFrames через терминал: собирает таймлайн, проверяет контраст кадров, запускает предпросмотр и рендерит видео локально или в облаке. CX Codex +1 1 300 000установок webapp-testing официальный anthropics Скилл запускает проверки локальных веб-приложений через Playwright: помогает отлаживать UI, делать скриншоты и смотреть логи браузера. 186 758установок

Из того же набора22

webflow-code-component:troubleshoot-deploy Разбирает сбои деплоя Webflow Code Components: читает сообщение об ошибке, находит причину и даёт конкретное исправление. CX Codex +1 977установок webflow-mcp:accessibility-audit Проводит аудит доступности страниц Webflow по стандарту WCAG 2.1, находит ошибки интерактивных элементов и исправляет их без подключения к Designer. CX Codex +1 887установок webflow-mcp:cms-best-practices Скилл помогает планировать коллекции Webflow CMS, настраивать связи между ними и разбирать проблемы со структурой контента. CX Codex +1 877установок webflow-mcp:site-audit Скилл проходит по сайту Webflow и собирает инвентарь страниц, CMS-коллекций и полей, а потом выдаёт отчёт с оценкой здоровья контента. CX Codex +1 862установок webflow-mcp:link-checker Находит и исправляет неработающие, небезопасные или перенаправляющие ссылки на страницах и в CMS Webflow. Пригодится перед релизом или для регулярного SEO-аудита сайта. CX Codex +1 851установок webflow-mcp:bulk-cms-update Скилл создаёт и обновляет сразу много элементов коллекции Webflow: проверяет данные по схеме, показывает diff и умеет откатить изменения. CX Codex +1 839установок webflow-mcp:safe-publish Показывает, что изменилось на сайте Webflow с прошлой публикации, прогоняет проверки и ждёт, пока вы напишете «publish». CX Codex +1 826установок webflow-mcp:flowkit-naming Приводит имена CSS-классов в Webflow к системе Flowkit: аудит существующих, генерация новых и применение через MCP-инструменты. CX Codex +1 824установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой