「.md」(マークダウン形式)のファイルを編集する必要ができたので、Bracketsの拡張機能を使いました。
編集だけなら、素のBracketsでできるんですが、プレビューしながら…となると、拡張機能が必要です。
マークダウンをプレビューできる拡張機能はこの2つ。
私は、Brackets Markdown Previewを使いました。
Markdown Previewの方が先にできたマークダウンのプレビュー機能で、Brackets Markdown Previewは、それを元に作られたやつみたい。(なので、きっとこっちの方が便利)
導入方法と使い方を簡単にまとめました。(ほとんど自分のため)
Brackets Markdown Previewを拡張機能にインストール
Bracketsを起動⇨ファイル⇨拡張機能マネージャー
Brackets Markdown Previewを使えば、マークダウン形式のファイルをプレビューしながら編集できます。
Bracketsの拡張機能なので、Bracketsの拡張機能マネージャーを呼び出して、ダウンロードしましょう。
拡張機能マネージャーは、Bracketsのファイルから入ります。
拡張機能マネージャーでBrackets Markdown Previewを入力して検索
拡張機能マネージャーを開いたら、右上に表示されている「🔎(虫眼鏡)」に「Markdown Preview」と入力し、検索。
Markdown PreviewとBrackets Markdown Previewの2種類出てきます。
Markdown Previewの方がリリースが先。Brackets Markdown Previewは、Markdown Previewより2年後のリリース。
詳細説明に書いてありますが、Markdown Previewを参考に作成されたのが、Brackets Markdown Previewです。
どちらをダウンロードしてもいいと思いますが、私は新しい方をダウンロードしました。
拡張機能をダウンロード後にプレビュー表示ができるように
拡張機能の導入が終わったら、マークダウン書類をプレビュー表示させながら編集できます。
Bracketsの右側にある「M+」をクリックすると、画面の下側にプレビューが表示。
初期設定は、白地に黒文字でプレビューされます。
Brackets Markdown Previewの詳細設定のやり方
プレビュー画面の詳細設定は、プレビュー画面右上にある「⚙(歯車)」ボタンクリックで可能です。
左から設定を説明すると…。
Preview(プレビュー画面の基本設定)
- Markdown Format
・Standard Markdown か GitHub-Flavored(GFM) を選択 - Preview Theme
・Clean,Dark,Github,Markdown5,Markdown7,Screen,Serif から選択 - Background Color
・背景色を任意の色にできる(red とか white とか)
Ext.Behavior(プレビュー画面の別表示設定 など)
- Activate Markdown Preview on Start
(マークダウン編集中、プレビュー画面はそのまま) - Sync scroll position
(マークダウン編集中、プレビュー画面も一緒に上下) - Character Encoding
(デフォルトは、utf-8) - Open detached preview
このボタンをクリックでプレビューが別画面に
WordPressやはてなブログでもマークダウンの文書をプレビューできるけど…
マークダウンの文書は、はてなブログや、WordPress(の新エディタGutenberg)でもプレビューできます。
でも、コードが混ざった文章をプレビューするには不適。
Brackets Markdown Previewなら、コード混じりの文章でも違和感なくプレビューできるので、便利でした。
コメント