Wowchemy で Markdown を使ってスライドを作成する

Wowchemy | ドキュメント

機能

• Markdown で効率的にスライドを書けます
• 3-in-1：スライドの作成・発表・公開ができます
• 発表者ノートに対応しています
• モバイル対応のスライド

操作

• 次へ：Right Arrow または Space
• 前へ：Left Arrow
• 最初：Home
• 最後：End
• 概要：Esc
• 発表者ノート：S
• 全画面：F
• ズーム：Alt + Click
• PDF エクスポート：E

コードハイライト

インラインコード：variable

コードブロック：

porridge = "blueberry"
if porridge == "blueberry":
    print("Eating...")

数式

インライン数式：$x + y = z$

ブロック数式：

$$ f\left( x \right) = ;\frac{{2\left( {x + 4} \right)\left( {x - 4} \right)}}{{\left( {x + 4} \right)\left( {x + 1} \right)}} $$

フラグメント

コンテンツを少しずつ表示します

{{% fragment %}} One {{% /fragment %}}
{{% fragment %}} **Two** {{% /fragment %}}
{{% fragment %}} Three {{% /fragment %}}

Space を押して再生してください！

フラグメントは2つの任意パラメータを受け取れます：

• class：カスタムスタイルを使用します（カスタム CSS での定義が必要です）
• weight：フラグメントが表示される順序を設定します

発表者ノート

プレゼンテーションに発表者ノートを追加します

{{% speaker_note %}}
- Only the speaker can read these notes
- Press `S` key to view
{{% /speaker_note %}}

S キーを押すと発表者ノートを表示できます！

テーマ

• black：黒い背景、白い文字、青いリンク（デフォルト）
• white：白い背景、黒い文字、青いリンク
• league：灰色の背景、白い文字、青いリンク
• beige：ベージュの背景、濃い文字、茶色のリンク
• sky：青い背景、細い濃色の文字、青いリンク

• night：黒い背景、太い白い文字、オレンジのリンク
• serif：カプチーノ色の背景、灰色の文字、茶色のリンク
• simple：白い背景、黒い文字、青いリンク
• solarized：クリーム色の背景、濃い緑の文字、青いリンク

カスタムスライド

スライドのスタイルと背景をカスタマイズします

{{< slide background-image="/media/boards.jpg" >}}
{{< slide background-color="#0000FF" >}}
{{< slide class="my-style" >}}

カスタム CSS の例

見出しを濃紺（navy）にしてみましょう。

assets/css/reveal_custom.css を作成し、次を記述します：

.reveal section h1,
.reveal section h2,
.reveal section h3 {
  color: navy;
}

質問はありますか？

質問する

ドキュメント