HTML PPT · コースモジュール
html-ppt マスタースキルへの集中エントリーポイント。ユーザーを**course-module** フルデッキテンプレートに直接導きます。
このカードが選択された場合
「使用例」ギャラリーでは、「Use this prompt」が上記のexample_promptにリンクしています。そのプロンプトを受け入れた場合、ユーザーがcourse-moduleのビジュアルアイデンティティを正確に求めるなら、このカードが適切な選択です(スクリーンショットと根拠については、上流のフルデッキカタログを参照)。
デッキのオーサリング方法
- 最初にマスタースキルを読んでください。 すべてのオーサリングルールは
design-templates/html-ppt/SKILL.mdにあります — コンテンツ/オーディエンスチェックリスト、トークンルール、レイアウトの再利用、プレゼンターモード、キーボードランタイム、「プレゼンターのみのテキストをスライドに絶対に配置しない」ルール。 - 対応するテンプレートフォルダから開始:
design-templates/html-ppt/templates/full-decks/course-module/—index.htmlとstyle.cssをプロジェクトにコピーし、.tpl-course-modulebodyクラスを維持します。 - テンプレートと共有ランタイムを持ち込みます。 上流の
index.htmlは../../../assets/...を介して共有CSS/JSをリンクしています。これはdesign-templates/html-ppt/templates/full-decks/内の3階層深くにあるためです。index.htmlをプロジェクトにコピーすると、これらの親相対URLは解決できなくなり、base.css、animations.css、runtime.jsが404になります。つまり、デッキがアクティブにならず、スライドナビゲーションが機能しません。プロジェクトごとに以下の2つのレシピのいずれかを選択してください:- レシピA — コピー後に書き換え(推奨):
design-templates/html-ppt/assets/fonts.css、design-templates/html-ppt/assets/base.css、design-templates/html-ppt/assets/animations/animations.css、design-templates/html-ppt/assets/runtime.jsをプロジェクトローカルのassets/(assets/animations/animations.cssを含む)にコピーし、index.html内の4つの<link>/<script>タグを../../../assets/...から対応するプロジェクトローカルパス(assets/fonts.css、assets/base.css、assets/animations/animations.css、assets/runtime.js)に書き換えます。 - **レシピB — インライン化:**同じ4つのファイルを読み込み、各
<link rel="stylesheet" href="../../../assets/...">をファイルの内容を含む<style>...</style>に置き換え、<script src="../../../assets/runtime.js">をruntime.jsの内容を含む<script>...</script>に置き換えます。単一の自己完結型index.htmlが生成されます。 どちらの場合も、上流の../../../assets/...URLをそのままプロジェクト成果物に出荷しないでください。これらはツリー内でのみ機能します。
- レシピA — コピー後に書き換え(推奨):
- テーマを選択します。 デフォルトのトークンで問題ありません。ユーザーが異なる雰囲気を希望する場合は、
design-templates/html-ppt/assets/themes/*.cssから36のテーマのいずれかを<link id="theme-link">を介して交換し、Tキーで切り替えられるようにします。 - デモコンテンツを置き換え、クラスは変更しないでください。
.tpl-course-moduleスコープ付きCSSは、テンプレートに含まれる構造クラスのみを認識します。それらを維持してください。 - スピーカーノートは
<aside class="notes">または<div class="notes">の中に記述します — スライド上に表示テキストとして絶対に配置しないでください。
帰属
ビジュアルシステム、レイアウト、テーマ、ランタイムキーボードモデルは、上流のMITライセンス lewislulu/html-ppt-skill から提供されています。LICENSEファイルは design-templates/html-ppt/LICENSE に同梱されています。再配布時はそのまま保持してください。