Slideckを使ってMarkdownで簡単にスライドを作成する方法
Slideckを使ってMarkdownで簡単にスライドを作成する方法をメモしておきます。
Markdownでスライドを作れるreveal.jsを調べてたら、Slideckというサービスを発見しました。
自分で環境を構築する必要がないので、公開目的のスライドであればこれで十分ですね。
gistに画像ファイルをアップロード
下のリンクを参考。
Gistにpngをアップする方法をメモしておく。 – yuta _ 0
一度git cloneしてからpushする必要があります。
git clone git@gist.github.com:4b2532e7c3ba9db08f48b46c5f03308d.git cd 4b2532e7c3ba9db08f48b46c5f03308d # ディレクトリにpngファイルを移動 git add yamano.png git commit -m "add png file" git push
スライド作成
slideck.ioのトップページから作成したMarkdownファイルを入力して、Show Slidesボタンを押すだけでできあがりです。
下のリンクから、今回作成したスライドが確認できます。
https://slideck.io/gist.github.com/yamano/4b2532e7c3ba9db08f48b46c5f03308d/slide.md#/
ブログへの埋め込み
埋め込みはちょっと難しいですね。。
- escボタンで一覧が出るので、それをスクリーンショット(イケてない)
- gif画像を作成して、スクリーンショット(これかなー。。)
- gif化はリンク先を参考 → LICEcap を使ってMacの画面をキャプチャしてgif化する - やーまんぶろぐ
- pdf化 → slideshare投稿 → 埋め込みコード貼り付け(できなかった。。)
- 上の流れで埋め込みコードを作成しようとしたけどpdf化ができなかった。(できるけど崩れる)
- 本家のreveal.jsでは/?print-pdf/# をつけるとうまくpdf化できたのですが、slideckではできないようです。(検証が足りていないかもしれません)
- reveal.jsで作った資料をChromeでPDF出力する方法 - Qiita
pdf化できたとしても手間なのでしない方向で。リンクとgif貼る感じですかね。
最後に
しばらくこれでスライドは作ってみようと思います。
気が向いたら、また書きます。
