品牌到主题 MCP 服务器

用于将品牌 PDF 转换为 Shopify 功能主题的 MCP 服务器

描述

此 MCP 服务器提供了一套工具，用于自动将企业品牌手册的 PDF 文件转换为完整的 Shopify 主题模板，并保持品牌的连贯性。

利用先进的 PDF 解析技术和代码生成技术，该服务器可将品牌视觉元素（颜色、字体等）转化为一个完整且可安装的 Shopify 主题。

特性

• PDF 提取：分析 PDF 以获取色板、字体和其他设计元素
• 生成设计令牌：将提取的品牌元素转换为标准化的设计令牌
• 创建 Shopify 主题：根据品牌信息生成完整的主题文件
• 与 Shopify 集成：支持直接在连接的商店中安装主题
• 与 Figma 集成：兼容从 Figma 中提取的组件（通过 Figma 的 MCP）

MCP 工具

服务器公开了以下 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：设置为主商店主题

安装步骤

1. 克隆此仓库：

git clone https://github.com/mmokarzel/brand-to-theme-mcp-server.git
cd brand-to-theme-mcp-server

2. 安装依赖项：

npm install

3. 编译项目：

npm run build

4. 在您的 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
});

先决条件

• Node.js 和 npm 安装在系统上
• Shopify 开发账户和 API 访问权限
• 基础的命令行操作知识