Tina CMS MCP MCP Server

About

## Tina CMS MCP Server: Git-Based Visual Editing The **Tina CMS MCP Server** integrates Tina CMS into Google Antigravity, enabling Git-based content management with visual editing, real-time preview, and markdown support directly from your development environment. ### Why Tina CMS MCP? - **Visual Editing**: Edit content visually on your site - **Git-Backed**: All content stored in your Git repository - **Real-Time Preview**: See changes instantly before saving - **Markdown Support**: First-class markdown with MDX support - **Open Source**: Self-hostable with Tina Cloud option ### Key Features #### 1. Content Queries ```python # Query documents result = await mcp.query(""" query GetPosts { postConnection( filter: { draft: { eq: false } } sort: "date" last: 10 ) { edges { node { id title date body } } } } """) for edge in result["postConnection"]["edges"]: post = edge["node"] print(f"Post: {post['title']}") ``` #### 2. Content Mutations ```python # Create document result = await mcp.mutate(""" mutation CreatePost($relativePath: String!, $params: PostMutation!) { createPost(relativePath: $relativePath, params: $params) { id title } } """, variables={ "relativePath": "new-post.md", "params": { "title": "New Post", "date": "2024-01-15", "body": "Post content..." } }) # Update document await mcp.mutate(""" mutation UpdatePost($relativePath: String!, $params: PostMutation!) { updatePost(relativePath: $relativePath, params: $params) { id } } """, variables={ "relativePath": "new-post.md", "params": {"title": "Updated Title"} }) ``` #### 3. Collection Operations ```python # List collections collections = await mcp.list_collections() for col in collections: print(f"Collection: {col['name']} - {col['path']}") # Get document list docs = await mcp.list_documents(collection="posts") for doc in docs: print(f"Document: {doc['relativePath']}") ``` #### 4. Media Operations ```python # Upload media media = await mcp.upload_media( file_path="./images/cover.jpg", directory="public/uploads" ) # List media files = await mcp.list_media(directory="public/uploads") ``` ### Configuration ```json { "mcpServers": { "tinacms": { "command": "npx", "args": ["-y", "@anthropic/mcp-tinacms"], "env": { "TINA_CLIENT_ID": "your-client-id", "TINA_TOKEN": "your-token", "TINA_BRANCH": "main" } } } } ``` ### Use Cases **Developer Blogs**: Manage technical blogs with MDX and code blocks. **Documentation**: Edit docs visually with Git version control. **Marketing Sites**: Enable marketers to edit pages visually. **JAMstack Sites**: Power Next.js and Gatsby sites with visual editing. The Tina CMS MCP enables Git-based visual editing within your development environment.

Installation

{
  "mcpServers": {
    "tinacms": {}
  }
}

How to Use