WordPressの記事更新がラクになる！Markdown記法のススメ

Markdown とは

書きやすくて読みやすいプレーンテキストとして記述した文書を、妥当なXHTML（もしくはHTML）文書へと変換できるフォーマット」として、ジョン・グル―バー（英語版）により作成された。アーロン・スワーツも大きな貢献をしている。Markdown の記法の多くは、電子メールにおいてプレーンテキストを装飾する際の慣習から着想を得ている。

Wikipedia より引用

・・・まだちょっとピンと来ませんね。

Markdown についてもう少しわかりやすく説明してくれているサイトはないものかと探していたところ、日本語 Markdown ユーザー会というサイトを見つけました。こちらも見てみましょう。

Markdown（マークダウン）は、文章の書き方です。デジタル文書を活用する方法として考案されました。

特徴は、

• 手軽に文章構造を明示できること
• 簡単で、覚えやすいこと
• 読み書きに特別なアプリを必要としないこと
• それでいて、対応アプリを使えば快適に読み書きできること

などです。Markdownはジョン・グルーバー（John Gruber）によって2004年に開発され、最初は Daring Fireball: Markdown で公開されました。その後、多くの開発者の手を経ながら発展してきました。

Markdownとは – 日本語 Markdown ユーザー会より引用

ここまでを簡単にまとめると、Markdown 記法は、「文章構造を手軽に明示できる、文章の書き方」という感じでしょうか。私が便利だな―と思っているのはこの点です。

文章中には段落、見出し、箇条書き、強調、引用といったものがありますが、こうした文章中における「構造」を明示することで読みやすく、理解しやすいものになります。特に Web において、文章構造が明示された HTML 文書は読み手(=人間)にとって理解しやすいものになるだけではなく、検索エンジン(=機械)にとっても理解しやすいものとなり、文章の意味に沿った処理や出力がしやすくなります。具体的には音声ブラウザや点字ブラウザなど、視覚以外の情報への適切な変換などがありますが、詳しくはクローラビリティとインデクサビリティの確保という記事を参考にしてください。HTML の代わりとして使える Markdown は、WordPress で記事を書く時にとても重宝します。

WordPress で Markdown を有効化する方法

WordPress で Markdown を使えるようにするには、Jetpack の設定画面で有効化をするだけです。有効化さえしておけば、Markdown で書いたものが記事更新時にはちゃんと HTML に変換されるようになります。念のため、設定方法を以下に載せておきます。もし Jetpack がインストールされていない・・・！という方は、是非インストールしてみることをオススメします。他にも便利な機能がたくさんありますよ。

1. Jetpack の[設定]をクリック

   

2. Markdown を有効化

   

はい、これであなたの WordPress で Markdown が使えるようになりました！簡単ですね。

Markdown の書き方

WordPress で Markdown が使えるようになったところで、実際に書いてみましょう。ということで、ここからは具体的な Markdown の書き方を紹介していきます。

<h1>見出し1</h1>
<h2>見出し2</h2>
<h3>見出し3</h3>

# 見出し1
## 見出し2
### 見出し3

箇条書きは – (ハイフン)を使う

<h1>欲しいものリスト</h1>
<ul>
  <li>技術</li>
  <li>お金</li>
  <li>時間</li>
</ul>

# 欲しいものリスト

- 技術
- お金
- 時間

HTML だとまずは ul でくくって、それから li でくくって・・・と面倒くさがりな私には少々辛いです。でも Markdown だと上記のように – を頭につければ OK です。ちなみに番号つきリストの場合は以下のようになります。例として私が好きな人達を順番に並べてみました。

<h1>好きなバンドランキング</h1>
<ol>
    <li>Talking Heads</li>
    <li>Cocteau Twins</li>
    <li>Belle and Sebastian</li>
    <li>Dirty Projectors</li>
    <li>The White Stripes</li>
</ol>

# 好きなバンドランキング

1. Talking Heads
2. Cocteau Twins
3. Belle and Sebastian
4. Dirty Projectors
5. The White Stripes

# リンク

(7F のサイト)[https://office7f.com]

# 引用

> 吾輩は猫である。名前はまだない。

# 強い重要性を表したい時(HTML だと strong タグですね)

これは**重要**です。

# 画像

![ここに alt 属性を入れます](ここに画像のソースを入力します)

便利なアプリやジェネレーター

最後に、Markdown 関連のアプリやジェネレーターを紹介して記事を締めくくりたいと思います。

MacDown

Markdown の記述に特化した、無料のアプリ(エディタ)です。ただし、残念ながら Mac のみの対応です。実際の画面はこんな感じです。

左側が編集画面、右側が出力時のプレビュー画面になります。もちろんリアルタイムで確認することができます。出力時のスタイルは、デフォルトでは GitHub 風になっており、シンプルで見やすいですね。設定で編集画面とプレビュー画面それぞれのスタイル(テーマ)を変えることもできます。

また、嬉しいことに HTML と pdf ファイルにエクスポートできる機能があります。ちなみに Markdown で書いた時のファイルの拡張子は .md となります。

ダウンロードはこちらから！MacDown The open source Markdown editor for OS X.

to-markdown

to-markdown は、HTML を Markdown に変換してくれるジェネレーターです。こちらもリアルタイムプレビューで確認することができます。