Pages: Integrations / Plugins
Guides integrations, plugins, and extensions pages. Shows how the product connects with Canva, Slack, Zapier, and other platforms. Common for SaaS, tools, and developer products.
When invoking: On first use, if helpful, open with 1–2 sentences on what this skill covers and why it matters, then provide the main output. On subsequent use or when the user asks to skip, go directly to the main output.
Initial Assessment
Check for project context first: If .claude/project-context.md or .cursor/project-context.md exists, read it for product, integrations, and target platforms.
Identify:
- 1. Type: Native integrations, plugins, extensions, API, webhooks
- Platforms: Which to feature (Slack, Notion, Figma, etc.)
- Format: Single page vs. per-integration pages
- Primary goal: Install, connect, sign up
Page Structure
| Section | Purpose |
|---|
| Headline | "Integrate with [Platforms]" or "Connect [Product] to Your Stack" |
| Value |
Why integrations matter; workflow benefits |
|
Catalog | Grid or list: logo, name, short description, "Connect" or "Install" |
|
Categories | By use case (Productivity, Design, Dev) or platform type |
|
API | Link to api-page or docs if developer-focused |
|
CTA | Browse all, request integration, build your own |
Best Practices
Organization
- - By category: Productivity, Design, Marketing, Dev tools
- By platform: Slack, Notion, Figma, Zapier
- Search/filter: For 20+ integrations
- Featured: Highlight top 5–10; rest in catalog
Content
- - Per integration: Logo, 1–2 sentence benefit, "Connect" CTA
- Use cases: "Use with Slack to get notifications"
- Screenshots: Show connected workflow when possible
SEO
- - Intent: Informational + commercial; "X integration," "X plugin"
- Title: "Integrations | Connect [Product] to [Platforms]" or "[Product] + Slack"
- Internal links: API, docs, features, pricing
Output Format
- - Headline and value proposition
- Catalog structure (categories, layout)
- Per-integration copy (name, benefit, CTA)
- Internal links (API, docs)
- SEO metadata
Related Skills
- - card: Integration card structure; logo, name, description, CTA; catalog grid
- grid, list: Catalog layout; grid or list format
- api-page-generator: API overview; link for developer integrations
- docs-page-generator: Integration setup guides in docs
- category-page-generator: Catalog layout for many integrations
- landing-page-generator: Integration-specific landing pages
页面:集成 / 插件
指导集成、插件和扩展页面的设计。展示产品如何与 Canva、Slack、Zapier 及其他平台连接。常见于 SaaS、工具和开发者产品。
调用时:首次使用时,如有帮助,可用1-2句话说明该技能涵盖的内容及其重要性,然后提供主要输出。后续使用或用户要求跳过时,直接进入主要输出。
初始评估
首先检查项目上下文: 如果存在 .claude/project-context.md 或 .cursor/project-context.md,读取其中的产品、集成和目标平台信息。
识别:
- 1. 类型:原生集成、插件、扩展、API、Webhooks
- 平台:重点展示哪些平台(Slack、Notion、Figma 等)
- 格式:单页面 vs. 每个集成独立页面
- 主要目标:安装、连接、注册
页面结构
| 部分 | 目的 |
|---|
| 标题 | 与[平台]集成 或 将[产品]连接到你的技术栈 |
| 价值 |
集成的重要性;工作流程优势 |
|
目录 | 网格或列表:Logo、名称、简短描述、连接或安装 |
|
分类 | 按使用场景(生产力、设计、开发)或平台类型 |
|
API | 面向开发者的 API 页面或文档链接 |
|
行动号召 | 浏览全部、请求集成、自行构建 |
最佳实践
组织方式
- - 按类别:生产力、设计、营销、开发工具
- 按平台:Slack、Notion、Figma、Zapier
- 搜索/筛选:适用于20个以上集成
- 精选:突出展示前5-10个;其余放入目录
内容
- - 每个集成:Logo、1-2句话优势、连接行动号召
- 使用场景:与 Slack 配合使用获取通知
- 截图:尽可能展示连接后的工作流程
SEO
- - 意图:信息性 + 商业性;X 集成、X 插件
- 标题:集成 | 将[产品]连接到[平台] 或 [产品] + Slack
- 内部链接:API、文档、功能、定价
输出格式
- - 标题和价值主张
- 目录结构(分类、布局)
- 每个集成文案(名称、优势、行动号召)
- 内部链接(API、文档)
- SEO元数据
相关技能
- - 卡片:集成卡片结构;Logo、名称、描述、行动号召;目录网格
- 网格、列表:目录布局;网格或列表格式
- API页面生成器:API 概览;开发者集成链接
- 文档页面生成器:文档中的集成设置指南
- 分类页面生成器:多个集成的目录布局
- 落地页生成器:特定集成的落地页