Skip to main content Accueil Créateurs jeremylongshore claude-code-plugins-plus-skills webflow-core-workflow-a
webflow-core-workflow-a Execute the primary Webflow workflow — CMS content management: list collections,
CRUD items, publish items, and manage content lifecycle via the Data API v2.
Use when working with Webflow CMS collections and items, managing blog posts,
team members, or any dynamic content.
Trigger with phrases like "webflow CMS", "webflow collections", "webflow items",
"create webflow content", "manage webflow CMS", "webflow content management".
Aller à l'installation Skills Marketplace Découvrez et explorez les compétences IA créées par la communauté.
Installer avec Codex ou Claude Copiez ce prompt, collez-le dans Codex, Claude ou un autre assistant, puis laissez-le vérifier la page du skill et l'installer pour vous.
Copier le promptAfficher les détails du prompt Une commande directe contourne le prompt de vérification. Examinez la source avant de l'exécuter.
npx skills add https://github.com/jeremylongshore/claude-code-plugins-plus-skills --skill webflow-core-workflow-aLa commande reste sur une seule ligne. Faites défiler horizontalement pour la vérifier avant de la copier.
Vous préférez une copie locale ? Téléchargez les fichiers actuellement disponibles dans SkillsMP.
Télécharger Zip Téléchargement... Métiers associés SOC
Basé sur la classification professionnelle SOC
name webflow-core-workflow-a description Execute the primary Webflow workflow — CMS content management: list collections,
CRUD items, publish items, and manage content lifecycle via the Data API v2.
Use when working with Webflow CMS collections and items, managing blog posts,
team members, or any dynamic content.
Trigger with phrases like "webflow CMS", "webflow collections", "webflow items",
"create webflow content", "manage webflow CMS", "webflow content management".
allowed-tools Read, Write, Edit, Bash(npm:*), Bash(npx:*), Grep version 1.5.0 license MIT author Jeremy Longshore <jeremy@intentsolutions.io> tags ["saas","design","no-code","webflow"] compatibility Designed for Claude Code
Webflow Core Workflow A — CMS Content Management
Overview
The primary money-path workflow for Webflow: managing CMS collections and items
through the Data API v2. Covers the full CRUD lifecycle — create, read, update,
delete, and publish CMS content programmatically.
Prerequisites
Completed webflow-install-auth setup
API token with cms:read and cms:write scopes
A Webflow site with at least one CMS collection
API Endpoints Reference
Operation Method Endpoint List collections GET /v2/sites/{site_id}/collectionsGet collection GET /v2/collections/{collection_id}List items (staged) GET /v2/collections/{collection_id}/itemsList items (live) GET /v2/collections/{collection_id}/items/liveGet item GET /v2/collections/{collection_id}/items/{item_id}Create item POST /v2/collections/{collection_id}/itemsCreate items (bulk) POST /v2/collections/{collection_id}/items/bulkUpdate item PATCH /v2/collections/{collection_id}/items/{item_id}Update items (bulk) PATCH /v2/collections/{collection_id}/items/bulkDelete item DELETE /v2/collections/{collection_id}/items/{item_id}Delete items (bulk) DELETE /v2/collections/{collection_id}/items/bulkPublish item POST /v2/collections/{collection_id}/items/publish
Instructions
Step 1: List Collections and Inspect Schema
import { } ;
webflow = ({
: process. . !,
});
( ) {
{ collections } = webflow. . (siteId);
( col collections!) {
. ( );
. ( );
. ( );
. ( );
( field col. || []) {
req = field. ? : ;
. ( );
}
}
}
WebflowClient
from
"webflow-api"
const
new
WebflowClient
accessToken
env
WEBFLOW_API_TOKEN
async
function
inspectCollections
siteId : string
const
await
collections
list
for
const
of
console
log
`\n=== ${col.displayName} (${col.slug} ) ===`
console
log
`ID: ${col.id} `
console
log
`Items: ${col.itemCount} `
console
log
`Fields:`
for
const
of
fields
const
isRequired
" [REQUIRED]"
""
console
log
` ${field.slug} (${field.type } )${req} `
Step 2: Create CMS Items Items are created as drafts by default (isDraft: true). Field names use slug format.
async function createItem (collectionId : string ) {
const item = await webflow.collections .items .createItem (collectionId, {
isDraft : false ,
fieldData : {
name : "My New Blog Post" ,
slug : "my-new-blog-post" ,
"post-body" : "<h2>Hello World</h2><p>Content here.</p>" ,
"author-name" : "Jeremy Longshore" ,
"publish-date" : new Date ().toISOString (),
"featured" : true ,
"category" : "ref-item-id-here" ,
"hero-image" : {
url : "https://uploads-ssl.webflow.com/..." ,
alt : "Hero image description" ,
},
},
});
console .log (`Created: ${item.id} (draft: ${item.isDraft} )` );
return item;
}
Step 3: Bulk Create (Up to 100 Items) async function bulkCreate (collectionId : string ) {
const items = Array .from ({ length : 50 }, (_, i ) => ({
fieldData : {
name : `Product ${i + 1 } ` ,
slug : `product-${i + 1 } ` ,
price : (i + 1 ) * 9.99 ,
description : `Description for product ${i + 1 } ` ,
},
isDraft : false ,
}));
const result = await webflow.collections .items .createItemsBulk (
collectionId,
{ items }
);
console .log (`Bulk created: ${result.items?.length} items` );
return result;
}
Step 4: Read Items (Staged and Live) async function readItems (collectionId : string ) {
const staged = await webflow.collections .items .listItems (collectionId, {
limit : 100 ,
offset : 0 ,
});
console .log (`Staged items: ${staged.pagination?.total} ` );
const live = await webflow.collections .items .listItemsLive (collectionId, {
limit : 100 ,
});
console .log (`Live items: ${live.pagination?.total} ` );
const item = await webflow.collections .items .getItem (
collectionId,
staged.items ![0 ].id !
);
console .log (`Item: ${item.fieldData?.name} ` );
}
Step 5: Update Items async function updateItem (collectionId : string , itemId : string ) {
const updated = await webflow.collections .items .updateItem (
collectionId,
itemId,
{
fieldData : {
name : "Updated Title" ,
"post-body" : "<p>Updated content</p>" ,
},
}
);
console .log (`Updated: ${updated.id} at ${updated.lastUpdated} ` );
}
async function bulkUpdate (collectionId : string , updates : Array <{ id: string ; fields: Record<string , any > }> ) {
const items = updates.map (u => ({
id : u.id ,
fieldData : u.fields ,
}));
await webflow.collections .items .updateItemsBulk (collectionId, { items });
}
Step 6: Publish Items Publishing makes staged changes visible on the live site.
async function publishItems (collectionId : string , itemIds : string [] ) {
await webflow.collections .items .publishItem (collectionId, {
itemIds,
});
console .log (`Published ${itemIds.length} items` );
}
async function publishSite (siteId : string ) {
await webflow.sites .publish (siteId, {
publishToWebflowSubdomain : true ,
});
console .log ("Site published" );
}
Step 7: Delete Items async function deleteItem (collectionId : string , itemId : string ) {
await webflow.collections .items .deleteItem (collectionId, itemId);
console .log (`Deleted: ${itemId} ` );
}
async function bulkDelete (collectionId : string , itemIds : string [] ) {
await webflow.collections .items .deleteItemsBulk (collectionId, {
itemIds,
});
console .log (`Deleted ${itemIds.length} items` );
}
Complete Content Sync Example async function syncContentFromExternalCMS (
siteId : string ,
collectionSlug : string ,
externalPosts : Array <{ title: string ; body: string ; publishedAt: string }>
) {
const { collections } = await webflow.collections .list (siteId);
const collection = collections!.find (c => c.slug === collectionSlug);
if (!collection) throw new Error (`Collection "${collectionSlug} " not found` );
const { items : existing } = await webflow.collections .items .listItems (collection.id !);
const existingSlugs = new Set (existing!.map (i => i.fieldData ?.slug ));
const newPosts = externalPosts.filter (
p => !existingSlugs.has (slugify (p.title ))
);
if (newPosts.length === 0 ) {
console .log ("No new posts to sync" );
return ;
}
const items = newPosts.map (p => ({
isDraft : false ,
fieldData : {
name : p.title ,
slug : slugify (p.title ),
"post-body" : p.body ,
"publish-date" : p.publishedAt ,
},
}));
const created = await webflow.collections .items .createItemsBulk (
collection.id !,
{ items : items.slice (0 , 100 ) }
);
const newIds = created.items !.map (i => i.id !);
await webflow.collections .items .publishItem (collection.id !, {
itemIds : newIds,
});
console .log (`Synced and published ${newIds.length} new posts` );
}
function slugify (text : string ): string {
return text.toLowerCase ().replace (/[^a-z0-9]+/g , "-" ).replace (/(^-|-$)/g , "" );
}
Output
Full CMS CRUD operations (create, read, update, delete)
Bulk operations up to 100 items per request
Separate staged vs live item access
Item publishing (individual items or full site)
Content sync workflow from external sources
Error Handling Error Cause Solution 400 Bad RequestInvalid field data or missing required fields Check collection schema for required fields 404 Not FoundWrong collection_id or item_id List collections first with collections.list() 409 ConflictDuplicate slug in collection Use unique slugs or add suffix 429 Too Many RequestsRate limit exceeded SDK auto-retries; for bulk, add delays between batches Site publish 429 >1 publish/minute Wait 60s between site publishes
Resources
Next Steps For site, page, and ecommerce management, see webflow-core-workflow-b.