# webflow-mcp:compress-cms-image

Скилл сжимает картинки в полях Webflow CMS, переводит их в WebP или AVIF и обновляет запись через Webflow MCP. Помогает облегчить страницы сайта без ручной возни с файлами.

- скилл · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 548 установок · ★ 132
- Автор: webflow
- Лицензия: MIT · policy=mirror · начало файла — в конце страницы
- Исходник: https://github.com/webflow/webflow-skills/tree/HEAD/plugins/webflow-skills/skills/webflow-compress-cms-image/SKILL.md
- Обновлён: 2026-10-22
- HTML: https://affpapa.org/nevibecode/skills/webflow-mcpcompress-cms-image

## Что делает

Скилл запрашивает ID коллекции, идентификатор записи, целевой формат и желаемый уровень качества (по умолчанию советует 85 для WebP и 75 для AVIF). Затем он читает схему через инструмент `data_cms_tool`, отбирает поля типов `Image` и `MultiImage`, скачивает оригиналы в `/tmp/` и пережимает их локальным скриптом на Python через библиотеку `Pillow`.

Для каждого сжатого файла вычисляется контрольная сумма MD5. Скилл запрашивает у Webflow presigned-ссылку для S3 через `data_assets_tool`, загружает готовый файл multipart-запросом, привязывает новый ассет к записи CMS и публикует изменения. Перед любой операцией записи агент показывает превью изменений и ждёт, пока вы напишете `confirm`.

Картинки, встроенные внутрь разметки Rich Text, инструмент не обрабатывает. Без настроенного сервера Webflow MCP и установленного Python 3 в окружении скилл работать не сможет.

## Установка

### Claude Code (родная платформа)

1. **Через Skills CLI (Vercel)**
```bash
npx skills add webflow/webflow-skills --skill webflow-mcp:compress-cms-image -a claude-code
```
```bash
npx skills add webflow/webflow-skills --skill webflow-compress-cms-image -a claude-code
```

2. **Вручную: положить файлы**
- Файл: `~/.claude/skills/webflow-compress-cms-image/SKILL.md` — Папка скилла целиком; для одного проекта — .claude/skills/webflow-compress-cms-image/

### Codex

1. **Через Skills CLI (Vercel)**
```bash
npx skills add webflow/webflow-skills --skill webflow-compress-cms-image -a codex
```

2. **Вручную: положить файлы**
- Файл: `.agents/skills/webflow-compress-cms-image/SKILL.md` — Для всех проектов — ~/.agents/skills/

### Cursor

1. **Через Skills CLI (Vercel)**
```bash
npx skills add webflow/webflow-skills --skill webflow-compress-cms-image -a cursor
```

2. **Вручную: положить файлы**
- Файл: `.cursor/skills/webflow-compress-cms-image/SKILL.md` — Cursor читает и .agents/skills/, и .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install webflow/webflow-skills webflow-compress-cms-image
```

2. **Вручную: положить файлы**
- Файл: `.github/skills/webflow-compress-cms-image/SKILL.md`

### Gemini CLI

1. **Через Skills CLI (Vercel)**
```bash
npx skills add webflow/webflow-skills --skill webflow-compress-cms-image -a gemini-cli
```

2. **Командой платформы**
```bash
gemini skills install https://github.com/webflow/webflow-skills --path plugins/webflow-skills/skills/webflow-compress-cms-image
```

### Windsurf (Devin Desktop)

**Вручную: положить файлы**
- Файл: `.devin/skills/webflow-compress-cms-image/SKILL.md` — Старый путь .windsurf/skills/ тоже читается

### OpenCode

**Через Skills CLI (Vercel)**
```bash
npx skills add webflow/webflow-skills --skill webflow-compress-cms-image -a opencode
```

### Claude.ai

**Claude.ai**
- Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills

Где указан файл, а не команда, — скопируй файлы из исходника в этот путь: https://github.com/webflow/webflow-skills/tree/HEAD/plugins/webflow-skills/skills/webflow-compress-cms-image/SKILL.md

## Когда брать
- перевести картинки в CMS Webflow в формат WebP или AVIF
- уменьшить размер файлов в полях Image и MultiImage
- загрузить оптимизированную графику в Webflow Assets через presigned S3 URL
- обновить поля записи коллекции и сразу опубликовать изменения

## Примеры запросов агенту
- Сожми изображения в записи CMS Webflow с ID item_123 в коллекции col_456 и переведи их в webp
- Оптимизируй поле main-image для товара в Webflow, сохранив качество 85
- Сконвертируй картинки из MultiImage поля галереи в формат avif с качеством 75

## Похожие
- [remotion-render](https://affpapa.org/nevibecode/skills/remotion-render.md) — скилл · 3 установки
- [recipe-share-event-materials](https://affpapa.org/nevibecode/skills/recipe-share-event-materials.md) — скилл · 29700 установок
- [blogwatcher](https://affpapa.org/nevibecode/skills/blogwatcher.md) — скилл · 5400 установок
- [ego-browser](https://affpapa.org/nevibecode/skills/ego-browser.md) — скилл · 12200 установок
- [composio](https://affpapa.org/nevibecode/skills/composio.md) — скилл · 8100 установок
- [remote-browser](https://affpapa.org/nevibecode/skills/remote-browser.md) — скилл · 4700 установок

Из того же набора: [webflow/webflow-skills](https://affpapa.org/nevibecode/by/webflow/webflow-skills.md) — 27 карточек

_Часть страницы не вошла по размеру — она есть в HTML-версии._

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md