webflow-mcp:cms-collection-setup

What this skill does

# CMS Collection Setup

Create a new CMS collection with custom fields, relationships, and proper configuration.

## Important Note

**ALWAYS use Webflow MCP tools for all operations:**
- Use Webflow MCP's `webflow_guide_tool` to get best practices before starting
- Use Webflow MCP's `data_sites_tool` with action `list_sites` to identify available sites
- Use Webflow MCP's `data_sites_tool` with action `get_site` to retrieve site details and plan limits
- Use Webflow MCP's `data_cms_tool` with action `get_collection_list` to check for naming conflicts
- Use Webflow MCP's `data_cms_tool` with action `create_collection` to create the collection
- Use Webflow MCP's `data_cms_tool` with action `create_collection_static_field` to create static fields
- Use Webflow MCP's `data_cms_tool` with action `create_collection_option_field` to create option fields
- Use Webflow MCP's `data_cms_tool` with action `create_collection_reference_field` to create reference/multi-reference fields
- Use Webflow MCP's `data_cms_tool` with action `get_collection_details` to verify collection was created correctly
- DO NOT use any other tools or methods for Webflow operations
- All tool calls must include the required `context` parameter (15-25 words, third-person perspective)

## Instructions

### Phase 1: Site Selection & Discovery
1. **Get site information**: Use Webflow MCP's `data_sites_tool` with action `list_sites` to identify target site
2. **Confirm site**: Ask user to select site if multiple available
3. **Check plan limits**: Use Webflow MCP's `data_sites_tool` with action `get_site` to verify collection limits
4. **List existing collections**: Use Webflow MCP's `data_cms_tool` with action `get_collection_list` to check for conflicts
5. **Validate naming**: Ensure new collection name doesn't conflict with existing

### Phase 2: Requirements Gathering
6. **Get collection details**: Ask user for:
   - Collection display name (e.g., "Blog Posts")
   - Singular name (e.g., "Blog Post")
   - Optional: Custom slug (default: auto-generated from display name)
7. **Get field definitions**: For each field, gather:
   - Field name (e.g., "Author Name", "Publish Date")
   - Field type (Text, Rich Text, Image, Option, Reference, etc.)
   - Required vs optional
   - Any validation rules or help text
8. **Identify relationships**: Determine if collection needs:
   - Reference fields (one-to-many relationships)
   - Multi-reference fields (many-to-many relationships)
   - Option fields (controlled vocabulary)

### Phase 3: Schema Validation & Planning
9. **Validate field types**: Check all field types are supported
10. **Check field limits**: Ensure within Webflow limits:
    - Max fields per collection: varies by plan
    - Max 5 multi-reference fields per collection
11. **Plan creation order**: Organize fields by dependency:
    - Create collections in order if references exist
    - Create referenced collections first
    - Create option fields before reference fields
12. **Generate preview**: Show complete schema with all fields

### Phase 4: User Approval
13. **Show complete preview**: Display:
    - Collection name and slug
    - All fields with types and properties
    - Any relationships to other collections
    - Plan limit verification
14. **Validate schema**: Check for common issues:
    - Missing required fields (name, slug always required)
    - Invalid field types
    - Reference to non-existent collections
    - Exceeding plan limits
15. **Request confirmation**: Wait for explicit "create" approval

### Phase 5: Collection Creation
16. **Create collection**: Use Webflow MCP's `data_cms_tool` with action `create_collection` with:
    - Display name
    - Singular name
    - Optional slug
17. **Capture collection ID**: Save for field creation
18. **Show progress**: Report collection created successfully

### Phase 6: Field Creation
19. **Create fields in order**: For each field:
    - Use appropriate creation tool based on type
    - Static fields: `data_cms_tool` with action `create_collection_static_field`
    - Option fields: `data_cms_tool` with action `create_collection_option_field`
    - Reference fields: `data_cms_tool` with action `create_collection_reference_field`
20. **Set field properties**:
    - Display name
    - Required flag
    - Help text (if provided)
    - Validation rules (if applicable)
21. **Show progress**: Report each field created
22. **Handle errors**: If field creation fails, report and continue

### Phase 7: Verification & Reporting
23. **Verify collection**: Use Webflow MCP's `data_cms_tool` with action `get_collection_details` to retrieve full schema
24. **Confirm all fields**: Check that all requested fields were created
25. **Generate report**: Show:
    - Collection ID
    - Collection name and slug
    - All fields created with IDs
    - Any failures or warnings
26. **Provide next steps**: Suggest:
    - Use bulk-cms-update to add initial items
    - Create collection pages in Designer
    - Set up relationships if applicable

## Field Type Reference

### Static Field Types

**PlainText** - Short text (max 256 chars) or long text
- Use for: Titles, names, descriptions, excerpts
- Properties: maxLength validation (256 for short)
- Example: "Title", "Author Name", "Excerpt"

**RichText** - Formatted text with HTML
- Use for: Blog content, bios, articles, long descriptions
- Properties: No length limit
- Example: "Post Content", "Bio", "Description"

**Email** - Email address
- Use for: Contact emails, author emails
- Properties: Email format validation
- Example: "Contact Email", "Author Email"

**Phone** - Phone number
- Use for: Contact numbers
- Properties: E.164 format
- Example: "Phone Number", "Mobile"

**Link** - External URL or internal link
- Use for: Website links, social media, external resources
- Properties: URL validation
- Example: "Website", "LinkedIn Profile"

**Number** - Numeric values
- Use for: Prices, ratings, counts, order numbers
- Properties: Integer or decimal
- Example: "Price", "Rating", "Order"

**Image** - Single image
- Use for: Featured images, photos, thumbnails
- Properties: Max 4MB per image
- Example: "Featured Image", "Photo", "Thumbnail"

**MultiImage** - Multiple images (up to 25)
- Use for: Galleries, product photos
- Properties: Max 25 images, 4MB each
- Example: "Gallery", "Product Photos"

**File** - File upload
- Use for: PDFs, documents, downloads
- Properties: Max 4MB per file
- Example: "Resume PDF", "Brochure", "Manual"

**Video** - Video embed (YouTube/Vimeo)
- Use for: Video content
- Properties: Embed URL
- Example: "Tutorial Video", "Demo"

**DateTime** - Date and/or time
- Use for: Publish dates, event dates, deadlines
- Properties: ISO 8601 format
- Example: "Publish Date", "Event Date"

**Switch** - Boolean (true/false)
- Use for: Featured flags, visibility toggles
- Properties: Boolean value
- Example: "Featured", "Published", "Active"

**Color** - Color value
- Use for: Theme colors, accents, brand colors
- Properties: Hex format
- Example: "Brand Color", "Accent Color"

### Option Field Type

**Option** - Single choice from predefined list
- Use for: Status, category, type, priority
- Properties: List of option names
- Example: "Status" (Draft, Review, Published)
- Creation: Use `data_cms_tool` with action `create_collection_option_field` with options array

**Example:**
```json
{
  "type": "Option",
  "displayName": "Status",
  "metadata": {
    "options": [
      {"name": "Draft"},
      {"name": "In Review"},
      {"name": "Published"}
    ]
  }
}
```

### Reference Field Types

**Reference** - Link to one item in another collection (one-to-many)
- Use for: Author → Post, Category → Post, Brand → Product
- Properties: Collection ID of referenced collection
- Example: "Author" (reference to Authors collection)
- Creation: Use `data_cms_tool` with action `create_collection_reference_field` with collectionId

**MultiReference** - Link to multiple items in another collection