【ワードプレス】マークダウン記法でブログを書く方法

【ワードプレス】マークダウン記法でブログを書く方法

どうも、ぽっぽです。

ワードプレスにはビジュアルエディターがあります。
ビジュアルエディターで記述すると、ブロックの追加で見出しや段落、箇条書きなどをマウスで操作して書き始める事になると思います。

慣れないうちはとても直感的で便利なのですが、慣れてくるとブロックを操作する手間が面倒に思うようになってきました。

ブログを書く場合、レイアウトをあれこれ考えたり、章立てをどうしようか検討したりします。もっと手軽に操作出来ないものでしょうか。

そこで一つの解決方法として、マークダウン記法をご紹介します。

マークダウンとは

マークダウンとはプレーンテキストで見出しや箇条書きなどを記号で表現し、見栄えのするHTMLに変換出来るフォーマットのことです。

プレーンテキストなので、特別なエディターは不要です。いきなり書き始める事ができます。

素早く書ける

メモレベルで章立て、箇条書きなどが出来るので、例えば見出しを書くときにエディタでいちいち見出しを選ぶといった操作が省略されます。

実際やってみると分かりますが、箇条書きもストレスなく記述出来ます。箇条書きのレベルを変更する場合も「Tab」キーで操作出来ます。

例えば議事録を作成する場合、会議中とりあえず素早くメモを取るシーンで、話題の転換で見出しを入れたりや決定事項を箇条書きにしたり、記号でとりあえず記述します。

会議が終わってから、改めてメモから章立てなどのレイアウト変更を行い、議事録を素早く清書する事ができるようになります。

よく使うマークダウンの記法例

僕がよく使う記法です。ざっとこれくらいの記法ルールを知っているとある程度レイアウトを含めた記事を作成出来るようになります。

見出し

先頭に「H + 半角スペース」Hの数で見出しの種類が変わる
# 見出し(H1)
## 見出し(H2)
### 見出し(H3)
#### 見出し(H4)

箇条書き

先頭に「* + 半角スペース」
* りんご
* みかん
* バナナ

先頭に「1. + 半角スペース」数値は変換時に順番に振り直されるので1を使えばば良い
1. 読書
1. 掃除
1. 選択

強調

強調したいキーワードの前後に「**」
僕は**たこ焼き**が好き。

引用

先頭に「> + 半角スペース」
> マークダウン記法について
> プレーンテキストで表現出来ます

リンク

[]で表示する文字列を記述し、()にリンク先のURLを記述
僕のブログは[こちら](https://hatpoppo.com)からジャンプ出来ます

コード

「```」をコードの前後に記述
 ```
 if (a < b){
    return  0;
  }
  retun 1;
 ```

マークダウンエディタの利用

プレーンテキストで記述出来るためメモの内容は記号と文字列です。見栄えのするHTMLに変換した結果がどのように実際見えるかを確認出来たほうが便利です。

アプリケーションとしてマークダウンを扱えるものがフリーでダウンロードすることが出来ます。

僕が利用しているのは、アプリケーションではなく、ネットのサービスです。

https://hackmd.io/

これはブラウザさえあれば利用出来るので、アプリケーションのインストール作業が不要です。

「Try it out」をクリックすると、左が記述エリア、右が記述した結果をHTMLに変換してブラウザに表示したエリアです。

表示したURLのメモをとっておき、別の端末(スマホやパソコン)でそのURLでアクセスすると編集をすること出来ます。

複数の人と協業作業をすることも出来ます。

アカウントを取得すると、編集者を限定したり、公開・非公開を設定できたりするようですが、僕は普段サインインせずに利用しています。

ワードプレスでマークダウンを利用するには

まずプラグインが存在するようです。プラグインは必要な機能に限定するのが一般的なようなので、他の手段を検討しました。

僕が利用しているワードプレスのバージョン(5.5.2)ではグーテンベルクというビジュアルエディターが利用できます。

このエディターは標準でマークダウン記法に対応出来ていました。

利用の仕方は、マークダウン記法で書いた文章をコピーして、エディターに貼り付ける、たったそれだけです。

最後に

マークダウン記法を覚えておくと、エディターなどで見出しや箇条書きのブロックを選択する操作が省かれて素早く記事が書けます。

ワードプレスの標準エディターに、マークダウン記法のテキストを貼り付けることで、HTMLに変換されてビジュアルエディターで操作した見栄えになります。

HackMDで下書きをして、ワードプレスにコピペが僕の記事の書き方でした。

参考になってもらえると嬉しいです。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

先頭に戻る