WordPressでMarkdownを活用！初心者が簡単に始める使い方徹底解説

WordPressにMarkdownを導入すると、エディタがシンプルなテキストであることに加えて、公開までのプロセスが高速化されます。リッチテキストでの編集が煩雑に感じる初心者でも、キーボードだけでコンテンツを作成できる点が魅力です。本記事では、WordPress本体にMarkdown機能を追加し、実際に使い始めるまでの手順をわかりやすく紹介します。

なぜMarkdownをWordPressで使うのか
WordPressをMarkdownで執筆する前提環境
1. Markdownプラグインをインストールする
1. 1-1. WP Markdown Editorを使う手順
2. 1-2. Jetpackを使う場合
2. Classic EditorでMarkdownを使う方法
1. 2-1. Classic Editor画面設定
2. 2-2. 実際のMarkdown記法
3. Gutenberg（ブロックエディタ）でMarkdownを使う
1. 3-1. GutenbergブロックでMarkdown入力
2. 3-2. GutenbergでMarkdownをサポートするプラグイン
4. Markdownで便利な拡張機能を活用
5. Markdownの書き方のベストプラクティス
6. よくあるトラブルと解決策
7. Markdownで他プラットフォームへ移行する際の注意点
8. さらに進んだ使い方：Markdown + Gutenberg + REST API
9. まとめ

なぜMarkdownをWordPressで使うのか

軽量・高速 – Markdownはシンプルなテキストフォーマットで、HTMLに変換するだけでWeb表示が可能。編集時のリソースを最小限に抑えます。
可搬性 – Markdownで書かれた記事は、他のブログプラットフォームやテキストエディタでそのまま再利用できます。
学習コストが低い – 数行の記法（例: # 見出し）を覚えるだけで、直感的に書けます。
開発者フレンドリー – 既存のHTMLやCSSに手を加えずに、マークアップがそのまま残るため、デバッグやカスタマイズも楽。

WordPressをMarkdownで執筆する前提環境

WordPressサイト – ベータ版でも構いません。
管理者権限 – プラグインをインストール・有効化できる権限。
最新PHP/テーマ – 互換性を確保するため、WordPress本体、PHP、テーマは最新版にしておきましょう。

1. Markdownプラグインをインストールする

WordPressには公式にMarkdownサポートを追加するプラグインがいくつかあります。ここでは代表的な2つを紹介します。

プラグイン	機能	特色
WP Markdown Editor (旧Gutenberg)	公式GutenbergブロックがMarkdown化	WordPress公式がサポート、定期的に更新
Jetpack	Markdown対応が含まれるマルチ機能プラグイン	サイト統合機能もある

1-1. WP Markdown Editorを使う手順

管理画面 > プラグイン > 新規追加
検索ボックスで「WP Markdown Editor」と入力
「今すぐインストール」をクリックし、有効化

※WP Markdown Editorは「Classic Editor」とも併用可能です。
設定 → 「WP Markdown Editor」を開く
- 「Markdownを有効にする」チェックボックスにチェック
- 必要に応じて「エディタ設定」でシンタックスハイライトやテーブルなどの拡張機能を有効化

1-2. Jetpackを使う場合

Jetpack をインストール・有効化
Jetpack > 設定 > 進んだ に移動
「Markdown」を「有効」に設定
保存すると、投稿/ページ作成時にMarkdownが有効になります

注意
Jetpackは他の多機能を持つので、サイトの速度や機能追加に伴う管理の手間が増える可能性があります。
WP Markdown Editorは専用機能に絞っているので、軽量でOKです。

2. Classic EditorでMarkdownを使う方法

2-1. Classic Editor画面設定

投稿や固定ページを作成
右上の「表示オプション（Screen Options）」で 「Markdown」チェックボックス をオンにします。
これで Classic Editor の上部に “Markdown” と表示されるタブ（か、入力エリアの上に“Markdown”のラジオボタン）が出現します。

2-2. 実際のMarkdown記法

Markdown	例	HTMLに変換される結果
見出し	`## 見出し2`	`<h2>見出し2</h2>`
強調	`太字`	`<em>太字</em>`
リスト	`- アイテム1\n- アイテム2`	`<ul><li>アイテム1</li><li>アイテム2</li></ul>`
画像	`![alt テキスト](https://example.com/img.png)`	`<img src="...">`
コード	`コード`	`<code>コード</code>`
テーブル（拡張）	`	見出し

Tip
事前にブログの「外観 > カスタマイズ > テーマエディタ」から functions.php で add_filter('markdown_supported_elements', 'my_markdown_elements') にカスタムタグや属性を追加できるので、独自拡張も可能です。

3. Gutenberg（ブロックエディタ）でMarkdownを使う

3-1. GutenbergブロックでMarkdown入力

新規投稿で「ブロックを追加」+ ボタンを押す
「テキスト」ブロックを選択（デフォルトは「段落」）
左側の「ブロック設定」で “Markdown” もしくは “コード” タグを選択（プラグインにより表示される）
入力エリアにMarkdownを書き込むと、自動でHTMLへ変換されます。

Tip
「コーディング」ブロックと比べてMarkdownで書くと「視覚的に」HTMLはレンダリングされず、シンプルなテキストエリアに留まります。記事の最初に「プレビュー」ボタンを押して、実際の表示を確認しましょう。

3-2. GutenbergでMarkdownをサポートするプラグイン

WP Markdown Editor (Gutenberg) – Gutenbergブロック内でMarkdownを直接利用できるようにラップ
Easy Markdown – Gutenbergを使用せずとも、ブロック単位でMarkdown変換を自動化
プラグインの選択は個別サイトの運用方針に合わせて決めると良いでしょう。

4. Markdownで便利な拡張機能を活用

Markdownは本来の仕様ではテーブルやフロート画像がサポート外です。プラグインで拡張機能が提供されているので、これを利用しましょう。

4-1. シンタックスハイライト（コードブロック）

WP Markdown Editor では Prism.js が組み込まれています。

コードブロックを作るには

```js  
console.log('Hello World');

こうするだけでハイライト表示されます。

4-2. マークダウンでのテーブル作成

ヘッド	カラム1	カラム2
データ1	データ2	データ3
データ4	データ5	データ6

注意
WordPress 5.9 以降の Gutenberg では「表」ブロックでもテーブルを作成できるので、Markdown表は必要ないケースもあります。

4-3. マークダウンでの埋め込み（短縮コード）

Jetpack の「Embed」機能を使って、YouTube や Twitter などを埋め込む際は
```
  
```

5. Markdownの書き方のベストプラクティス

項目	ヒント
一貫性	同じレベルのヘッダーは同じ数の `#` を使う。
可読性	空行でブロックを分離し、コードはインデントで可読性を保つ。
画像のaltテキスト	SEOとアクセシビリティの観点から必須。
リンクテキスト	「ここをクリック」ではなく、具体的な説明を。
コメント	マークダウン本体に不要なスペースや改行を追加しない。

Tip
テーマに応じて CSS をカスタマイズすることで、Markdownから生成されるタグのデザインを調整できます。
例: h2 { margin-top: 1.5em; } など。

6. よくあるトラブルと解決策

“Markdown”タブが表示されない
- プラグインが有効か確認。Classic Editor の「表示オプション」にチェックが入っているか。
コンテンツが正しく変換されない（例: コードハイライトが効かない）
- プラグインの設定で「シンタックスハイライト」を有効に。テーマのスタイルシートで pre, code のデフォルトスタイルが上書きされていないか確認。
画像パスが壊れる
- マークダウンで相対パスを使用する場合、投稿のURLに依存します。絶対パス（https://example.com/wp-content/uploads/...）を使うか、[image ここ] のようにメディアライブラリから挿入する方法をおすすめ。
短縮コードがMarkdownで機能しない
- プラグインによっては「shortcode」ブロックを別途選択する必要があります。Gutenberg では「Shortcode」ブロックを挿入してからマークダウンを入力。

7. Markdownで他プラットフォームへ移行する際の注意点

事象	ポイント
別ブログへコピー	ほとんどのブログサービスがMarkdownをサポート。テキストエディタでそのまま貼り付け、必要に応じてリンク修正。
静的サイト生成	Hugo、Jekyll、Gatsby などはMarkdownを直接扱うので、WordPress で作成した記事をエクスポートして活用。
バージョン管理	Markdownはテキストなので Git で差分管理が容易。記事を書き込んだフォルダを `git init` してバージョン管理する手法もあります。

8. さらに進んだ使い方：Markdown + Gutenberg + REST API

REST API を使えば、外部アプリから投稿を作成できます。

curl -X POST https://example.com/wp-json/wp/v2/posts \
     -u "ユーザー名:パスワード" \
     -d '{
           "title": "APIで投稿する",
           "content": "# はじめに\nここはMarkdownで書かれています。",
           "status": "publish"
         }'

これにより、Markdownをエディタで書き、API経由で即時公開が可能です。
自動化スクリプト（Python、Node.js など）を組むと、ブログ更新のワークフローが大幅に効率化します。

9. まとめ

WordPressでMarkdownを活用すれば、コンテンツの作成・保守・移行がシンプルに。

プラグインを揃える
Classic Editor または Gutenberg で Markdown を有効化
記法を学び、必要に応じて拡張機能を導入
書き方のベストプラクティスを守り、トラブルを最小化

初心者でもすぐに取り掛かれますが、慣れてくるとより高度なカスタマイズや自動化が可能に。ぜひ自分のワークフローに合わせて、Markdown のメリットを最大限に引き出してください。