🚀 品牌到主题 MCP 服务器
此 MCP 服务器是一套强大的工具，可自动把企业品牌手册的 PDF 文件转化为完整的 Shopify 主题模板，同时确保品牌的连贯性，为企业在 Shopify 平台上打造一致的品牌形象提供了便利。
🚀 快速开始
在使用此 MCP 服务器前，需要满足以下先决条件：
- Node.js 和 npm 安装在系统上
- Shopify 开发账户和 API 访问权限
- 基础的命令行操作知识
✨ 主要特性
- PDF 提取：分析 PDF 以获取色板、字体和其他设计元素
- 生成设计令牌：将提取的品牌元素转换为标准化的设计令牌
- 创建 Shopify 主题：根据品牌信息生成完整的主题文件
- 与 Shopify 集成：支持直接在连接的商店中安装主题
- 与 Figma 集成：兼容从 Figma 中提取的组件（通过 Figma 的 MCP）
📦 安装指南
- 克隆此仓库：
git clone https://github.com/mmokarzel/brand-to-theme-mcp-server.git
cd brand-to-theme-mcp-server
- 安装依赖项：
npm install
- 编译项目：
npm run build
- 在您的 MCP 配置文件中配置此服务器：
{
"mcpServers": {
"github.com/mmokarzel/brand-to-theme-mcp-server": {
"command": "node",
"args": [
"/ruta/a/brand-to-theme-mcp/build/index.js"
],
"env": {},
"disabled": false,
"description": "品牌到主题的 MCP 服务器"
}
}
}
💻 使用示例
基础用法
// 1. 提取 PDF 中的品牌信息
const result = await invoke('extract_pdf_branding', {
pdfPath: '/path/to/brand指南.pdf',
extractOptions: {
colors: true,
fonts: true,
logos: false
}
});
// 2. 根据提取的信息生成设计令牌
const tokens = await invoke('generate_design_tokens', {
brandingData: result,
format: 'CSS'
});
// 3. 使用设计令牌创建 Shopify 主题
await invoke('create_shopify_theme', {
designTokens: tokens,
themeName: 'BrandTheme',
outputPath: '/path/to/output'
});
// 4. 预览生成的主题
const preview = await invoke('preview_shopify_theme', {
themePath: '/path/to/output/brandTheme.json',
previewType: 'full'
});
// 5. 将主题安装到 Shopify 商店中
await invoke('install_shopify_theme', {
themePath: '/path/to/output/brandTheme.json',
installationType: 'new',
setAsMain: true
});
📚 详细文档
服务器公开了以下 MCP 工具：
1. extract_pdf_branding
从 PDF 文件中提取品牌视觉元素和信息。
参数：
pdfPath：品牌手册 PDF 文件的路径extractOptions：提取选项（颜色、字体、标志）
2. generate_design_tokens
根据提取的品牌信息生成设计令牌。
参数：
brandingData：从 PDF 中提取的品牌数据figmaData：可选的 Figma 提取数据format：输出令牌格式（JSON、CSS、SCSS）
3. create_shopify_theme
根据设计令牌生成完整的 Shopify 主题。
参数：
designTokens：生成的设计令牌themeName：主题名称outputPath：保存主题文件的路径
4. preview_shopify_theme
生成 Shopify 主题的预览视图。
参数：
themePath：主题文件的路径previewType：要生成的预览类型（缩略图、全屏）
5. install_shopify_theme
将生成的主题安装到连接的 Shopify 商店中。
参数：
themePath：主题文件的路径installationType：以新主题形式安装或更新现有主题existingThemeId：要更新的现有主题 ID（如有必要）setAsMain：设置为主商店主题