一键在 Manus 中运行任何 Skill

blog-mockup

星标2

分支0

更新时间2026年4月15日 18:59

Quickly generate a Red Hat branded HTML mockup of any blog content. Use this skill when the user wants to preview a blog post, create an HTML mockup, see what a blog looks like rendered, visualize blog content, or says things like "mockup this blog", "preview this as HTML", "show me what this looks like as a Red Hat blog", "render this blog post", or "create an HTML preview". Works with markdown files, Google Docs, pasted text, or any content the user provides. This is a lightweight alternative to the full blog-create pipeline when you just need a visual preview without the review loop.

安装

用 Codex 或 Claude 帮你安装复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。

在 Manus 中运行

来源

solaius

solaius/ai-asset-registry

打开 GitHub 仓库查看创作者相关仓库

下载

在 Manus 中运行

blog-mockup

Generate a Red Hat branded HTML preview of any blog content. This is a quick, single-pass skill for visualizing blog posts. It does not run the review pipeline or create abstracts. Use blog-create for the full creation and review workflow.

When to Use This vs blog-create

Scenario	Skill
Writing a new blog from scratch	`blog-create`
Reviewing/improving an existing draft	`blog-create`
Quick visual preview of any content	`blog-mockup`
Rendering a final.md as HTML	`blog-mockup`
Previewing a Google Doc as a Red Hat blog	`blog-mockup`
"What would this look like as a blog?"	`blog-mockup`

Inputs

The skill accepts blog content from any of these sources:

A markdown file path (e.g., docs/blogs/mcps/mcp-catalog/final.md)
A Google Doc link (fetch via mcp__google-workspace__get_doc_as_markdown with user pedouble@redhat.com)
Pasted text directly in the conversation
A URL (fetch via Playwright for JS-rendered pages, WebFetch otherwise)

Workflow

Step 1: Get the content

Read or fetch the blog content from whatever source the user provides.

Step 2: Extract metadata

From the content, extract or infer:

Field	How to find it
Title	The H1 heading, or the first prominent heading
Subtitle	Bold/italic text immediately after the title, or first sentence
Author	If present in a submission form or byline; default to "Peter Double"
Product label	Primary product mentioned (e.g., "Red Hat OpenShift AI")
Date	From submission form or current month/year
Read time	`ceil(word_count / 200)` formatted as "N min read"

If metadata cannot be inferred, ask the user. If only the title is ambiguous, ask about the title and use sensible defaults for the rest.

Step 3: Read the template and guide

Read the HTML template from .claude/skills/blog-create/assets/blog-template.html
Read the conversion guide from .claude/skills/blog-create/references/html-preview-guide.md

The blog-mockup skill shares these assets with blog-create. The conversion guide explains how to transform markdown to HTML elements, handle image placeholders, build breadcrumbs, and use the available CSS classes.

Step 4: Convert content to HTML

Follow the conversion rules in references/html-preview-guide.md to transform the blog body into HTML. Key points:

Convert markdown headings, paragraphs, lists, links, bold/italic to their HTML equivalents
Use class="tier-header" for bold lead-in paragraphs that introduce categorized lists
Use class="tagline" for pull-quote callouts
Use class="series-callout" for series context notes
Render image placeholders as .image-placeholder cards, or as actual HTML diagrams (.tier-diagram) when the placeholder describes a structured comparison
Strip any blog submission forms, checklists, or process metadata from the content
Exclude the H1 title and subtitle from the body (they go in the hero section)

Step 5: Assemble and write

Replace all {{PLACEHOLDER}} tokens in the template with actual values and write the output file.

Output location: Write next to the source file when one exists (e.g., blog-preview.html alongside final.md). If the content was pasted or from a URL, ask the user where to save it or default to the current working directory.

Step 6: Confirm

Tell the user where the file is and suggest they open it in a browser.

Important Notes

Do not include blog submission forms, pre-submission checklists, or review metadata in the HTML output
The H1 title and subtitle belong only in the hero section, not repeated in the article body
Verify no {{ placeholder tokens remain in the final HTML
No em dashes in the rendered content
If the content has no image placeholders, that is fine; skip image handling

同仓库更多 Skills

同仓库

add-knowledge-source

solaius/ai-asset-registry

Add a new knowledge source (Google Doc, PDF, URL, blog post, meeting transcript, repo) to the AI Asset Registry project. Use this skill whenever the user wants to incorporate a new document, reference, or source material into the project's knowledge base — including when they say "add this doc", "incorporate this source", "register this reference", "I have a new document", "add this blog", or share a Google Doc/PDF/repo/blog link for project use. Also use when updating the knowledge registry with new information from any source, including Red Hat blog posts, Red Hat Developer blog articles, or external technical blog content.

2026-07-062

blog-create

solaius/ai-asset-registry

Create Red Hat blog posts or review existing drafts through a multi-agent pipeline with iterative quality improvement. Use this skill whenever the user wants to write a blog post, create blog content, draft a Red Hat blog, review a blog draft, improve a blog post, or says things like "write a blog about X", "I need a blog post", "review my blog draft", "help me with a blog", "create a developer blog", or "blog about [topic]". Also use when the user shares a Google Doc or draft and wants it turned into a polished Red Hat blog post.

2026-07-062

presentation-create

solaius/ai-asset-registry

Create or update polished HTML presentations following Red Hat branding standards. Use this skill whenever the user wants to create a presentation, slide deck, overview page, pitch deck, scrolling narrative, executive summary page, or says things like "create a presentation about X", "I need a slide deck", "make an overview page", "build a presentation", "update the presentation", or "presentation for [audience]". Also use when the user has existing HTML presentations they want to refresh, extend, or adapt for a different audience. Covers both slide-deck format (keyboard-navigated, full-screen slides) and vertical-scrolling format (long-form narrative pages with fixed header navigation). Requires the superpowers plugin (for brainstorming) and benefits from Google Workspace MCP (for accessing GDrive source materials).

2026-07-062

repo-doctor

solaius/ai-asset-registry

Set up, bootstrap, or health-check the ai-asset-registry repo on a machine. Use this whenever the user wants to get the repo working on a new or other computer, load/configure its MCP servers (slack, google-workspace, rhai-tracker), or verify/repair the environment — git submodule, skill symlinks, Jira credentials, the customer-tracker (c-track) clone. Also use it for anything blocking the Slack MCP specifically: "is the slack mcp installed correctly", "slack tools aren't loading", "did podman set up right", "install podman for slack", "my slack tokens expired / invalid_auth", or checking whether the podman engine (not just Podman Desktop) and its machine are ready. Trigger on phrases like "set up this repo", "bootstrap the repo", "load the repo on my other laptop", "check my environment", "is my setup correct", "my MCPs/symlinks/skills are broken", "run the doctor", or "did the .env load everything". Runs an idempotent bootstrap.sh: a read-only health check by default, or a setup mode that writes configs fro

2026-07-052

customer-feedback-sync

solaius/ai-asset-registry

Sync customer tracking data from the local HTML interest tracker to the shared Google Sheet via the rhai-tracker MCP. Use when the user says "sync the tracker", "push to the sheet", "update the shared tracker", "sync customers to gdrive", "compare local vs remote tracker", "diff the trackers", or wants to review what's changed between the local HTML tracker and the team's centralized Google Sheet. Also use when the user has updated the local HTML tracker and wants those changes reflected in the shared sheet, or when they want to see which customers are in one tracker but not the other.

2026-06-292

customer-feedback-ingest

solaius/ai-asset-registry

Use when adding a new customer or updating an existing customer in the customer interest tracker from a meeting transcription, email thread, Jira ticket, pasted notes, or any source containing customer requirements/interests. Also use when the user says "add this customer", "update the tracker", "ingest this feedback", or shares a new transcription file.

2026-06-282

name

blog-mockup

description

blog-mockup

When to Use This vs blog-create

Scenario	Skill
Writing a new blog from scratch	`blog-create`
Reviewing/improving an existing draft	`blog-create`
Quick visual preview of any content	`blog-mockup`
Rendering a final.md as HTML	`blog-mockup`
Previewing a Google Doc as a Red Hat blog	`blog-mockup`
"What would this look like as a blog?"	`blog-mockup`

Inputs

The skill accepts blog content from any of these sources:

A markdown file path (e.g., docs/blogs/mcps/mcp-catalog/final.md)
A Google Doc link (fetch via mcp__google-workspace__get_doc_as_markdown with user pedouble@redhat.com)
Pasted text directly in the conversation
A URL (fetch via Playwright for JS-rendered pages, WebFetch otherwise)

Workflow

Step 1: Get the content

Read or fetch the blog content from whatever source the user provides.

Step 2: Extract metadata

From the content, extract or infer:

Field	How to find it
Title	The H1 heading, or the first prominent heading
Subtitle	Bold/italic text immediately after the title, or first sentence
Author	If present in a submission form or byline; default to "Peter Double"
Product label	Primary product mentioned (e.g., "Red Hat OpenShift AI")
Date	From submission form or current month/year
Read time	`ceil(word_count / 200)` formatted as "N min read"

If metadata cannot be inferred, ask the user. If only the title is ambiguous, ask about the title and use sensible defaults for the rest.

Step 3: Read the template and guide

Read the HTML template from .claude/skills/blog-create/assets/blog-template.html
Read the conversion guide from .claude/skills/blog-create/references/html-preview-guide.md

Step 4: Convert content to HTML

Follow the conversion rules in references/html-preview-guide.md to transform the blog body into HTML. Key points:

Convert markdown headings, paragraphs, lists, links, bold/italic to their HTML equivalents
Use class="tier-header" for bold lead-in paragraphs that introduce categorized lists
Use class="tagline" for pull-quote callouts
Use class="series-callout" for series context notes
Render image placeholders as .image-placeholder cards, or as actual HTML diagrams (.tier-diagram) when the placeholder describes a structured comparison
Strip any blog submission forms, checklists, or process metadata from the content
Exclude the H1 title and subtitle from the body (they go in the hero section)

Step 5: Assemble and write

Replace all {{PLACEHOLDER}} tokens in the template with actual values and write the output file.

Step 6: Confirm

Tell the user where the file is and suggest they open it in a browser.

Important Notes

Do not include blog submission forms, pre-submission checklists, or review metadata in the HTML output
The H1 title and subtitle belong only in the hero section, not repeated in the article body
Verify no {{ placeholder tokens remain in the final HTML
No em dashes in the rendered content
If the content has no image placeholders, that is fine; skip image handling