StackEditを使ってMarkdown記法の投稿を書いてみた

StackEditを使って<a class="keyword" href="http://d.hatena.ne.jp/keyword/Markdown">Markdown</a>記法の投稿を書いてみた

StackEdit

ここから誰でも使える。
Chrome用アプリと聞いていたがブラウザ関係無しに使えそう。
とりあえずFirefoxChromiumで使えることは確認した。

テスト投稿

とりあえずググった結果これが一番よさそう。
とはいうもののMarkdown記法を自分が使いこなせているのかといえばご覧の通りである。
まぁブログ投稿と練習を兼ねるということで。

コード確認

とりあえずこのブログで扱うであろう言語を全部確認していく。
 ;common lisp
"hello,world"
 #python
print('hello,world')
 //c++
printf
("hello,world");
 #ruby
puts
'hello,world'
ちょっと面倒だったのでコメントとhello,worldのみ……
んん? Lispのコメントだけ色づかない?
それともコメントの書き方間違ってる?

機能

基本的にMarkdownエディタとして使える。
2ペイン縦分割でリアルタイムに見れる。
簡単なショートカットキーも対応。(Ctrl+Zだけしか使ったことないけど)
右上にあるいくつかのボタンに便利な機能がある。
左から順に5つある。
  1. Markdown syntax」
    Markdonのアンチョコ
  2. 「Table of contents」
    #とかの見出しで作るツリー構造とか見れる
  3. 「Document statistics」
    文字数、単語数、段落数をカウントしてくれる
  4. 「HTML code」
    HTMLコードを開いてくれる。デフォルトでハイライト(反転)済み。
  5. 「Open in viewer」
    プレビューの全画面表示。元に戻すにはどうしたらいいかと思ったら、左上の#記号を押せばよかった。
アンチョコは非常に便利。
他にも様々な形式でローカル保存できたりgoogle driveやdropboxdとの連携があったりとシンプルながらもありがたい機能がついている。

まとめ

まぁいくら便利にブログが書けたところで投稿に中身があって更新が続かなけりゃなんの意味もないんですけどね。

(投稿後追記)

うおおおおい! 肝心のBloggerの方でコードがハイライトされてないじゃないか!
しかもHTML上ではきちんとh1,h2,h3ができてるのに実際にブログを表示するとフォントサイズがおかしい。
一体どうなってるんだ。

(解決)

どうやらBloggerに送る際に問題があったようだ。
Publish on Bloggerで選べるformatは三種類
最初紹介記事とかに載ってたようにHTMLを選んだ。
すると上記の通り上手く表示がされない。
次にmarkdownを試した。BloggerMarkdown対応ではないので当然これも駄目。
そこでtemplateを選んだところ、すっきりとプレビュー通りにいった。
しかも驚いたことに、間違えて二重に投稿してしまったHTML版の投稿まで直っている。
これは単純に変換がどうこう。と言う前に何かjavascriptとかが入ってるかどうかの問題なのでは、と思い比較したらビンゴ。
 rel="stylesheet" href="https://stackedit.io/res-min/themes/base.css" />
type="text/javascript" src="https://stackedit.io/libs/MathJax/MathJax.js?config=TeX-AMS_HTML">
templateにあったこれが鍵だったようだ。一回templateを下書きに戻して意図しない表示になってしまったHTML版の投稿にこれを加えたところ、template版と同じ表示になった。
だが投稿して確認したところ何かがおかしい。コードのハイライトも見出しサイズも合ってる。けど違和感を感じる。
見比べたところ、ブログ全体のレイアウトが変化している。そうか、スタイルシートの書き換えをしてしまったからか。
投稿内限定でスタイルシートを適用するようにしなくてはいけないらしい。
なんだかもう面倒になったのでとりあえず今回は保留