MarkdownPreviewで任意のテンプレートを使う方法

スポンサーリンク

SublimeText-MarkdownPreviewのREADME.mdを読んでいたら 1 Featuresのところに気になるものを見つけました。

HTML template customisation thanks to @hozaka

訳したら

@hozaka のおかげで HTML テンプレートのカスタマイズができるようになりました。

え?
MarkdownPreviewって任意のHTMLテンプレートファイルが使えるの!?

知らなかった!
知らなかったから、アップデートののたびにMarkdownPreview.cyを編集して任意のコード追記してたわ! 2

さっそく、使い方を調べてみました!

日本語での解説が見当たらなかった…orz

スポンサーリンク

html_templateを使ってみる

日本語での解説がないのならば、仕方がないので、自分でなんとかするしかありません。
Packagesディレクトリを覗いてみて、それらしいファイルを探すしかありません。

って思ってたら、即効見つけました。
Packages/Markdown Preview/customized-template-sample.html
って普通に置いてありました。

でもこれはあくまでサンプルファイルのようですので、使用するためにどうすればいいのかを把握しなくてはなりません。

とりあえず、MarkdownPreview.sublime-settingsの中をtemplateで検索してみると、ありました( TДT)

コメントアウトされていますが、115行目あたりから以下のように書かれてあります。

/*
Specify a HTML template file to render your markdown within.

Available place holders in HTML template:
{{ HEAD }} – would be replaced by generated stylesheets, javascripts enabled above
{{ BODY }} – would be replaced by HTML converted from markdown

By setting “skip_default_stylesheet” to true you can use the styles only in your HTML
template. In most cases you should turn this setting on to have a full-featured design.

Refer to ‘customized-template-sample.html’ as a show case.
*/
// “html_template”: “/ABS_PATH_TO_A_HTML_FILE”,
// “skip_default_stylesheet”: true,

訳すとこんな感じですかね。

MarkDownをレンダリングするHTMLテンプレート ファイルを指定します。

HTML テンプレートで使用できるプレース ホルダー
{{ HEAD }} – 生成されたスタイルシート、上記の有効なJavascriptは置き換えられるだろう
{{ BODY }} – MarkDownから変換されたHTMLは置き換えられるだろう

“skip_default_stylesheet”を true に設定することで、あなたのHTMLでのスタイルシートを使用することができます。

サンプルとしてcustomized-template-sample.html参照してください。
// “html_template”: “/ABS_PATH_TO_A_HTML_FILE”,
// “skip_default_stylesheet”: true,

customized-template-sample.htmlは先ほど見つけていたファイルですね。
最後の2行が設定かしょでしょうから、コメントアウトを解除して、HTMLファイルへの絶対パスを指定してあげればいいだけのようです。

ということで試しに設定してみました。

"html_template": "hogehoge/Packages/Markdown Preview/customized-template-sample.html",
"skip_default_stylesheet": true,

おお!
できました!

過去の私が毎回設定していたMarkdownPreview.cyへの編集はなんだったんでしょう!
いつからhtml_templateが使えるようになっていたんだろう?
今回のアップデートからであってほしい。過去の自分の努力のためにw

これからは、テンプレート用のHTMLとCSSさえバックアップを取っておいて、アップデートがあっても、html_templateの設定さえすませてしまえば、すぐに今までの環境で再開できます。

また、DropboxなどにHTMLとCSSなど必要なものを置いておけば、MacやWindows、他のマシンでもすぐに自分のテンプレートを使用してMarkDownを書くことができます。

自信のある方は、テンプレートを公開してもいいかもしれませんね。

html_template これはステキ☆
@hozaka ありがとう!!


  1. 英語が読めるわけじゃないので雰囲気を読むというのが正しい 

  2. MarkDownPreviewで複数のスタイルを使用する 

タイトルとURLをコピーしました