読者です 読者をやめる 読者になる 読者になる

FIELD NOTES: 書を持って街へ出よう

合同会社フィールドワークス プログラマ兼代表のブログ

Evernoteで図入りのMarkdown文書を書いてMarkedでプレビューする方法(Mac OS X)

EvernoteにMarkdown記法でメモを書くのは便利なのですが, せっかくEvernoteを使っているのに図を手軽に扱えないのは残念なので,ひと工夫してみました。

f:id:fet:20131221194358p:plain

使い方

以下が作成したPythonスクリプトです。

<EVERNOTE_USER_NAME>の部分は,Evernoteのアカウント名に置き換えてください。

EvernoteにMarkdown形式で記述した文書をMardedでプレビューするためのMac OS ...

これをAutomatorでサービスとして登録します。

f:id:fet:20131221194051p:plain

Evernoteでページを編集中に登録したサービスを呼び出せば, Marked.appで表示されます。

f:id:fet:20131221194117p:plain

仕組み

Mac版のEvernoteでは,Evernoteのデータを以下のディレクトリ配下に格納します。

 「~/Library/Containers/com.evernote.Evernote/Data/Library/Application Support/Evernote/accounts/Evernote/<ユーザ名>/content」

編集中のページに対応するディレクトリがどれかは, Apple event経由でEvernoteに問い合わせてもわからない様なので, 更新日時が最新のディレクトリを編集中のページに対応するディレクトリと見なします。

ページの内容はcontent.htmlというファイルに反映されます。 ページに挿入した画像は,同じディレクトリ内に画像ファイルとして保存されます (⌘+Sキーを押せば,編集内容は即座にファイルに保存されるようです)。

html2textを使って,content.htmlをMarkdown形式に変換し, 同じディレクトリにファイルとして保存します。 この部分の処理がhtml2textの本来の使い方から外れていてトリッキーですが, Markdown表記のテキストはP要素の内容としてそのまま出力されます。 画像は,context.htmlの中ではIMG要素として表現されるので, 結果的に「![](<画像ファイル名>)」形式に変換されます。

次に作成したMarkdownファイルをMarked.appで開くのですが, 画像ファイルと同じディレクトリにあるので画像も表示されます。

参考にさせていただいた記事