Agent Skillsasgeirtj/system_prompts_leaks › export-as-pptx-editable

export-as-pptx-editable

GitHub

将HTML幻灯片导出为可编辑的PPTX文件,支持原生文本、形状和图像。通过gen_pptx工具自动处理字体、导航及布局,确保内容在PowerPoint中完全可编辑。

Anthropic/claude-design/skills/export-as-pptx-editable/SKILL.md asgeirtj/system_prompts_leaks

Trigger Scenarios

用户要求将网页或HTML幻灯片转换为PPTX格式 需要生成可在PowerPoint中直接编辑的演示文稿

Install

npx skills add asgeirtj/system_prompts_leaks --skill export-as-pptx-editable -g -y
More Options

Non-standard path

npx skills add https://github.com/asgeirtj/system_prompts_leaks/tree/main/Anthropic/claude-design/skills/export-as-pptx-editable -g -y

Use without installing

npx skills use asgeirtj/system_prompts_leaks@export-as-pptx-editable

指定 Agent (Claude Code)

npx skills add asgeirtj/system_prompts_leaks --skill export-as-pptx-editable -a claude-code -g -y

安装 repo 全部 skill

npx skills add asgeirtj/system_prompts_leaks --all -g -y

预览 repo 内 skill

npx skills add asgeirtj/system_prompts_leaks --list

SKILL.md

Frontmatter
{
    "name": "export-as-pptx-editable",
    "description": "Native text & shapes — editable in PowerPoint",
    "user-invocable": true
}

Export as PPTX (editable)

Export an HTML slide deck to a .pptx with native PowerPoint objects (editable text, shapes, images). One gen_pptx tool call does everything: capture, font handling, generation, download.

What you do

  1. Know the deck. You probably wrote it. If not, read_file the HTML to find: the slide selector, how to navigate (function name? class toggle?), what fonts it uses, whether there's a scaling wrapper.
  2. show_to_user the deck so it's in the user's preview.
  3. Call gen_pptx with the inputs below.
  4. Read the validation flags in the result and decide if you need to retry.

gen_pptx inputs

{
  "width": 1920, "height": 1080,   // CSS px — match the deck's slide size
  "slides": [                      // one entry per slide, in order
    { "showJs": "goToSlide(0)", "selector": ".slide.active" },
    { "showJs": "goToSlide(1)", "selector": ".slide.active" }
    // For decks where all slides are in DOM at once and you don't need to navigate:
    //   { "selector": ".slide:nth-child(1)" }, { "selector": ".slide:nth-child(2)" }
  ],
  "hideSelectors": [".nav", ".progress", "[data-omelette-chrome]", "[data-noncommentable]"],
  // If the deck wraps slides in a transform:scale() container, name it here.
  // gen_pptx clears the transform AND forces width/height onto this element.
  "resetTransformSelector": ".slide-container",
  // Font handling — pick ONE strategy based on the directive at the bottom.
  // Substitution happens BEFORE capture so layout reflows correctly.
  "googleFontImports": ["Poppins", "Lora"],
  "fontSwaps": [{ "from": "BrandSans", "to": "Poppins" }],
  // Or fontSwaps: [{from:"BrandSans", to:"Arial"}] for web-safe.
  // Or omit both to keep brand fonts as-is.
  "filename": "my-deck"
}

If — and only if — the user asked for Google Slides, also pass "offer_google_slides": true: the export dialog gains a 'Send to Google Slides' button, and the upload happens only if they click it.

slides[].showJs runs inside the iframe as a sync expression — don't await. If your deck's nav function is async, call it without await; the per-slide delay (default 600ms) covers the transition. Bump delay for decks with longer CSS transitions.

If the deck uses the <deck-stage> starter component

  • resetTransformSelector: "deck-stage" — the exporter sets the noscale attribute on it, which the component observes and responds to by dropping its shadow-DOM transform: scale(). You cannot reach the scaled canvas any other way.
  • slides[N].showJs: "document.querySelector('deck-stage').goTo(N)" — 0-indexed, so slide 1 is goTo(0).
  • slides[N].selector: "deck-stage > [data-deck-active]".
  • hideSelectors is unnecessary — the overlay and tap-zones live in shadow DOM and aren't captured.

Speaker notes

Read automatically from <script type="application/json" id="speaker-notes"> and attached by index. You don't pass them.

Validation flags

The result lists flags. These are warnings, not errors — read each message and decide if it's expected for THIS deck:

  • duplicate_adjacent / duplicate_majority — slides captured identically. Almost always means showJs didn't navigate. Check the function name, try a longer delay, or check if the deck uses 0-indexed vs 1-indexed slides.
  • slide_size_mismatch — captured rect doesn't match width/height. The selector is probably matching a wrapper, or you need a resetTransformSelector.
  • notes_uniform_nonempty — every speaker note is the same string. Likely a placeholder. Fine if intentional.
  • notes_count_mismatch — #speaker-notes length ≠ slides length. Notes attach by index so the tail will be wrong.
  • no_speaker_notes — deck has no #speaker-notes tag. Expected if there are no notes.
  • fonts_timeout — fonts.ready took >8s. Font URLs may be unreachable.
  • font_swap_failed — one or more fontSwaps targets never loaded (misspelled family, or Google Fonts doesn't serve it), so the deck was laid out with a fallback while the file names the swap font. Retry with a corrected or different family, or fall back to web-safe fonts. Whatever you do next, tell the user plainly which fonts couldn't be applied — e.g. "Heads up: Poppins couldn't be loaded during export, so the deck uses a stand-in font and text may wrap differently. Want me to try a different font?"
  • images_failed — images didn't decode before capture. Usually a 404 or CORS.
  • reset_selector_miss — your resetTransformSelector matched nothing.

If the flags look like real problems, fix the inputs and retry. If they're expected (deck genuinely has no notes, two slides really are identical), tell the user the download fired and move on.

Talking to the user about flags: these names and messages are internal diagnostics — do NOT relay them verbatim. If everything is expected, don't mention validation at all; just confirm the download. If something looks genuinely wrong, describe it in plain language without the flag identifier or technical specifics — e.g. "Uh oh, the speaker notes may not be exporting properly." rather than "I received the no_speaker_notes flag", or "A couple of slides may have captured identically — let me fix navigation and retry." rather than quoting duplicate_adjacent.

The page reloads automatically after capture — DOM mutations (hidden chrome, font swaps) are reverted.

Font strategy

Read the directive at the end of this prompt and translate it to inputs:

Directive Inputs
brand fonts as-is omit googleFontImports and fontSwaps
web-safe substitutes fontSwaps: [{from:"EachCustomFont", to:"Arial"}] (or Georgia for serifs, Courier New for monospace)
Google Fonts substitutes googleFontImports: ["Poppins","Lora"] + fontSwaps: [{from:"EachCustomFont", to:"Poppins"}]

System fonts (Arial, Helvetica, Georgia, Times, Courier, sans-serif, etc.) — leave alone.

Version History

  • 481967c Current 2026-08-20 17:02

Same Skill Collection

Anthropic/claude-code/skills/artifact-diagramming/SKILL.md
Anthropic/claude-code/skills/batch/SKILL.md
Anthropic/claude-code/skills/claude-in-chrome/SKILL.md
Anthropic/claude-code/skills/debug/SKILL.md
Anthropic/claude-code/skills/deep-research/SKILL.md
Anthropic/claude-code/skills/design-sync/SKILL.md
Anthropic/claude-code/skills/fewer-permission-prompts/SKILL.md
Anthropic/claude-code/skills/init/SKILL.md
Anthropic/claude-code/skills/keybindings-help/SKILL.md
Anthropic/claude-code/skills/loop/SKILL.md
Anthropic/claude-code/skills/run-skill-generator/SKILL.md
Anthropic/claude-code/skills/run/SKILL.md
Anthropic/claude-code/skills/schedule/SKILL.md
Anthropic/claude-code/skills/security-review/SKILL.md
Anthropic/claude-code/skills/simplify/SKILL.md
Anthropic/claude-code/skills/verify/SKILL.md
Anthropic/claude-code/skills/workflow-authoring/SKILL.md
Anthropic/claude-cowork/setup-writing-style/SKILL.md
Anthropic/claude-design/skills/claude-api-in-prototypes/SKILL.md
Anthropic/claude-design/skills/create-design-system/SKILL.md
Anthropic/claude-design/skills/frontend-design/SKILL.md
Anthropic/claude-design/skills/hi-fi-design/SKILL.md
Anthropic/claude-design/skills/maps-geography/SKILL.md
Anthropic/claude-design/skills/options/SKILL.md
Anthropic/claude-design/skills/wireframe/SKILL.md
Anthropic/claude-code/skills/artifact-capabilities/SKILL.md
Anthropic/claude-code/skills/artifact-design/SKILL.md
Anthropic/claude-code/skills/claude-api/SKILL.md
Anthropic/claude-code/skills/dataviz/SKILL.md
Anthropic/claude-code/skills/design/SKILL.md
Anthropic/claude-code/skills/doctor/SKILL.md
Anthropic/claude-code/skills/update-config/SKILL.md
Anthropic/claude-design/skills/3d-object/SKILL.md
Anthropic/claude-design/skills/animated-video/SKILL.md
Anthropic/claude-design/skills/export-as-pptx-screenshots/SKILL.md
Anthropic/claude-design/skills/flier/SKILL.md
Anthropic/claude-design/skills/handoff-to-claude-code/SKILL.md
Anthropic/claude-design/skills/html-email/SKILL.md
Anthropic/claude-design/skills/interactive-prototype/SKILL.md
Anthropic/claude-design/skills/make-a-deck/SKILL.md
Anthropic/claude-design/skills/make-a-doc/SKILL.md
Anthropic/claude-design/skills/make-tweakable/SKILL.md
Anthropic/claude-design/skills/save-as-pdf/SKILL.md
Anthropic/claude-design/skills/save-as-standalone-html/SKILL.md
Anthropic/claude-design/skills/web-research/SKILL.md

Metadata

Files
0
Version
a7d0a26
Hash
e0d2bf96
Indexed
2026-08-20 17:02

Accueil - Wiki
Copyright © 2011-2026 iteam. Current version is 2.155.2. UTC+08:00, 2026-08-30 08:14
浙ICP备14020137号-1 $Carte des visiteurs$