Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.
Marp Tips !
ひげ
What is Marp ?
yhatt さん作
MDからスライドを生成してくれるソフト
Electron で書かれてる
GitHub にソースコードが公開されてる
このスライド
Marp の Tips 集
英語であれば yhatt さんのがある
GitHub にも詳しく書いてある
実は自分の記事用の資料
自分で書いたテーマを使ってます
<!-- $theme: olive -->
Markdown 記法
ベースはGithub Flavored Markdown
--- でスライドを区切る
Deckest に寄せてるらしい
## What is [Marp](https://yhatt.github.io/marp/) ?...
テーマの変更
マークダウンの頭に <!-- $theme: aaa -->
<!-- $theme: olive -->
# Marp Tips !
### ひげ
元からあるのは default の gaia の 2 つ
カラースキーマの変更
変更したいスライドの頭に <!-- *templat: aaa -->
<!-- template: invert -->
## What is [Marp](https://yhatt.github.io/marp/) ...
PDF へのエクスポート
ツールバーの file -> Export Slides as PDF
Ctrl + Shift + E でも良い
画像に関するオプション
![70%](hoge.jpg) で拡縮変更
![center](hoge.jpg) でセンタリング
![bg](hoge.jpg) で背景に設定
![fit](hoge.jpg) でサイズを合わせてくれる
![70% ...
数式
$ ... $ や $$ ... $$ で Latex の数式をレンダリング
KaTex を使ってる
なので完全に LaTex 表記をサポートしていない
可能な表記
e = −1
$$ e ^ {i pi} = -1 $$
iπ
サイズに関する設定
<!-- $width: 12in -->
<!-- $height: 6in -->
<!-- $size: 16:9 -->
でサイズを変更できる
デフォルトでは <!-- $size: 4:3 -->
その他
Emoji をサポート
チートシート
==ハイライト== でハイライト
<!-- footer: this is footer --> でフッターを設定
* があるとそのスライドだけ付ける
<!-- page_number: true ...
現状できないこと
プレゼンテーションモード
対応予定?
テーマの作成(カスタム CSS)
現状のテーマのCSSをいじるのはできる
(README 参照)
もっといいのは対応予定?
ついてるエディタのショートカットをいじれない
Thank yhatt !
Marp always supported me.
So, I want to support you,
someday...
FIN
Prochain SlideShare
Chargement dans…5
×

Marp Tips

3 585 vues

Publié le

Marp : https://yhatt.github.io/marp/

Publié dans : Logiciels
  • Soyez le premier à commenter

Marp Tips

  1. 1. Marp Tips ! ひげ
  2. 2. What is Marp ? yhatt さん作 MDからスライドを生成してくれるソフト Electron で書かれてる GitHub にソースコードが公開されてる
  3. 3. このスライド Marp の Tips 集 英語であれば yhatt さんのがある GitHub にも詳しく書いてある 実は自分の記事用の資料 自分で書いたテーマを使ってます <!-- $theme: olive -->
  4. 4. Markdown 記法 ベースはGithub Flavored Markdown --- でスライドを区切る Deckest に寄せてるらしい ## What is [Marp](https://yhatt.github.io/marp/) ? - [yhatt](https://github.com/yhatt) さん作 - MDからスライドを生成してくれるソフト - [Electron](http://electron.atom.io/) で書かれてる - [GitHub](https://github.com/yhatt/marp)にソースコードが公開されてる --- ## このスライド
  5. 5. テーマの変更 マークダウンの頭に <!-- $theme: aaa --> <!-- $theme: olive --> # Marp Tips ! ### ひげ 元からあるのは default の gaia の 2 つ
  6. 6. カラースキーマの変更 変更したいスライドの頭に <!-- *templat: aaa --> <!-- template: invert --> ## What is [Marp](https://yhatt.github.io/marp/) ? - [yhatt](https://github.com/yhatt) さん作 - MDからスライドを生成してくれるソフト * を外すと以降すべてのスライドに反映される olive には default と invert と gaia の3種
  7. 7. PDF へのエクスポート ツールバーの file -> Export Slides as PDF Ctrl + Shift + E でも良い
  8. 8. 画像に関するオプション ![70%](hoge.jpg) で拡縮変更 ![center](hoge.jpg) でセンタリング ![bg](hoge.jpg) で背景に設定 ![fit](hoge.jpg) でサイズを合わせてくれる ![70% center](hoge.jpg) 空白区切りで複数指定か ![10%](./fig/marp.png) ![30% center](./fig/marp.png)
  9. 9. 数式 $ ... $ や $$ ... $$ で Latex の数式をレンダリング KaTex を使ってる なので完全に LaTex 表記をサポートしていない 可能な表記 e = −1 $$ e ^ {i pi} = -1 $$ iπ
  10. 10. サイズに関する設定 <!-- $width: 12in --> <!-- $height: 6in --> <!-- $size: 16:9 --> でサイズを変更できる デフォルトでは <!-- $size: 4:3 -->
  11. 11. その他 Emoji をサポート チートシート ==ハイライト== でハイライト <!-- footer: this is footer --> でフッターを設定 * があるとそのスライドだけ付ける <!-- page_number: true --> でページ番号を追加 デフォルトは false * があるとそのスライドだけ付ける this is footer 11
  12. 12. 現状できないこと プレゼンテーションモード 対応予定? テーマの作成(カスタム CSS) 現状のテーマのCSSをいじるのはできる (README 参照) もっといいのは対応予定? ついてるエディタのショートカットをいじれない
  13. 13. Thank yhatt ! Marp always supported me. So, I want to support you, someday... FIN

×