[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-webflow-webflow-mcpcompress-cms-image":3,"mdc--e1vgy7-key":43,"related-org-webflow-webflow-mcpcompress-cms-image":2185,"related-repo-webflow-webflow-mcpcompress-cms-image":2376},{"slug":4,"name":5,"fn":6,"description":7,"org":8,"tags":12,"stars":30,"repoUrl":31,"updatedAt":32,"license":33,"forks":34,"topics":35,"repo":38,"sourceUrl":41,"mdContent":42},"webflow-mcpcompress-cms-image","webflow-mcp:compress-cms-image","compress and convert Webflow CMS images","Compress and convert CMS item image fields to webp or avif in a Webflow collection. Prompts for collection ID, item ID, image fields, quality, and target format, then downloads, converts, re-uploads via presigned S3, and publishes the updated item.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},"webflow","Webflow","https:\u002F\u002Fpexgzepcugksgbtrxkhf.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Forg-logos\u002Fwebflow.png",[13,17,20,23,26,29],{"name":14,"slug":15,"type":16},"Performance","performance","tag",{"name":18,"slug":19,"type":16},"Automation","automation",{"name":21,"slug":22,"type":16},"Images","images",{"name":24,"slug":25,"type":16},"CMS","cms",{"name":27,"slug":28,"type":16},"MCP","mcp",{"name":10,"slug":9,"type":16},107,"https:\u002F\u002Fgithub.com\u002Fwebflow\u002Fwebflow-skills","2026-06-17T08:41:46.544475",null,17,[36,37],"agent","skills",{"repoUrl":31,"stars":30,"forks":34,"topics":39,"description":40},[36,37],"Official Webflow Agent Skills","https:\u002F\u002Fgithub.com\u002Fwebflow\u002Fwebflow-skills\u002Ftree\u002FHEAD\u002Fplugins\u002Fwebflow-skills\u002Fskills\u002Fwebflow-compress-cms-image","---\nname: webflow-mcp:compress-cms-image\ndescription: Compress and convert CMS item image fields to webp or avif in a Webflow collection. Prompts for collection ID, item ID, image fields, quality, and target format, then downloads, converts, re-uploads via presigned S3, and publishes the updated item.\n---\n\n# Webflow CMS Image Compression\n\nCompress and reformat image fields on a Webflow CMS item to `.webp` or `.avif`.\n\nThis skill does not support images embedded inside Rich Text fields at this time. Tell the user that limitation before starting and only process CMS fields whose schema type is `Image` or `MultiImage`.\n\n## Important Note\n\n**ALWAYS use Webflow MCP tools for Webflow operations:**\n- Use Webflow MCP's `data_sites_tool` with action `list_sites` to discover the site ID when needed\n- Use Webflow MCP's `data_cms_tool` with action `get_collection_details` to fetch collection schemas\n- Use Webflow MCP's `data_cms_tool` with action `list_collection_items` to fetch the target CMS item\n- Use Webflow MCP's `data_assets_tool` with action `create_asset` to create presigned asset uploads\n- Use Webflow MCP's `data_cms_tool` with action `update_collection_items` to update CMS image fields\n- Use Webflow MCP's `data_cms_tool` with action `publish_collection_items` to publish the updated item\n- All Webflow MCP calls must include the required `context` parameter (15-25 words, third-person perspective)\n- Mutating operations require explicit user confirmation. Ask the user to type `confirm` before uploading assets, updating CMS fields, or publishing.\n- Rich Text embedded images are not supported. Do not parse or rewrite Rich Text HTML for image compression.\n\n## Instructions\n\n### Phase 1: Gather Parameters\n\nCollect all required inputs in one shot when possible:\n\n1. **Collection ID**: Ask \"What is the Collection ID?\"\n2. **Item ID**: Ask \"What is the Item ID?\"\n3. **Image fields**: Ask \"Which image fields should be compressed?\"\n   - \"All image fields\" - compress every Image or MultiImage field found on the item\n   - \"Specify field names\" - user will name specific field slugs\n4. **Target format**: Ask \"Target format?\"\n   - \"webp (Recommended)\" - best browser support, good compression\n   - \"avif\" - better compression, slightly less support\n5. **Quality (1-100)**: Ask \"Quality (1-100)?\"\n   - \"85 - Recommended (webp)\" - visually lossless for most photos\n   - \"75 - Recommended (avif)\" - avif is efficient at lower quality\n   - \"Custom\" - user types their own value\n\nIf the user chose \"Specify field names\", follow up for comma-separated field slugs. If the user chose \"Custom\" quality, follow up for the numeric value. Validate custom quality is an integer from 1 to 100.\n\n### Phase 2: Discover Image Fields\n\n1. Call `data_cms_tool` with action `get_collection_details` and the collection ID.\n2. Filter fields where `type === \"Image\"` or `type === \"MultiImage\"`.\n3. Select target fields:\n   - If the user chose \"All image fields\", use every Image and MultiImage field found.\n   - If the user named specific fields, validate each slug exists and is an Image or MultiImage field.\n   - Warn and skip requested fields that do not exist or are not image fields.\n4. Stop and report if no valid image fields remain.\n\n### Phase 3: Fetch the CMS Item\n\nCall `data_cms_tool` with action `list_collection_items` to fetch the target item. Use the item ID to identify the item directly when the tool supports it; otherwise filter or search the returned items.\n\nExtract current `fieldData` for each target field:\n- For Image fields, capture `url` and `fileId`.\n- For MultiImage fields, capture each array entry's `url` and `fileId`.\n- Skip null, empty, or malformed image values.\n- Skip images already in the target format unless the user explicitly asks to recompress them.\n\n### Phase 4: Preview and Confirm\n\nBefore downloading or uploading anything, show a preview:\n\n```markdown\nCompression Preview\n\nCollection: [collection ID]\nItem: [item ID]\nTarget format: webp\nQuality: 85\n\nFields to process:\n- main-image: hero.jpg -> hero.webp\n- gallery: 3 images -> webp\n\nSkipped:\n- thumbnail: already webp\n\nType `confirm` to download, convert, upload, update the CMS item, and publish.\n```\n\nProceed only after the user types `confirm`.\n\n### Phase 5: Convert Each Image\n\nFor each image:\n\n1. Download to `\u002Ftmp\u002F`:\n\n```bash\ncurl -sL \"{url}\" -o \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.orig\"\n```\n\n2. Ensure Pillow is available:\n\n```bash\npython3 -c \"from PIL import Image\" 2>\u002Fdev\u002Fnull || pip3 install Pillow -q\n```\n\nFor avif, also try:\n\n```bash\npip3 install pillow-avif-plugin -q\n```\n\n3. Convert with the user's quality setting:\n\n```bash\npython3 - \u003C\u003C'EOF'\nfrom PIL import Image\nimport os\n\ntry:\n    import pillow_avif\nexcept ImportError:\n    pass\n\nsource = \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.orig\"\ntarget = \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.{ext}\"\nimg = Image.open(source)\nimg.save(target, \"{FORMAT}\", quality={quality})\norig = os.path.getsize(source)\nnew = os.path.getsize(target)\nprint(f\"Original: {orig:,} bytes -> {FORMAT}: {new:,} bytes ({(1 - new \u002F orig) * 100:.1f}% smaller)\")\nEOF\n```\n\nIf avif conversion fails, report the error and ask whether to fall back to webp or abort.\n\n4. Compute the MD5 hash of the converted file:\n\n```bash\nmd5 -q \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.{ext}\"\n```\n\nOn Linux:\n\n```bash\nmd5sum \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.{ext}\" | cut -d' ' -f1\n```\n\n### Phase 6: Upload to Webflow Assets\n\nFor each converted file:\n\n1. Determine `site_id`. If it is not known from the collection or prior context, call `data_sites_tool` with action `list_sites`. If multiple sites are available, ask the user which one owns the collection.\n2. Call `data_assets_tool` with action `create_asset`:\n   - `site_id`: the target site ID\n   - `file_name`: original base name plus the new extension, such as `hero.webp`\n   - `file_hash`: the MD5 hex string\n3. Capture the response values:\n   - `uploadUrl`: S3 endpoint\n   - `uploadDetails`: form fields\n   - `id`: new asset ID\n   - `hostedUrl`: CDN URL to use as the CMS source reference\n4. POST to S3 as multipart\u002Fform-data. Map `uploadDetails` keys to curl fields:\n   - `xAmzAlgorithm` -> `X-Amz-Algorithm`\n   - `xAmzCredential` -> `X-Amz-Credential`\n   - `xAmzDate` -> `X-Amz-Date`\n   - `xAmzSignature` -> `X-Amz-Signature`\n   - `successActionStatus` -> `success_action_status`\n   - `contentType` -> `Content-Type`\n   - `cacheControl` -> `Cache-Control`\n   - Pass `acl`, `bucket`, `key`, and `policy` as-is\n   - Append the file last: `-F \"file=@\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.{ext};type=image\u002F{ext}\"`\n5. Expect HTTP 201. If the response is not 201, log the response body and report the upload error. Presigned URLs have a one-hour TTL; restart from asset creation if the URL expires.\n\n### Phase 7: Update and Publish\n\nCall `data_cms_tool` with action `update_collection_items` using only fields that were successfully converted and uploaded.\n\nFor Image fields, set:\n\n```json\n{\n  \"fieldSlug\": {\n    \"fileId\": \"{newAssetId}\",\n    \"url\": \"{hostedUrl}\"\n  }\n}\n```\n\nFor MultiImage fields, reconstruct the full image array and replace only successfully processed entries with the new `{ \"fileId\", \"url\" }` values. Preserve skipped entries exactly as they were.\n\nAfter a successful update, call `data_cms_tool` with action `publish_collection_items` for the item ID. The CMS may re-process the image and generate its own CDN URL; the `hostedUrl` from the asset upload is the source reference.\n\n### Phase 8: Report Results\n\nPrint a concise summary table:\n\n| Field | Original | Converted | Savings |\n|-------|----------|-----------|---------|\n| main-image | 118,044 B (JPEG) | 113,260 B (webp) | 4.1% |\n\nAlso report:\n- Fields skipped because they were null, empty, malformed, already in the target format, or not image fields\n- Conversion failures and whether the user chose fallback or abort\n- Upload failures, including response bodies when available\n- New asset IDs for uploads that succeeded when a later CMS update or publish failed\n\n## Examples\n\n**User prompt:**\n\n```text\nCompress the main image on this CMS item to webp.\n```\n\n**Response flow:**\n\n```markdown\nI need the collection ID, item ID, image fields, target format, and quality before compressing the CMS image.\n\nCompression Preview\n\nCollection: 65f...\nItem: 66a...\nTarget format: webp\nQuality: 85\n\nFields to process:\n- main-image: blog-hero.jpg -> blog-hero.webp\n\nType `confirm` to download, convert, upload, update the CMS item, and publish.\n```\n\n**Final report:**\n\n```markdown\nCMS Image Compression Complete\n\n| Field | Original | Converted | Savings |\n|-------|----------|-----------|---------|\n| main-image | 842,911 B (JPEG) | 214,330 B (webp) | 74.6% |\n\nUpdated and published item 66a...\n```\n\n## Guidelines\n\n- Handle one CMS item at a time. For bulk operations across many items, rerun the skill for each item or extend the workflow with an explicit loop.\n- Do not delete the original JPEG or PNG from Webflow's asset store; only update the CMS field reference.\n- Preserve filenames by stripping the original extension and appending the target extension. Avoid double extensions such as `hero.jpg.webp`.\n- Continue processing other selected fields after a single image conversion or upload failure unless the failed field is the only target.\n- Never update or publish the CMS item if no image was successfully converted and uploaded.\n- Keep a local in-memory rollback note with the original image field values and include it in the final report when an update succeeds.\n",{"data":44,"body":45},{"name":5,"description":7},{"type":46,"children":47},"root",[48,57,80,99,106,115,264,270,277,282,380,385,391,459,465,482,495,545,551,556,736,747,753,758,774,831,839,907,912,940,948,1104,1109,1117,1150,1155,1212,1218,1223,1542,1548,1565,1570,1700,1713,1738,1744,1749,1810,1815,1838,1844,1852,1862,1870,1992,2000,2133,2139,2179],{"type":49,"tag":50,"props":51,"children":53},"element","h1",{"id":52},"webflow-cms-image-compression",[54],{"type":55,"value":56},"text","Webflow CMS Image Compression",{"type":49,"tag":58,"props":59,"children":60},"p",{},[61,63,70,72,78],{"type":55,"value":62},"Compress and reformat image fields on a Webflow CMS item to ",{"type":49,"tag":64,"props":65,"children":67},"code",{"className":66},[],[68],{"type":55,"value":69},".webp",{"type":55,"value":71}," or ",{"type":49,"tag":64,"props":73,"children":75},{"className":74},[],[76],{"type":55,"value":77},".avif",{"type":55,"value":79},".",{"type":49,"tag":58,"props":81,"children":82},{},[83,85,91,92,98],{"type":55,"value":84},"This skill does not support images embedded inside Rich Text fields at this time. Tell the user that limitation before starting and only process CMS fields whose schema type is ",{"type":49,"tag":64,"props":86,"children":88},{"className":87},[],[89],{"type":55,"value":90},"Image",{"type":55,"value":71},{"type":49,"tag":64,"props":93,"children":95},{"className":94},[],[96],{"type":55,"value":97},"MultiImage",{"type":55,"value":79},{"type":49,"tag":100,"props":101,"children":103},"h2",{"id":102},"important-note",[104],{"type":55,"value":105},"Important Note",{"type":49,"tag":58,"props":107,"children":108},{},[109],{"type":49,"tag":110,"props":111,"children":112},"strong",{},[113],{"type":55,"value":114},"ALWAYS use Webflow MCP tools for Webflow operations:",{"type":49,"tag":116,"props":117,"children":118},"ul",{},[119,141,160,178,197,215,233,246,259],{"type":49,"tag":120,"props":121,"children":122},"li",{},[123,125,131,133,139],{"type":55,"value":124},"Use Webflow MCP's ",{"type":49,"tag":64,"props":126,"children":128},{"className":127},[],[129],{"type":55,"value":130},"data_sites_tool",{"type":55,"value":132}," with action ",{"type":49,"tag":64,"props":134,"children":136},{"className":135},[],[137],{"type":55,"value":138},"list_sites",{"type":55,"value":140}," to discover the site ID when needed",{"type":49,"tag":120,"props":142,"children":143},{},[144,145,151,152,158],{"type":55,"value":124},{"type":49,"tag":64,"props":146,"children":148},{"className":147},[],[149],{"type":55,"value":150},"data_cms_tool",{"type":55,"value":132},{"type":49,"tag":64,"props":153,"children":155},{"className":154},[],[156],{"type":55,"value":157},"get_collection_details",{"type":55,"value":159}," to fetch collection schemas",{"type":49,"tag":120,"props":161,"children":162},{},[163,164,169,170,176],{"type":55,"value":124},{"type":49,"tag":64,"props":165,"children":167},{"className":166},[],[168],{"type":55,"value":150},{"type":55,"value":132},{"type":49,"tag":64,"props":171,"children":173},{"className":172},[],[174],{"type":55,"value":175},"list_collection_items",{"type":55,"value":177}," to fetch the target CMS item",{"type":49,"tag":120,"props":179,"children":180},{},[181,182,188,189,195],{"type":55,"value":124},{"type":49,"tag":64,"props":183,"children":185},{"className":184},[],[186],{"type":55,"value":187},"data_assets_tool",{"type":55,"value":132},{"type":49,"tag":64,"props":190,"children":192},{"className":191},[],[193],{"type":55,"value":194},"create_asset",{"type":55,"value":196}," to create presigned asset uploads",{"type":49,"tag":120,"props":198,"children":199},{},[200,201,206,207,213],{"type":55,"value":124},{"type":49,"tag":64,"props":202,"children":204},{"className":203},[],[205],{"type":55,"value":150},{"type":55,"value":132},{"type":49,"tag":64,"props":208,"children":210},{"className":209},[],[211],{"type":55,"value":212},"update_collection_items",{"type":55,"value":214}," to update CMS image fields",{"type":49,"tag":120,"props":216,"children":217},{},[218,219,224,225,231],{"type":55,"value":124},{"type":49,"tag":64,"props":220,"children":222},{"className":221},[],[223],{"type":55,"value":150},{"type":55,"value":132},{"type":49,"tag":64,"props":226,"children":228},{"className":227},[],[229],{"type":55,"value":230},"publish_collection_items",{"type":55,"value":232}," to publish the updated item",{"type":49,"tag":120,"props":234,"children":235},{},[236,238,244],{"type":55,"value":237},"All Webflow MCP calls must include the required ",{"type":49,"tag":64,"props":239,"children":241},{"className":240},[],[242],{"type":55,"value":243},"context",{"type":55,"value":245}," parameter (15-25 words, third-person perspective)",{"type":49,"tag":120,"props":247,"children":248},{},[249,251,257],{"type":55,"value":250},"Mutating operations require explicit user confirmation. Ask the user to type ",{"type":49,"tag":64,"props":252,"children":254},{"className":253},[],[255],{"type":55,"value":256},"confirm",{"type":55,"value":258}," before uploading assets, updating CMS fields, or publishing.",{"type":49,"tag":120,"props":260,"children":261},{},[262],{"type":55,"value":263},"Rich Text embedded images are not supported. Do not parse or rewrite Rich Text HTML for image compression.",{"type":49,"tag":100,"props":265,"children":267},{"id":266},"instructions",[268],{"type":55,"value":269},"Instructions",{"type":49,"tag":271,"props":272,"children":274},"h3",{"id":273},"phase-1-gather-parameters",[275],{"type":55,"value":276},"Phase 1: Gather Parameters",{"type":49,"tag":58,"props":278,"children":279},{},[280],{"type":55,"value":281},"Collect all required inputs in one shot when possible:",{"type":49,"tag":283,"props":284,"children":285},"ol",{},[286,296,306,329,352],{"type":49,"tag":120,"props":287,"children":288},{},[289,294],{"type":49,"tag":110,"props":290,"children":291},{},[292],{"type":55,"value":293},"Collection ID",{"type":55,"value":295},": Ask \"What is the Collection ID?\"",{"type":49,"tag":120,"props":297,"children":298},{},[299,304],{"type":49,"tag":110,"props":300,"children":301},{},[302],{"type":55,"value":303},"Item ID",{"type":55,"value":305},": Ask \"What is the Item ID?\"",{"type":49,"tag":120,"props":307,"children":308},{},[309,314,316],{"type":49,"tag":110,"props":310,"children":311},{},[312],{"type":55,"value":313},"Image fields",{"type":55,"value":315},": Ask \"Which image fields should be compressed?\"\n",{"type":49,"tag":116,"props":317,"children":318},{},[319,324],{"type":49,"tag":120,"props":320,"children":321},{},[322],{"type":55,"value":323},"\"All image fields\" - compress every Image or MultiImage field found on the item",{"type":49,"tag":120,"props":325,"children":326},{},[327],{"type":55,"value":328},"\"Specify field names\" - user will name specific field slugs",{"type":49,"tag":120,"props":330,"children":331},{},[332,337,339],{"type":49,"tag":110,"props":333,"children":334},{},[335],{"type":55,"value":336},"Target format",{"type":55,"value":338},": Ask \"Target format?\"\n",{"type":49,"tag":116,"props":340,"children":341},{},[342,347],{"type":49,"tag":120,"props":343,"children":344},{},[345],{"type":55,"value":346},"\"webp (Recommended)\" - best browser support, good compression",{"type":49,"tag":120,"props":348,"children":349},{},[350],{"type":55,"value":351},"\"avif\" - better compression, slightly less support",{"type":49,"tag":120,"props":353,"children":354},{},[355,360,362],{"type":49,"tag":110,"props":356,"children":357},{},[358],{"type":55,"value":359},"Quality (1-100)",{"type":55,"value":361},": Ask \"Quality (1-100)?\"\n",{"type":49,"tag":116,"props":363,"children":364},{},[365,370,375],{"type":49,"tag":120,"props":366,"children":367},{},[368],{"type":55,"value":369},"\"85 - Recommended (webp)\" - visually lossless for most photos",{"type":49,"tag":120,"props":371,"children":372},{},[373],{"type":55,"value":374},"\"75 - Recommended (avif)\" - avif is efficient at lower quality",{"type":49,"tag":120,"props":376,"children":377},{},[378],{"type":55,"value":379},"\"Custom\" - user types their own value",{"type":49,"tag":58,"props":381,"children":382},{},[383],{"type":55,"value":384},"If the user chose \"Specify field names\", follow up for comma-separated field slugs. If the user chose \"Custom\" quality, follow up for the numeric value. Validate custom quality is an integer from 1 to 100.",{"type":49,"tag":271,"props":386,"children":388},{"id":387},"phase-2-discover-image-fields",[389],{"type":55,"value":390},"Phase 2: Discover Image Fields",{"type":49,"tag":283,"props":392,"children":393},{},[394,412,431,454],{"type":49,"tag":120,"props":395,"children":396},{},[397,399,404,405,410],{"type":55,"value":398},"Call ",{"type":49,"tag":64,"props":400,"children":402},{"className":401},[],[403],{"type":55,"value":150},{"type":55,"value":132},{"type":49,"tag":64,"props":406,"children":408},{"className":407},[],[409],{"type":55,"value":157},{"type":55,"value":411}," and the collection ID.",{"type":49,"tag":120,"props":413,"children":414},{},[415,417,423,424,430],{"type":55,"value":416},"Filter fields where ",{"type":49,"tag":64,"props":418,"children":420},{"className":419},[],[421],{"type":55,"value":422},"type === \"Image\"",{"type":55,"value":71},{"type":49,"tag":64,"props":425,"children":427},{"className":426},[],[428],{"type":55,"value":429},"type === \"MultiImage\"",{"type":55,"value":79},{"type":49,"tag":120,"props":432,"children":433},{},[434,436],{"type":55,"value":435},"Select target fields:\n",{"type":49,"tag":116,"props":437,"children":438},{},[439,444,449],{"type":49,"tag":120,"props":440,"children":441},{},[442],{"type":55,"value":443},"If the user chose \"All image fields\", use every Image and MultiImage field found.",{"type":49,"tag":120,"props":445,"children":446},{},[447],{"type":55,"value":448},"If the user named specific fields, validate each slug exists and is an Image or MultiImage field.",{"type":49,"tag":120,"props":450,"children":451},{},[452],{"type":55,"value":453},"Warn and skip requested fields that do not exist or are not image fields.",{"type":49,"tag":120,"props":455,"children":456},{},[457],{"type":55,"value":458},"Stop and report if no valid image fields remain.",{"type":49,"tag":271,"props":460,"children":462},{"id":461},"phase-3-fetch-the-cms-item",[463],{"type":55,"value":464},"Phase 3: Fetch the CMS Item",{"type":49,"tag":58,"props":466,"children":467},{},[468,469,474,475,480],{"type":55,"value":398},{"type":49,"tag":64,"props":470,"children":472},{"className":471},[],[473],{"type":55,"value":150},{"type":55,"value":132},{"type":49,"tag":64,"props":476,"children":478},{"className":477},[],[479],{"type":55,"value":175},{"type":55,"value":481}," to fetch the target item. Use the item ID to identify the item directly when the tool supports it; otherwise filter or search the returned items.",{"type":49,"tag":58,"props":483,"children":484},{},[485,487,493],{"type":55,"value":486},"Extract current ",{"type":49,"tag":64,"props":488,"children":490},{"className":489},[],[491],{"type":55,"value":492},"fieldData",{"type":55,"value":494}," for each target field:",{"type":49,"tag":116,"props":496,"children":497},{},[498,518,535,540],{"type":49,"tag":120,"props":499,"children":500},{},[501,503,509,511,517],{"type":55,"value":502},"For Image fields, capture ",{"type":49,"tag":64,"props":504,"children":506},{"className":505},[],[507],{"type":55,"value":508},"url",{"type":55,"value":510}," and ",{"type":49,"tag":64,"props":512,"children":514},{"className":513},[],[515],{"type":55,"value":516},"fileId",{"type":55,"value":79},{"type":49,"tag":120,"props":519,"children":520},{},[521,523,528,529,534],{"type":55,"value":522},"For MultiImage fields, capture each array entry's ",{"type":49,"tag":64,"props":524,"children":526},{"className":525},[],[527],{"type":55,"value":508},{"type":55,"value":510},{"type":49,"tag":64,"props":530,"children":532},{"className":531},[],[533],{"type":55,"value":516},{"type":55,"value":79},{"type":49,"tag":120,"props":536,"children":537},{},[538],{"type":55,"value":539},"Skip null, empty, or malformed image values.",{"type":49,"tag":120,"props":541,"children":542},{},[543],{"type":55,"value":544},"Skip images already in the target format unless the user explicitly asks to recompress them.",{"type":49,"tag":271,"props":546,"children":548},{"id":547},"phase-4-preview-and-confirm",[549],{"type":55,"value":550},"Phase 4: Preview and Confirm",{"type":49,"tag":58,"props":552,"children":553},{},[554],{"type":55,"value":555},"Before downloading or uploading anything, show a preview:",{"type":49,"tag":557,"props":558,"children":563},"pre",{"className":559,"code":560,"language":561,"meta":562,"style":562},"language-markdown shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","Compression Preview\n\nCollection: [collection ID]\nItem: [item ID]\nTarget format: webp\nQuality: 85\n\nFields to process:\n- main-image: hero.jpg -> hero.webp\n- gallery: 3 images -> webp\n\nSkipped:\n- thumbnail: already webp\n\nType `confirm` to download, convert, upload, update the CMS item, and publish.\n","markdown","",[564],{"type":49,"tag":64,"props":565,"children":566},{"__ignoreMap":562},[567,579,589,598,607,616,625,633,642,657,670,678,687,700,708],{"type":49,"tag":568,"props":569,"children":572},"span",{"class":570,"line":571},"line",1,[573],{"type":49,"tag":568,"props":574,"children":576},{"style":575},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[577],{"type":55,"value":578},"Compression Preview\n",{"type":49,"tag":568,"props":580,"children":582},{"class":570,"line":581},2,[583],{"type":49,"tag":568,"props":584,"children":586},{"emptyLinePlaceholder":585},true,[587],{"type":55,"value":588},"\n",{"type":49,"tag":568,"props":590,"children":592},{"class":570,"line":591},3,[593],{"type":49,"tag":568,"props":594,"children":595},{"style":575},[596],{"type":55,"value":597},"Collection: [collection ID]\n",{"type":49,"tag":568,"props":599,"children":601},{"class":570,"line":600},4,[602],{"type":49,"tag":568,"props":603,"children":604},{"style":575},[605],{"type":55,"value":606},"Item: [item ID]\n",{"type":49,"tag":568,"props":608,"children":610},{"class":570,"line":609},5,[611],{"type":49,"tag":568,"props":612,"children":613},{"style":575},[614],{"type":55,"value":615},"Target format: webp\n",{"type":49,"tag":568,"props":617,"children":619},{"class":570,"line":618},6,[620],{"type":49,"tag":568,"props":621,"children":622},{"style":575},[623],{"type":55,"value":624},"Quality: 85\n",{"type":49,"tag":568,"props":626,"children":628},{"class":570,"line":627},7,[629],{"type":49,"tag":568,"props":630,"children":631},{"emptyLinePlaceholder":585},[632],{"type":55,"value":588},{"type":49,"tag":568,"props":634,"children":636},{"class":570,"line":635},8,[637],{"type":49,"tag":568,"props":638,"children":639},{"style":575},[640],{"type":55,"value":641},"Fields to process:\n",{"type":49,"tag":568,"props":643,"children":645},{"class":570,"line":644},9,[646,652],{"type":49,"tag":568,"props":647,"children":649},{"style":648},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[650],{"type":55,"value":651},"-",{"type":49,"tag":568,"props":653,"children":654},{"style":575},[655],{"type":55,"value":656}," main-image: hero.jpg -> hero.webp\n",{"type":49,"tag":568,"props":658,"children":660},{"class":570,"line":659},10,[661,665],{"type":49,"tag":568,"props":662,"children":663},{"style":648},[664],{"type":55,"value":651},{"type":49,"tag":568,"props":666,"children":667},{"style":575},[668],{"type":55,"value":669}," gallery: 3 images -> webp\n",{"type":49,"tag":568,"props":671,"children":673},{"class":570,"line":672},11,[674],{"type":49,"tag":568,"props":675,"children":676},{"emptyLinePlaceholder":585},[677],{"type":55,"value":588},{"type":49,"tag":568,"props":679,"children":681},{"class":570,"line":680},12,[682],{"type":49,"tag":568,"props":683,"children":684},{"style":575},[685],{"type":55,"value":686},"Skipped:\n",{"type":49,"tag":568,"props":688,"children":690},{"class":570,"line":689},13,[691,695],{"type":49,"tag":568,"props":692,"children":693},{"style":648},[694],{"type":55,"value":651},{"type":49,"tag":568,"props":696,"children":697},{"style":575},[698],{"type":55,"value":699}," thumbnail: already webp\n",{"type":49,"tag":568,"props":701,"children":703},{"class":570,"line":702},14,[704],{"type":49,"tag":568,"props":705,"children":706},{"emptyLinePlaceholder":585},[707],{"type":55,"value":588},{"type":49,"tag":568,"props":709,"children":711},{"class":570,"line":710},15,[712,717,722,727,731],{"type":49,"tag":568,"props":713,"children":714},{"style":575},[715],{"type":55,"value":716},"Type ",{"type":49,"tag":568,"props":718,"children":719},{"style":648},[720],{"type":55,"value":721},"`",{"type":49,"tag":568,"props":723,"children":725},{"style":724},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[726],{"type":55,"value":256},{"type":49,"tag":568,"props":728,"children":729},{"style":648},[730],{"type":55,"value":721},{"type":49,"tag":568,"props":732,"children":733},{"style":575},[734],{"type":55,"value":735}," to download, convert, upload, update the CMS item, and publish.\n",{"type":49,"tag":58,"props":737,"children":738},{},[739,741,746],{"type":55,"value":740},"Proceed only after the user types ",{"type":49,"tag":64,"props":742,"children":744},{"className":743},[],[745],{"type":55,"value":256},{"type":55,"value":79},{"type":49,"tag":271,"props":748,"children":750},{"id":749},"phase-5-convert-each-image",[751],{"type":55,"value":752},"Phase 5: Convert Each Image",{"type":49,"tag":58,"props":754,"children":755},{},[756],{"type":55,"value":757},"For each image:",{"type":49,"tag":283,"props":759,"children":760},{},[761],{"type":49,"tag":120,"props":762,"children":763},{},[764,766,772],{"type":55,"value":765},"Download to ",{"type":49,"tag":64,"props":767,"children":769},{"className":768},[],[770],{"type":55,"value":771},"\u002Ftmp\u002F",{"type":55,"value":773},":",{"type":49,"tag":557,"props":775,"children":779},{"className":776,"code":777,"language":778,"meta":562,"style":562},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","curl -sL \"{url}\" -o \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.orig\"\n","bash",[780],{"type":49,"tag":64,"props":781,"children":782},{"__ignoreMap":562},[783],{"type":49,"tag":568,"props":784,"children":785},{"class":570,"line":571},[786,792,797,802,807,812,817,821,826],{"type":49,"tag":568,"props":787,"children":789},{"style":788},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[790],{"type":55,"value":791},"curl",{"type":49,"tag":568,"props":793,"children":794},{"style":724},[795],{"type":55,"value":796}," -sL",{"type":49,"tag":568,"props":798,"children":799},{"style":648},[800],{"type":55,"value":801}," \"",{"type":49,"tag":568,"props":803,"children":804},{"style":724},[805],{"type":55,"value":806},"{url}",{"type":49,"tag":568,"props":808,"children":809},{"style":648},[810],{"type":55,"value":811},"\"",{"type":49,"tag":568,"props":813,"children":814},{"style":724},[815],{"type":55,"value":816}," -o",{"type":49,"tag":568,"props":818,"children":819},{"style":648},[820],{"type":55,"value":801},{"type":49,"tag":568,"props":822,"children":823},{"style":724},[824],{"type":55,"value":825},"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.orig",{"type":49,"tag":568,"props":827,"children":828},{"style":648},[829],{"type":55,"value":830},"\"\n",{"type":49,"tag":283,"props":832,"children":833},{"start":581},[834],{"type":49,"tag":120,"props":835,"children":836},{},[837],{"type":55,"value":838},"Ensure Pillow is available:",{"type":49,"tag":557,"props":840,"children":842},{"className":776,"code":841,"language":778,"meta":562,"style":562},"python3 -c \"from PIL import Image\" 2>\u002Fdev\u002Fnull || pip3 install Pillow -q\n",[843],{"type":49,"tag":64,"props":844,"children":845},{"__ignoreMap":562},[846],{"type":49,"tag":568,"props":847,"children":848},{"class":570,"line":571},[849,854,859,863,868,872,877,882,887,892,897,902],{"type":49,"tag":568,"props":850,"children":851},{"style":788},[852],{"type":55,"value":853},"python3",{"type":49,"tag":568,"props":855,"children":856},{"style":724},[857],{"type":55,"value":858}," -c",{"type":49,"tag":568,"props":860,"children":861},{"style":648},[862],{"type":55,"value":801},{"type":49,"tag":568,"props":864,"children":865},{"style":724},[866],{"type":55,"value":867},"from PIL import Image",{"type":49,"tag":568,"props":869,"children":870},{"style":648},[871],{"type":55,"value":811},{"type":49,"tag":568,"props":873,"children":874},{"style":648},[875],{"type":55,"value":876}," 2>",{"type":49,"tag":568,"props":878,"children":879},{"style":724},[880],{"type":55,"value":881},"\u002Fdev\u002Fnull",{"type":49,"tag":568,"props":883,"children":884},{"style":648},[885],{"type":55,"value":886}," ||",{"type":49,"tag":568,"props":888,"children":889},{"style":788},[890],{"type":55,"value":891}," pip3",{"type":49,"tag":568,"props":893,"children":894},{"style":724},[895],{"type":55,"value":896}," install",{"type":49,"tag":568,"props":898,"children":899},{"style":724},[900],{"type":55,"value":901}," Pillow",{"type":49,"tag":568,"props":903,"children":904},{"style":724},[905],{"type":55,"value":906}," -q\n",{"type":49,"tag":58,"props":908,"children":909},{},[910],{"type":55,"value":911},"For avif, also try:",{"type":49,"tag":557,"props":913,"children":915},{"className":776,"code":914,"language":778,"meta":562,"style":562},"pip3 install pillow-avif-plugin -q\n",[916],{"type":49,"tag":64,"props":917,"children":918},{"__ignoreMap":562},[919],{"type":49,"tag":568,"props":920,"children":921},{"class":570,"line":571},[922,927,931,936],{"type":49,"tag":568,"props":923,"children":924},{"style":788},[925],{"type":55,"value":926},"pip3",{"type":49,"tag":568,"props":928,"children":929},{"style":724},[930],{"type":55,"value":896},{"type":49,"tag":568,"props":932,"children":933},{"style":724},[934],{"type":55,"value":935}," pillow-avif-plugin",{"type":49,"tag":568,"props":937,"children":938},{"style":724},[939],{"type":55,"value":906},{"type":49,"tag":283,"props":941,"children":942},{"start":591},[943],{"type":49,"tag":120,"props":944,"children":945},{},[946],{"type":55,"value":947},"Convert with the user's quality setting:",{"type":49,"tag":557,"props":949,"children":951},{"className":776,"code":950,"language":778,"meta":562,"style":562},"python3 - \u003C\u003C'EOF'\nfrom PIL import Image\nimport os\n\ntry:\n    import pillow_avif\nexcept ImportError:\n    pass\n\nsource = \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.orig\"\ntarget = \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.{ext}\"\nimg = Image.open(source)\nimg.save(target, \"{FORMAT}\", quality={quality})\norig = os.path.getsize(source)\nnew = os.path.getsize(target)\nprint(f\"Original: {orig:,} bytes -> {FORMAT}: {new:,} bytes ({(1 - new \u002F orig) * 100:.1f}% smaller)\")\nEOF\n",[952],{"type":49,"tag":64,"props":953,"children":954},{"__ignoreMap":562},[955,977,985,993,1000,1008,1016,1024,1032,1039,1047,1055,1063,1071,1079,1087,1096],{"type":49,"tag":568,"props":956,"children":957},{"class":570,"line":571},[958,962,967,972],{"type":49,"tag":568,"props":959,"children":960},{"style":788},[961],{"type":55,"value":853},{"type":49,"tag":568,"props":963,"children":964},{"style":724},[965],{"type":55,"value":966}," -",{"type":49,"tag":568,"props":968,"children":969},{"style":648},[970],{"type":55,"value":971}," \u003C\u003C",{"type":49,"tag":568,"props":973,"children":974},{"style":648},[975],{"type":55,"value":976},"'EOF'\n",{"type":49,"tag":568,"props":978,"children":979},{"class":570,"line":581},[980],{"type":49,"tag":568,"props":981,"children":982},{"style":724},[983],{"type":55,"value":984},"from PIL import Image\n",{"type":49,"tag":568,"props":986,"children":987},{"class":570,"line":591},[988],{"type":49,"tag":568,"props":989,"children":990},{"style":724},[991],{"type":55,"value":992},"import os\n",{"type":49,"tag":568,"props":994,"children":995},{"class":570,"line":600},[996],{"type":49,"tag":568,"props":997,"children":998},{"emptyLinePlaceholder":585},[999],{"type":55,"value":588},{"type":49,"tag":568,"props":1001,"children":1002},{"class":570,"line":609},[1003],{"type":49,"tag":568,"props":1004,"children":1005},{"style":724},[1006],{"type":55,"value":1007},"try:\n",{"type":49,"tag":568,"props":1009,"children":1010},{"class":570,"line":618},[1011],{"type":49,"tag":568,"props":1012,"children":1013},{"style":724},[1014],{"type":55,"value":1015},"    import pillow_avif\n",{"type":49,"tag":568,"props":1017,"children":1018},{"class":570,"line":627},[1019],{"type":49,"tag":568,"props":1020,"children":1021},{"style":724},[1022],{"type":55,"value":1023},"except ImportError:\n",{"type":49,"tag":568,"props":1025,"children":1026},{"class":570,"line":635},[1027],{"type":49,"tag":568,"props":1028,"children":1029},{"style":724},[1030],{"type":55,"value":1031},"    pass\n",{"type":49,"tag":568,"props":1033,"children":1034},{"class":570,"line":644},[1035],{"type":49,"tag":568,"props":1036,"children":1037},{"emptyLinePlaceholder":585},[1038],{"type":55,"value":588},{"type":49,"tag":568,"props":1040,"children":1041},{"class":570,"line":659},[1042],{"type":49,"tag":568,"props":1043,"children":1044},{"style":724},[1045],{"type":55,"value":1046},"source = \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.orig\"\n",{"type":49,"tag":568,"props":1048,"children":1049},{"class":570,"line":672},[1050],{"type":49,"tag":568,"props":1051,"children":1052},{"style":724},[1053],{"type":55,"value":1054},"target = \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.{ext}\"\n",{"type":49,"tag":568,"props":1056,"children":1057},{"class":570,"line":680},[1058],{"type":49,"tag":568,"props":1059,"children":1060},{"style":724},[1061],{"type":55,"value":1062},"img = Image.open(source)\n",{"type":49,"tag":568,"props":1064,"children":1065},{"class":570,"line":689},[1066],{"type":49,"tag":568,"props":1067,"children":1068},{"style":724},[1069],{"type":55,"value":1070},"img.save(target, \"{FORMAT}\", quality={quality})\n",{"type":49,"tag":568,"props":1072,"children":1073},{"class":570,"line":702},[1074],{"type":49,"tag":568,"props":1075,"children":1076},{"style":724},[1077],{"type":55,"value":1078},"orig = os.path.getsize(source)\n",{"type":49,"tag":568,"props":1080,"children":1081},{"class":570,"line":710},[1082],{"type":49,"tag":568,"props":1083,"children":1084},{"style":724},[1085],{"type":55,"value":1086},"new = os.path.getsize(target)\n",{"type":49,"tag":568,"props":1088,"children":1090},{"class":570,"line":1089},16,[1091],{"type":49,"tag":568,"props":1092,"children":1093},{"style":724},[1094],{"type":55,"value":1095},"print(f\"Original: {orig:,} bytes -> {FORMAT}: {new:,} bytes ({(1 - new \u002F orig) * 100:.1f}% smaller)\")\n",{"type":49,"tag":568,"props":1097,"children":1098},{"class":570,"line":34},[1099],{"type":49,"tag":568,"props":1100,"children":1101},{"style":648},[1102],{"type":55,"value":1103},"EOF\n",{"type":49,"tag":58,"props":1105,"children":1106},{},[1107],{"type":55,"value":1108},"If avif conversion fails, report the error and ask whether to fall back to webp or abort.",{"type":49,"tag":283,"props":1110,"children":1111},{"start":600},[1112],{"type":49,"tag":120,"props":1113,"children":1114},{},[1115],{"type":55,"value":1116},"Compute the MD5 hash of the converted file:",{"type":49,"tag":557,"props":1118,"children":1120},{"className":776,"code":1119,"language":778,"meta":562,"style":562},"md5 -q \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.{ext}\"\n",[1121],{"type":49,"tag":64,"props":1122,"children":1123},{"__ignoreMap":562},[1124],{"type":49,"tag":568,"props":1125,"children":1126},{"class":570,"line":571},[1127,1132,1137,1141,1146],{"type":49,"tag":568,"props":1128,"children":1129},{"style":788},[1130],{"type":55,"value":1131},"md5",{"type":49,"tag":568,"props":1133,"children":1134},{"style":724},[1135],{"type":55,"value":1136}," -q",{"type":49,"tag":568,"props":1138,"children":1139},{"style":648},[1140],{"type":55,"value":801},{"type":49,"tag":568,"props":1142,"children":1143},{"style":724},[1144],{"type":55,"value":1145},"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.{ext}",{"type":49,"tag":568,"props":1147,"children":1148},{"style":648},[1149],{"type":55,"value":830},{"type":49,"tag":58,"props":1151,"children":1152},{},[1153],{"type":55,"value":1154},"On Linux:",{"type":49,"tag":557,"props":1156,"children":1158},{"className":776,"code":1157,"language":778,"meta":562,"style":562},"md5sum \"\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.{ext}\" | cut -d' ' -f1\n",[1159],{"type":49,"tag":64,"props":1160,"children":1161},{"__ignoreMap":562},[1162],{"type":49,"tag":568,"props":1163,"children":1164},{"class":570,"line":571},[1165,1170,1174,1178,1182,1187,1192,1197,1202,1207],{"type":49,"tag":568,"props":1166,"children":1167},{"style":788},[1168],{"type":55,"value":1169},"md5sum",{"type":49,"tag":568,"props":1171,"children":1172},{"style":648},[1173],{"type":55,"value":801},{"type":49,"tag":568,"props":1175,"children":1176},{"style":724},[1177],{"type":55,"value":1145},{"type":49,"tag":568,"props":1179,"children":1180},{"style":648},[1181],{"type":55,"value":811},{"type":49,"tag":568,"props":1183,"children":1184},{"style":648},[1185],{"type":55,"value":1186}," |",{"type":49,"tag":568,"props":1188,"children":1189},{"style":788},[1190],{"type":55,"value":1191}," cut",{"type":49,"tag":568,"props":1193,"children":1194},{"style":724},[1195],{"type":55,"value":1196}," -d",{"type":49,"tag":568,"props":1198,"children":1199},{"style":648},[1200],{"type":55,"value":1201},"'",{"type":49,"tag":568,"props":1203,"children":1204},{"style":648},[1205],{"type":55,"value":1206}," '",{"type":49,"tag":568,"props":1208,"children":1209},{"style":724},[1210],{"type":55,"value":1211}," -f1\n",{"type":49,"tag":271,"props":1213,"children":1215},{"id":1214},"phase-6-upload-to-webflow-assets",[1216],{"type":55,"value":1217},"Phase 6: Upload to Webflow Assets",{"type":49,"tag":58,"props":1219,"children":1220},{},[1221],{"type":55,"value":1222},"For each converted file:",{"type":49,"tag":283,"props":1224,"children":1225},{},[1226,1252,1310,1362,1537],{"type":49,"tag":120,"props":1227,"children":1228},{},[1229,1231,1237,1239,1244,1245,1250],{"type":55,"value":1230},"Determine ",{"type":49,"tag":64,"props":1232,"children":1234},{"className":1233},[],[1235],{"type":55,"value":1236},"site_id",{"type":55,"value":1238},". If it is not known from the collection or prior context, call ",{"type":49,"tag":64,"props":1240,"children":1242},{"className":1241},[],[1243],{"type":55,"value":130},{"type":55,"value":132},{"type":49,"tag":64,"props":1246,"children":1248},{"className":1247},[],[1249],{"type":55,"value":138},{"type":55,"value":1251},". If multiple sites are available, ask the user which one owns the collection.",{"type":49,"tag":120,"props":1253,"children":1254},{},[1255,1256,1261,1262,1267,1269],{"type":55,"value":398},{"type":49,"tag":64,"props":1257,"children":1259},{"className":1258},[],[1260],{"type":55,"value":187},{"type":55,"value":132},{"type":49,"tag":64,"props":1263,"children":1265},{"className":1264},[],[1266],{"type":55,"value":194},{"type":55,"value":1268},":\n",{"type":49,"tag":116,"props":1270,"children":1271},{},[1272,1282,1299],{"type":49,"tag":120,"props":1273,"children":1274},{},[1275,1280],{"type":49,"tag":64,"props":1276,"children":1278},{"className":1277},[],[1279],{"type":55,"value":1236},{"type":55,"value":1281},": the target site ID",{"type":49,"tag":120,"props":1283,"children":1284},{},[1285,1291,1293],{"type":49,"tag":64,"props":1286,"children":1288},{"className":1287},[],[1289],{"type":55,"value":1290},"file_name",{"type":55,"value":1292},": original base name plus the new extension, such as ",{"type":49,"tag":64,"props":1294,"children":1296},{"className":1295},[],[1297],{"type":55,"value":1298},"hero.webp",{"type":49,"tag":120,"props":1300,"children":1301},{},[1302,1308],{"type":49,"tag":64,"props":1303,"children":1305},{"className":1304},[],[1306],{"type":55,"value":1307},"file_hash",{"type":55,"value":1309},": the MD5 hex string",{"type":49,"tag":120,"props":1311,"children":1312},{},[1313,1315],{"type":55,"value":1314},"Capture the response values:\n",{"type":49,"tag":116,"props":1316,"children":1317},{},[1318,1329,1340,1351],{"type":49,"tag":120,"props":1319,"children":1320},{},[1321,1327],{"type":49,"tag":64,"props":1322,"children":1324},{"className":1323},[],[1325],{"type":55,"value":1326},"uploadUrl",{"type":55,"value":1328},": S3 endpoint",{"type":49,"tag":120,"props":1330,"children":1331},{},[1332,1338],{"type":49,"tag":64,"props":1333,"children":1335},{"className":1334},[],[1336],{"type":55,"value":1337},"uploadDetails",{"type":55,"value":1339},": form fields",{"type":49,"tag":120,"props":1341,"children":1342},{},[1343,1349],{"type":49,"tag":64,"props":1344,"children":1346},{"className":1345},[],[1347],{"type":55,"value":1348},"id",{"type":55,"value":1350},": new asset ID",{"type":49,"tag":120,"props":1352,"children":1353},{},[1354,1360],{"type":49,"tag":64,"props":1355,"children":1357},{"className":1356},[],[1358],{"type":55,"value":1359},"hostedUrl",{"type":55,"value":1361},": CDN URL to use as the CMS source reference",{"type":49,"tag":120,"props":1363,"children":1364},{},[1365,1367,1372,1374],{"type":55,"value":1366},"POST to S3 as multipart\u002Fform-data. Map ",{"type":49,"tag":64,"props":1368,"children":1370},{"className":1369},[],[1371],{"type":55,"value":1337},{"type":55,"value":1373}," keys to curl fields:\n",{"type":49,"tag":116,"props":1375,"children":1376},{},[1377,1394,1410,1426,1442,1458,1474,1490,1526],{"type":49,"tag":120,"props":1378,"children":1379},{},[1380,1386,1388],{"type":49,"tag":64,"props":1381,"children":1383},{"className":1382},[],[1384],{"type":55,"value":1385},"xAmzAlgorithm",{"type":55,"value":1387}," -> ",{"type":49,"tag":64,"props":1389,"children":1391},{"className":1390},[],[1392],{"type":55,"value":1393},"X-Amz-Algorithm",{"type":49,"tag":120,"props":1395,"children":1396},{},[1397,1403,1404],{"type":49,"tag":64,"props":1398,"children":1400},{"className":1399},[],[1401],{"type":55,"value":1402},"xAmzCredential",{"type":55,"value":1387},{"type":49,"tag":64,"props":1405,"children":1407},{"className":1406},[],[1408],{"type":55,"value":1409},"X-Amz-Credential",{"type":49,"tag":120,"props":1411,"children":1412},{},[1413,1419,1420],{"type":49,"tag":64,"props":1414,"children":1416},{"className":1415},[],[1417],{"type":55,"value":1418},"xAmzDate",{"type":55,"value":1387},{"type":49,"tag":64,"props":1421,"children":1423},{"className":1422},[],[1424],{"type":55,"value":1425},"X-Amz-Date",{"type":49,"tag":120,"props":1427,"children":1428},{},[1429,1435,1436],{"type":49,"tag":64,"props":1430,"children":1432},{"className":1431},[],[1433],{"type":55,"value":1434},"xAmzSignature",{"type":55,"value":1387},{"type":49,"tag":64,"props":1437,"children":1439},{"className":1438},[],[1440],{"type":55,"value":1441},"X-Amz-Signature",{"type":49,"tag":120,"props":1443,"children":1444},{},[1445,1451,1452],{"type":49,"tag":64,"props":1446,"children":1448},{"className":1447},[],[1449],{"type":55,"value":1450},"successActionStatus",{"type":55,"value":1387},{"type":49,"tag":64,"props":1453,"children":1455},{"className":1454},[],[1456],{"type":55,"value":1457},"success_action_status",{"type":49,"tag":120,"props":1459,"children":1460},{},[1461,1467,1468],{"type":49,"tag":64,"props":1462,"children":1464},{"className":1463},[],[1465],{"type":55,"value":1466},"contentType",{"type":55,"value":1387},{"type":49,"tag":64,"props":1469,"children":1471},{"className":1470},[],[1472],{"type":55,"value":1473},"Content-Type",{"type":49,"tag":120,"props":1475,"children":1476},{},[1477,1483,1484],{"type":49,"tag":64,"props":1478,"children":1480},{"className":1479},[],[1481],{"type":55,"value":1482},"cacheControl",{"type":55,"value":1387},{"type":49,"tag":64,"props":1485,"children":1487},{"className":1486},[],[1488],{"type":55,"value":1489},"Cache-Control",{"type":49,"tag":120,"props":1491,"children":1492},{},[1493,1495,1501,1503,1509,1510,1516,1518,1524],{"type":55,"value":1494},"Pass ",{"type":49,"tag":64,"props":1496,"children":1498},{"className":1497},[],[1499],{"type":55,"value":1500},"acl",{"type":55,"value":1502},", ",{"type":49,"tag":64,"props":1504,"children":1506},{"className":1505},[],[1507],{"type":55,"value":1508},"bucket",{"type":55,"value":1502},{"type":49,"tag":64,"props":1511,"children":1513},{"className":1512},[],[1514],{"type":55,"value":1515},"key",{"type":55,"value":1517},", and ",{"type":49,"tag":64,"props":1519,"children":1521},{"className":1520},[],[1522],{"type":55,"value":1523},"policy",{"type":55,"value":1525}," as-is",{"type":49,"tag":120,"props":1527,"children":1528},{},[1529,1531],{"type":55,"value":1530},"Append the file last: ",{"type":49,"tag":64,"props":1532,"children":1534},{"className":1533},[],[1535],{"type":55,"value":1536},"-F \"file=@\u002Ftmp\u002Fcms_img_{fieldSlug}_{index}.{ext};type=image\u002F{ext}\"",{"type":49,"tag":120,"props":1538,"children":1539},{},[1540],{"type":55,"value":1541},"Expect HTTP 201. If the response is not 201, log the response body and report the upload error. Presigned URLs have a one-hour TTL; restart from asset creation if the URL expires.",{"type":49,"tag":271,"props":1543,"children":1545},{"id":1544},"phase-7-update-and-publish",[1546],{"type":55,"value":1547},"Phase 7: Update and Publish",{"type":49,"tag":58,"props":1549,"children":1550},{},[1551,1552,1557,1558,1563],{"type":55,"value":398},{"type":49,"tag":64,"props":1553,"children":1555},{"className":1554},[],[1556],{"type":55,"value":150},{"type":55,"value":132},{"type":49,"tag":64,"props":1559,"children":1561},{"className":1560},[],[1562],{"type":55,"value":212},{"type":55,"value":1564}," using only fields that were successfully converted and uploaded.",{"type":49,"tag":58,"props":1566,"children":1567},{},[1568],{"type":55,"value":1569},"For Image fields, set:",{"type":49,"tag":557,"props":1571,"children":1575},{"className":1572,"code":1573,"language":1574,"meta":562,"style":562},"language-json shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","{\n  \"fieldSlug\": {\n    \"fileId\": \"{newAssetId}\",\n    \"url\": \"{hostedUrl}\"\n  }\n}\n","json",[1576],{"type":49,"tag":64,"props":1577,"children":1578},{"__ignoreMap":562},[1579,1587,1614,1652,1684,1692],{"type":49,"tag":568,"props":1580,"children":1581},{"class":570,"line":571},[1582],{"type":49,"tag":568,"props":1583,"children":1584},{"style":648},[1585],{"type":55,"value":1586},"{\n",{"type":49,"tag":568,"props":1588,"children":1589},{"class":570,"line":581},[1590,1595,1601,1605,1609],{"type":49,"tag":568,"props":1591,"children":1592},{"style":648},[1593],{"type":55,"value":1594},"  \"",{"type":49,"tag":568,"props":1596,"children":1598},{"style":1597},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[1599],{"type":55,"value":1600},"fieldSlug",{"type":49,"tag":568,"props":1602,"children":1603},{"style":648},[1604],{"type":55,"value":811},{"type":49,"tag":568,"props":1606,"children":1607},{"style":648},[1608],{"type":55,"value":773},{"type":49,"tag":568,"props":1610,"children":1611},{"style":648},[1612],{"type":55,"value":1613}," {\n",{"type":49,"tag":568,"props":1615,"children":1616},{"class":570,"line":591},[1617,1622,1626,1630,1634,1638,1643,1647],{"type":49,"tag":568,"props":1618,"children":1619},{"style":648},[1620],{"type":55,"value":1621},"    \"",{"type":49,"tag":568,"props":1623,"children":1624},{"style":788},[1625],{"type":55,"value":516},{"type":49,"tag":568,"props":1627,"children":1628},{"style":648},[1629],{"type":55,"value":811},{"type":49,"tag":568,"props":1631,"children":1632},{"style":648},[1633],{"type":55,"value":773},{"type":49,"tag":568,"props":1635,"children":1636},{"style":648},[1637],{"type":55,"value":801},{"type":49,"tag":568,"props":1639,"children":1640},{"style":724},[1641],{"type":55,"value":1642},"{newAssetId}",{"type":49,"tag":568,"props":1644,"children":1645},{"style":648},[1646],{"type":55,"value":811},{"type":49,"tag":568,"props":1648,"children":1649},{"style":648},[1650],{"type":55,"value":1651},",\n",{"type":49,"tag":568,"props":1653,"children":1654},{"class":570,"line":600},[1655,1659,1663,1667,1671,1675,1680],{"type":49,"tag":568,"props":1656,"children":1657},{"style":648},[1658],{"type":55,"value":1621},{"type":49,"tag":568,"props":1660,"children":1661},{"style":788},[1662],{"type":55,"value":508},{"type":49,"tag":568,"props":1664,"children":1665},{"style":648},[1666],{"type":55,"value":811},{"type":49,"tag":568,"props":1668,"children":1669},{"style":648},[1670],{"type":55,"value":773},{"type":49,"tag":568,"props":1672,"children":1673},{"style":648},[1674],{"type":55,"value":801},{"type":49,"tag":568,"props":1676,"children":1677},{"style":724},[1678],{"type":55,"value":1679},"{hostedUrl}",{"type":49,"tag":568,"props":1681,"children":1682},{"style":648},[1683],{"type":55,"value":830},{"type":49,"tag":568,"props":1685,"children":1686},{"class":570,"line":609},[1687],{"type":49,"tag":568,"props":1688,"children":1689},{"style":648},[1690],{"type":55,"value":1691},"  }\n",{"type":49,"tag":568,"props":1693,"children":1694},{"class":570,"line":618},[1695],{"type":49,"tag":568,"props":1696,"children":1697},{"style":648},[1698],{"type":55,"value":1699},"}\n",{"type":49,"tag":58,"props":1701,"children":1702},{},[1703,1705,1711],{"type":55,"value":1704},"For MultiImage fields, reconstruct the full image array and replace only successfully processed entries with the new ",{"type":49,"tag":64,"props":1706,"children":1708},{"className":1707},[],[1709],{"type":55,"value":1710},"{ \"fileId\", \"url\" }",{"type":55,"value":1712}," values. Preserve skipped entries exactly as they were.",{"type":49,"tag":58,"props":1714,"children":1715},{},[1716,1718,1723,1724,1729,1731,1736],{"type":55,"value":1717},"After a successful update, call ",{"type":49,"tag":64,"props":1719,"children":1721},{"className":1720},[],[1722],{"type":55,"value":150},{"type":55,"value":132},{"type":49,"tag":64,"props":1725,"children":1727},{"className":1726},[],[1728],{"type":55,"value":230},{"type":55,"value":1730}," for the item ID. The CMS may re-process the image and generate its own CDN URL; the ",{"type":49,"tag":64,"props":1732,"children":1734},{"className":1733},[],[1735],{"type":55,"value":1359},{"type":55,"value":1737}," from the asset upload is the source reference.",{"type":49,"tag":271,"props":1739,"children":1741},{"id":1740},"phase-8-report-results",[1742],{"type":55,"value":1743},"Phase 8: Report Results",{"type":49,"tag":58,"props":1745,"children":1746},{},[1747],{"type":55,"value":1748},"Print a concise summary table:",{"type":49,"tag":1750,"props":1751,"children":1752},"table",{},[1753,1782],{"type":49,"tag":1754,"props":1755,"children":1756},"thead",{},[1757],{"type":49,"tag":1758,"props":1759,"children":1760},"tr",{},[1761,1767,1772,1777],{"type":49,"tag":1762,"props":1763,"children":1764},"th",{},[1765],{"type":55,"value":1766},"Field",{"type":49,"tag":1762,"props":1768,"children":1769},{},[1770],{"type":55,"value":1771},"Original",{"type":49,"tag":1762,"props":1773,"children":1774},{},[1775],{"type":55,"value":1776},"Converted",{"type":49,"tag":1762,"props":1778,"children":1779},{},[1780],{"type":55,"value":1781},"Savings",{"type":49,"tag":1783,"props":1784,"children":1785},"tbody",{},[1786],{"type":49,"tag":1758,"props":1787,"children":1788},{},[1789,1795,1800,1805],{"type":49,"tag":1790,"props":1791,"children":1792},"td",{},[1793],{"type":55,"value":1794},"main-image",{"type":49,"tag":1790,"props":1796,"children":1797},{},[1798],{"type":55,"value":1799},"118,044 B (JPEG)",{"type":49,"tag":1790,"props":1801,"children":1802},{},[1803],{"type":55,"value":1804},"113,260 B (webp)",{"type":49,"tag":1790,"props":1806,"children":1807},{},[1808],{"type":55,"value":1809},"4.1%",{"type":49,"tag":58,"props":1811,"children":1812},{},[1813],{"type":55,"value":1814},"Also report:",{"type":49,"tag":116,"props":1816,"children":1817},{},[1818,1823,1828,1833],{"type":49,"tag":120,"props":1819,"children":1820},{},[1821],{"type":55,"value":1822},"Fields skipped because they were null, empty, malformed, already in the target format, or not image fields",{"type":49,"tag":120,"props":1824,"children":1825},{},[1826],{"type":55,"value":1827},"Conversion failures and whether the user chose fallback or abort",{"type":49,"tag":120,"props":1829,"children":1830},{},[1831],{"type":55,"value":1832},"Upload failures, including response bodies when available",{"type":49,"tag":120,"props":1834,"children":1835},{},[1836],{"type":55,"value":1837},"New asset IDs for uploads that succeeded when a later CMS update or publish failed",{"type":49,"tag":100,"props":1839,"children":1841},{"id":1840},"examples",[1842],{"type":55,"value":1843},"Examples",{"type":49,"tag":58,"props":1845,"children":1846},{},[1847],{"type":49,"tag":110,"props":1848,"children":1849},{},[1850],{"type":55,"value":1851},"User prompt:",{"type":49,"tag":557,"props":1853,"children":1857},{"className":1854,"code":1856,"language":55,"meta":562},[1855],"language-text","Compress the main image on this CMS item to webp.\n",[1858],{"type":49,"tag":64,"props":1859,"children":1860},{"__ignoreMap":562},[1861],{"type":55,"value":1856},{"type":49,"tag":58,"props":1863,"children":1864},{},[1865],{"type":49,"tag":110,"props":1866,"children":1867},{},[1868],{"type":55,"value":1869},"Response flow:",{"type":49,"tag":557,"props":1871,"children":1873},{"className":559,"code":1872,"language":561,"meta":562,"style":562},"I need the collection ID, item ID, image fields, target format, and quality before compressing the CMS image.\n\nCompression Preview\n\nCollection: 65f...\nItem: 66a...\nTarget format: webp\nQuality: 85\n\nFields to process:\n- main-image: blog-hero.jpg -> blog-hero.webp\n\nType `confirm` to download, convert, upload, update the CMS item, and publish.\n",[1874],{"type":49,"tag":64,"props":1875,"children":1876},{"__ignoreMap":562},[1877,1885,1892,1899,1906,1914,1922,1929,1936,1943,1950,1962,1969],{"type":49,"tag":568,"props":1878,"children":1879},{"class":570,"line":571},[1880],{"type":49,"tag":568,"props":1881,"children":1882},{"style":575},[1883],{"type":55,"value":1884},"I need the collection ID, item ID, image fields, target format, and quality before compressing the CMS image.\n",{"type":49,"tag":568,"props":1886,"children":1887},{"class":570,"line":581},[1888],{"type":49,"tag":568,"props":1889,"children":1890},{"emptyLinePlaceholder":585},[1891],{"type":55,"value":588},{"type":49,"tag":568,"props":1893,"children":1894},{"class":570,"line":591},[1895],{"type":49,"tag":568,"props":1896,"children":1897},{"style":575},[1898],{"type":55,"value":578},{"type":49,"tag":568,"props":1900,"children":1901},{"class":570,"line":600},[1902],{"type":49,"tag":568,"props":1903,"children":1904},{"emptyLinePlaceholder":585},[1905],{"type":55,"value":588},{"type":49,"tag":568,"props":1907,"children":1908},{"class":570,"line":609},[1909],{"type":49,"tag":568,"props":1910,"children":1911},{"style":575},[1912],{"type":55,"value":1913},"Collection: 65f...\n",{"type":49,"tag":568,"props":1915,"children":1916},{"class":570,"line":618},[1917],{"type":49,"tag":568,"props":1918,"children":1919},{"style":575},[1920],{"type":55,"value":1921},"Item: 66a...\n",{"type":49,"tag":568,"props":1923,"children":1924},{"class":570,"line":627},[1925],{"type":49,"tag":568,"props":1926,"children":1927},{"style":575},[1928],{"type":55,"value":615},{"type":49,"tag":568,"props":1930,"children":1931},{"class":570,"line":635},[1932],{"type":49,"tag":568,"props":1933,"children":1934},{"style":575},[1935],{"type":55,"value":624},{"type":49,"tag":568,"props":1937,"children":1938},{"class":570,"line":644},[1939],{"type":49,"tag":568,"props":1940,"children":1941},{"emptyLinePlaceholder":585},[1942],{"type":55,"value":588},{"type":49,"tag":568,"props":1944,"children":1945},{"class":570,"line":659},[1946],{"type":49,"tag":568,"props":1947,"children":1948},{"style":575},[1949],{"type":55,"value":641},{"type":49,"tag":568,"props":1951,"children":1952},{"class":570,"line":672},[1953,1957],{"type":49,"tag":568,"props":1954,"children":1955},{"style":648},[1956],{"type":55,"value":651},{"type":49,"tag":568,"props":1958,"children":1959},{"style":575},[1960],{"type":55,"value":1961}," main-image: blog-hero.jpg -> blog-hero.webp\n",{"type":49,"tag":568,"props":1963,"children":1964},{"class":570,"line":680},[1965],{"type":49,"tag":568,"props":1966,"children":1967},{"emptyLinePlaceholder":585},[1968],{"type":55,"value":588},{"type":49,"tag":568,"props":1970,"children":1971},{"class":570,"line":689},[1972,1976,1980,1984,1988],{"type":49,"tag":568,"props":1973,"children":1974},{"style":575},[1975],{"type":55,"value":716},{"type":49,"tag":568,"props":1977,"children":1978},{"style":648},[1979],{"type":55,"value":721},{"type":49,"tag":568,"props":1981,"children":1982},{"style":724},[1983],{"type":55,"value":256},{"type":49,"tag":568,"props":1985,"children":1986},{"style":648},[1987],{"type":55,"value":721},{"type":49,"tag":568,"props":1989,"children":1990},{"style":575},[1991],{"type":55,"value":735},{"type":49,"tag":58,"props":1993,"children":1994},{},[1995],{"type":49,"tag":110,"props":1996,"children":1997},{},[1998],{"type":55,"value":1999},"Final report:",{"type":49,"tag":557,"props":2001,"children":2003},{"className":559,"code":2002,"language":561,"meta":562,"style":562},"CMS Image Compression Complete\n\n| Field | Original | Converted | Savings |\n|-------|----------|-----------|---------|\n| main-image | 842,911 B (JPEG) | 214,330 B (webp) | 74.6% |\n\nUpdated and published item 66a...\n",[2004],{"type":49,"tag":64,"props":2005,"children":2006},{"__ignoreMap":562},[2007,2015,2022,2067,2075,2118,2125],{"type":49,"tag":568,"props":2008,"children":2009},{"class":570,"line":571},[2010],{"type":49,"tag":568,"props":2011,"children":2012},{"style":575},[2013],{"type":55,"value":2014},"CMS Image Compression Complete\n",{"type":49,"tag":568,"props":2016,"children":2017},{"class":570,"line":581},[2018],{"type":49,"tag":568,"props":2019,"children":2020},{"emptyLinePlaceholder":585},[2021],{"type":55,"value":588},{"type":49,"tag":568,"props":2023,"children":2024},{"class":570,"line":591},[2025,2030,2035,2039,2044,2048,2053,2057,2062],{"type":49,"tag":568,"props":2026,"children":2027},{"style":648},[2028],{"type":55,"value":2029},"|",{"type":49,"tag":568,"props":2031,"children":2032},{"style":575},[2033],{"type":55,"value":2034}," Field ",{"type":49,"tag":568,"props":2036,"children":2037},{"style":648},[2038],{"type":55,"value":2029},{"type":49,"tag":568,"props":2040,"children":2041},{"style":575},[2042],{"type":55,"value":2043}," Original ",{"type":49,"tag":568,"props":2045,"children":2046},{"style":648},[2047],{"type":55,"value":2029},{"type":49,"tag":568,"props":2049,"children":2050},{"style":575},[2051],{"type":55,"value":2052}," Converted ",{"type":49,"tag":568,"props":2054,"children":2055},{"style":648},[2056],{"type":55,"value":2029},{"type":49,"tag":568,"props":2058,"children":2059},{"style":575},[2060],{"type":55,"value":2061}," Savings ",{"type":49,"tag":568,"props":2063,"children":2064},{"style":648},[2065],{"type":55,"value":2066},"|\n",{"type":49,"tag":568,"props":2068,"children":2069},{"class":570,"line":600},[2070],{"type":49,"tag":568,"props":2071,"children":2072},{"style":648},[2073],{"type":55,"value":2074},"|-------|----------|-----------|---------|\n",{"type":49,"tag":568,"props":2076,"children":2077},{"class":570,"line":609},[2078,2082,2087,2091,2096,2100,2105,2109,2114],{"type":49,"tag":568,"props":2079,"children":2080},{"style":648},[2081],{"type":55,"value":2029},{"type":49,"tag":568,"props":2083,"children":2084},{"style":575},[2085],{"type":55,"value":2086}," main-image ",{"type":49,"tag":568,"props":2088,"children":2089},{"style":648},[2090],{"type":55,"value":2029},{"type":49,"tag":568,"props":2092,"children":2093},{"style":575},[2094],{"type":55,"value":2095}," 842,911 B (JPEG) ",{"type":49,"tag":568,"props":2097,"children":2098},{"style":648},[2099],{"type":55,"value":2029},{"type":49,"tag":568,"props":2101,"children":2102},{"style":575},[2103],{"type":55,"value":2104}," 214,330 B (webp) ",{"type":49,"tag":568,"props":2106,"children":2107},{"style":648},[2108],{"type":55,"value":2029},{"type":49,"tag":568,"props":2110,"children":2111},{"style":575},[2112],{"type":55,"value":2113}," 74.6% ",{"type":49,"tag":568,"props":2115,"children":2116},{"style":648},[2117],{"type":55,"value":2066},{"type":49,"tag":568,"props":2119,"children":2120},{"class":570,"line":618},[2121],{"type":49,"tag":568,"props":2122,"children":2123},{"emptyLinePlaceholder":585},[2124],{"type":55,"value":588},{"type":49,"tag":568,"props":2126,"children":2127},{"class":570,"line":627},[2128],{"type":49,"tag":568,"props":2129,"children":2130},{"style":575},[2131],{"type":55,"value":2132},"Updated and published item 66a...\n",{"type":49,"tag":100,"props":2134,"children":2136},{"id":2135},"guidelines",[2137],{"type":55,"value":2138},"Guidelines",{"type":49,"tag":116,"props":2140,"children":2141},{},[2142,2147,2152,2164,2169,2174],{"type":49,"tag":120,"props":2143,"children":2144},{},[2145],{"type":55,"value":2146},"Handle one CMS item at a time. For bulk operations across many items, rerun the skill for each item or extend the workflow with an explicit loop.",{"type":49,"tag":120,"props":2148,"children":2149},{},[2150],{"type":55,"value":2151},"Do not delete the original JPEG or PNG from Webflow's asset store; only update the CMS field reference.",{"type":49,"tag":120,"props":2153,"children":2154},{},[2155,2157,2163],{"type":55,"value":2156},"Preserve filenames by stripping the original extension and appending the target extension. Avoid double extensions such as ",{"type":49,"tag":64,"props":2158,"children":2160},{"className":2159},[],[2161],{"type":55,"value":2162},"hero.jpg.webp",{"type":55,"value":79},{"type":49,"tag":120,"props":2165,"children":2166},{},[2167],{"type":55,"value":2168},"Continue processing other selected fields after a single image conversion or upload failure unless the failed field is the only target.",{"type":49,"tag":120,"props":2170,"children":2171},{},[2172],{"type":55,"value":2173},"Never update or publish the CMS item if no image was successfully converted and uploaded.",{"type":49,"tag":120,"props":2175,"children":2176},{},[2177],{"type":55,"value":2178},"Keep a local in-memory rollback note with the original image field values and include it in the final report when an update succeeds.",{"type":49,"tag":2180,"props":2181,"children":2182},"style",{},[2183],{"type":55,"value":2184},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"items":2186,"total":2375},[2187,2208,2225,2242,2259,2275,2291,2305,2319,2331,2345,2361],{"slug":2188,"name":2189,"fn":2190,"description":2191,"org":2192,"tags":2193,"stars":30,"repoUrl":31,"updatedAt":2207},"webflow-clicloud","webflow-cli:cloud","deploy applications to Webflow Cloud","Initialize, build, and deploy full-stack Webflow applications to Webflow Cloud hosting. Supports site-attached deploys (linked to an existing Webflow site) and project app deploys (independent project, no existing site required). Use when creating new projects, deploying existing ones, or setting up CI\u002FCD pipelines for Webflow Cloud.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2194,2197,2200,2203,2206],{"name":2195,"slug":2196,"type":16},"CLI","cli",{"name":2198,"slug":2199,"type":16},"Cloud","cloud",{"name":2201,"slug":2202,"type":16},"Deployment","deployment",{"name":2204,"slug":2205,"type":16},"Full-stack","full-stack",{"name":10,"slug":9,"type":16},"2026-05-18T06:47:47.514609",{"slug":2209,"name":2210,"fn":2211,"description":2212,"org":2213,"tags":2214,"stars":30,"repoUrl":31,"updatedAt":2224},"webflow-clicode-component","webflow-cli:code-component","create and deploy Webflow Code Components","Create and deploy reusable React components for Webflow Designer. Configure existing React projects with webflow.json, build and bundle code, validate output, and deploy to workspace using library share. Use when building custom components for designers.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2215,2216,2217,2220,2223],{"name":2195,"slug":2196,"type":16},{"name":2201,"slug":2202,"type":16},{"name":2218,"slug":2219,"type":16},"React","react",{"name":2221,"slug":2222,"type":16},"UI Components","ui-components",{"name":10,"slug":9,"type":16},"2026-05-18T06:47:41.421071",{"slug":2226,"name":2227,"fn":2228,"description":2229,"org":2230,"tags":2231,"stars":30,"repoUrl":31,"updatedAt":2241},"webflow-clidesigner-extension","webflow-cli:designer-extension","build Webflow Designer Extensions","Build Designer Extensions for custom Webflow Designer functionality. Lists available templates, initializes extension projects from templates (default\u002Freact\u002Ftypescript-alt), bundles extensions for upload, and serves locally for development.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2232,2233,2236,2237,2240],{"name":2195,"slug":2196,"type":16},{"name":2234,"slug":2235,"type":16},"Plugin Development","plugin-development",{"name":2218,"slug":2219,"type":16},{"name":2238,"slug":2239,"type":16},"TypeScript","typescript",{"name":10,"slug":9,"type":16},"2026-05-18T06:47:43.853573",{"slug":2243,"name":2244,"fn":2245,"description":2246,"org":2247,"tags":2248,"stars":30,"repoUrl":31,"updatedAt":2258},"webflow-clidevlink","webflow-cli:devlink","export Webflow components to React and Next.js","Export Webflow Designer components to React\u002FNext.js code for external projects. Configure devlink settings in webflow.json, sync design updates with devlink sync, validate generated code, show diffs, and provide integration examples. Use when building with Webflow designs in React\u002FNext.js.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2249,2250,2253,2256,2257],{"name":2195,"slug":2196,"type":16},{"name":2251,"slug":2252,"type":16},"Frontend","frontend",{"name":2254,"slug":2255,"type":16},"Next.js","next-js",{"name":2218,"slug":2219,"type":16},{"name":10,"slug":9,"type":16},"2026-05-18T06:47:40.182468",{"slug":2260,"name":2261,"fn":2262,"description":2263,"org":2264,"tags":2265,"stars":30,"repoUrl":31,"updatedAt":2274},"webflow-clitroubleshooter","webflow-cli:troubleshooter","troubleshoot Webflow CLI issues","Diagnose and fix Webflow CLI issues including installation problems, authentication failures, build errors, and bundle problems. Uses CLI diagnostic flags (--version, --help, --verbose, --debug-bundler) for troubleshooting.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2266,2267,2270,2273],{"name":2195,"slug":2196,"type":16},{"name":2268,"slug":2269,"type":16},"Configuration","configuration",{"name":2271,"slug":2272,"type":16},"Debugging","debugging",{"name":10,"slug":9,"type":16},"2026-05-18T06:47:48.831648",{"slug":2276,"name":2277,"fn":2278,"description":2279,"org":2280,"tags":2281,"stars":30,"repoUrl":31,"updatedAt":2290},"webflow-code-componentcomponent-audit","webflow-code-component:component-audit","audit Webflow Code Component architecture","Audit Webflow Code Components for architecture decisions - prop exposure, state management, slot opportunities, and Shadow DOM compatibility. Focused on Webflow-specific patterns, not generic React best practices.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2282,2285,2288,2289],{"name":2283,"slug":2284,"type":16},"Architecture","architecture",{"name":2286,"slug":2287,"type":16},"Code Analysis","code-analysis",{"name":2218,"slug":2219,"type":16},{"name":10,"slug":9,"type":16},"2026-05-18T06:47:46.277768",{"slug":2292,"name":2293,"fn":2294,"description":2295,"org":2296,"tags":2297,"stars":30,"repoUrl":31,"updatedAt":2304},"webflow-code-componentcomponent-scaffold","webflow-code-component:component-scaffold","scaffold Webflow Code Component boilerplate","Generate new Webflow Code Component boilerplate with React component, definition file, and optional styling. Automatically checks prerequisites and can set up missing config\u002Fdependencies.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2298,2299,2300,2303],{"name":2251,"slug":2252,"type":16},{"name":2218,"slug":2219,"type":16},{"name":2301,"slug":2302,"type":16},"Templates","templates",{"name":10,"slug":9,"type":16},"2026-05-18T06:47:42.638042",{"slug":2306,"name":2307,"fn":2308,"description":2309,"org":2310,"tags":2311,"stars":30,"repoUrl":31,"updatedAt":2318},"webflow-code-componentconvert-component","webflow-code-component:convert-component","convert React components to Webflow Code Components","Convert an existing React component into a Webflow Code Component. Analyzes TypeScript props, maps to Webflow prop types, generates the .webflow.tsx definition file, and identifies required modifications.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2312,2315,2316,2317],{"name":2313,"slug":2314,"type":16},"Migration","migration",{"name":2218,"slug":2219,"type":16},{"name":2238,"slug":2239,"type":16},{"name":10,"slug":9,"type":16},"2026-05-18T06:47:52.523608",{"slug":2320,"name":2321,"fn":2322,"description":2323,"org":2324,"tags":2325,"stars":30,"repoUrl":31,"updatedAt":2330},"webflow-code-componentdeploy-guide","webflow-code-component:deploy-guide","deploy Webflow Code Components","Step-by-step guide for deploying Webflow Code Components to a workspace. Covers authentication, pre-flight checks, deployment execution, and verification.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2326,2327,2328,2329],{"name":2201,"slug":2202,"type":16},{"name":2251,"slug":2252,"type":16},{"name":2218,"slug":2219,"type":16},{"name":10,"slug":9,"type":16},"2026-05-18T06:47:38.947875",{"slug":2332,"name":2333,"fn":2334,"description":2335,"org":2336,"tags":2337,"stars":30,"repoUrl":31,"updatedAt":2344},"webflow-code-componentlocal-dev-setup","webflow-code-component:local-dev-setup","set up local Webflow Code Component projects","Initialize a new Webflow Code Components project from scratch. Creates project structure, installs dependencies, configures webflow.json, and sets up development environment.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2338,2339,2342,2343],{"name":2268,"slug":2269,"type":16},{"name":2340,"slug":2341,"type":16},"Local Development","local-development",{"name":2218,"slug":2219,"type":16},{"name":10,"slug":9,"type":16},"2026-05-18T06:47:50.062783",{"slug":2346,"name":2347,"fn":2348,"description":2349,"org":2350,"tags":2351,"stars":30,"repoUrl":31,"updatedAt":2360},"webflow-code-componentpre-deploy-check","webflow-code-component:pre-deploy-check","validate Webflow Code Components before deployment","Pre-deployment validation for Webflow Code Components. Checks bundle size, dependencies, prop configurations, SSR compatibility, styling setup, and common issues before running webflow library share.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2352,2353,2356,2359],{"name":2201,"slug":2202,"type":16},{"name":2354,"slug":2355,"type":16},"QA","qa",{"name":2357,"slug":2358,"type":16},"Validation","validation",{"name":10,"slug":9,"type":16},"2026-05-18T06:47:51.300653",{"slug":2362,"name":2363,"fn":2364,"description":2365,"org":2366,"tags":2367,"stars":30,"repoUrl":31,"updatedAt":2374},"webflow-code-componenttroubleshoot-deploy","webflow-code-component:troubleshoot-deploy","troubleshoot Webflow Code Component deployments","Debug deployment failures for Webflow Code Components. Analyzes error messages, identifies root causes, and provides specific fixes for common issues.",{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2368,2369,2370,2373],{"name":2271,"slug":2272,"type":16},{"name":2201,"slug":2202,"type":16},{"name":2371,"slug":2372,"type":16},"Observability","observability",{"name":10,"slug":9,"type":16},"2026-05-18T06:47:45.057571",28,{"items":2377,"total":2375},[2378,2386,2394,2402,2410,2417,2424],{"slug":2188,"name":2189,"fn":2190,"description":2191,"org":2379,"tags":2380,"stars":30,"repoUrl":31,"updatedAt":2207},{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2381,2382,2383,2384,2385],{"name":2195,"slug":2196,"type":16},{"name":2198,"slug":2199,"type":16},{"name":2201,"slug":2202,"type":16},{"name":2204,"slug":2205,"type":16},{"name":10,"slug":9,"type":16},{"slug":2209,"name":2210,"fn":2211,"description":2212,"org":2387,"tags":2388,"stars":30,"repoUrl":31,"updatedAt":2224},{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2389,2390,2391,2392,2393],{"name":2195,"slug":2196,"type":16},{"name":2201,"slug":2202,"type":16},{"name":2218,"slug":2219,"type":16},{"name":2221,"slug":2222,"type":16},{"name":10,"slug":9,"type":16},{"slug":2226,"name":2227,"fn":2228,"description":2229,"org":2395,"tags":2396,"stars":30,"repoUrl":31,"updatedAt":2241},{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2397,2398,2399,2400,2401],{"name":2195,"slug":2196,"type":16},{"name":2234,"slug":2235,"type":16},{"name":2218,"slug":2219,"type":16},{"name":2238,"slug":2239,"type":16},{"name":10,"slug":9,"type":16},{"slug":2243,"name":2244,"fn":2245,"description":2246,"org":2403,"tags":2404,"stars":30,"repoUrl":31,"updatedAt":2258},{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2405,2406,2407,2408,2409],{"name":2195,"slug":2196,"type":16},{"name":2251,"slug":2252,"type":16},{"name":2254,"slug":2255,"type":16},{"name":2218,"slug":2219,"type":16},{"name":10,"slug":9,"type":16},{"slug":2260,"name":2261,"fn":2262,"description":2263,"org":2411,"tags":2412,"stars":30,"repoUrl":31,"updatedAt":2274},{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2413,2414,2415,2416],{"name":2195,"slug":2196,"type":16},{"name":2268,"slug":2269,"type":16},{"name":2271,"slug":2272,"type":16},{"name":10,"slug":9,"type":16},{"slug":2276,"name":2277,"fn":2278,"description":2279,"org":2418,"tags":2419,"stars":30,"repoUrl":31,"updatedAt":2290},{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2420,2421,2422,2423],{"name":2283,"slug":2284,"type":16},{"name":2286,"slug":2287,"type":16},{"name":2218,"slug":2219,"type":16},{"name":10,"slug":9,"type":16},{"slug":2292,"name":2293,"fn":2294,"description":2295,"org":2425,"tags":2426,"stars":30,"repoUrl":31,"updatedAt":2304},{"slug":9,"name":10,"logoUrl":11,"githubOrg":9},[2427,2428,2429,2430],{"name":2251,"slug":2252,"type":16},{"name":2218,"slug":2219,"type":16},{"name":2301,"slug":2302,"type":16},{"name":10,"slug":9,"type":16}]