【WordPress】Markdown(マークダウン)記法を使うためにJetpackの設定と記述例

  • URLをコピーしました!

皆さん、こんにちは(こんばんは)、「大-はなまる(@oooohanamaru)」です。

目次

はじめに

長らく「PHP」+「HTML」+「CSS」+「Javascript」の組み合わせで沢山のウェブアプリケーションを作成してきました。膨大な量のコードの山が積み重なってゆき、積み重なったが崩れ押しつぶされそうになること幾重にも。それでも「Markdown(マークダウン)「※以下、Markdown」」で記述することに抵抗がありました。、。。。これも世の中の流れかと、プラグインの導入・設定、マークダウン記述でWordPressの記事を書くことを挑戦することにしました。もちろんこの記事もMarkdownで書いております。 ## Markdown(マークダウン)記法とは > Markdown(マークダウン)は、文書を記述するための軽量マークアップ言語のひとつである。本来はプレーンテキスト形式で手軽に書いた文書からHTMLを生成するために開発されたものである。しかし、現在ではHTMLのほかパワーポイント形式やLATEX形式のファイルへ変換するソフトウェア(コンバータ)も開発されている。各コンバータの開発者によって多様な拡張が施されるため、各種の方言が存在する。

引用元:Markdown – Wikipedia より抜粋

作業概要

WordPressと言えば「Jetpack」と言うほど、プラグイン追加ページでも「注目」のプラグインですね。ただコレをインストールして、一箇所設定するだけです。

Markdown系プラグインがあれば、停止しておく

わたしの場合は、「Jetpack」の「Markdown」を使うまでに、「Markdown Editor」や「WP Githuber MD」を入れていて、表示や動作の衝突があったようでしたので、停止しました。

Jetpack の設定

STEP

WordPress管理画面の左サイドにある「JetPack」をクリック

STEP

My JetPackのメニューから、「設定」をクリック

STEP

右コンテンツ上部タブ「執筆」をクリック

STEP

「作成」欄の中にある「プレーンテキストのMarkDown 構文で投稿やページに書き込み」をON

これで、WordPressの「ビジュアル」エディタで「Markdown」が使える状態になっています。

主なMarkdown記法例

「見出し」のコード例

見出し文字の前に「#」記号+スペース1個をつけます。見出しの深さの分だけ「#」をつけます。

コード

[PreTitle val="記述例"]
# 見出し1
## 見出し2
### 見出し3
#### 見出し4
##### 見出し5
###### 見出し6

表示内容

見出し1

見出し2

見出し3

見出し4

見出し5

見出し6

「斜体」のコード例

文字列の前後に「*アスタリスク*」を1つずつ付けます。

コード

[PreTitle val=記述例]
*この文字列が斜体になります*

表示内容

この文字列が斜体になります

「太字」のコード例

文字列の前後に「**アスタリスク**」を2つずつ付けます。

コード

[PreTitle val=記述例]
**この文字列が太字になります**

表示内容

この文字列が太字になります

「斜体+太字」のコード例

文字列の前後に「***アスタリスク***」を2つずつ付けます。

コード

[PreTitle val=記述例]
***この文字列が斜体+太字になります***

表示内容

この文字列が斜体+太字になります

「引用」のコード例

文字列の前に「>」を付けます。

コード

> この文字列が引用になります。

表示内容

この文字列が引用になります

おわりに

簡単なインストールと設定だけで、Markdown記法での記事の編集ができるようになりました。お試し感覚で、Markdown記法の練習をしてみるのもいいと思います。Markdown記法での記述には慣れが必要かもしれませんが、手応えは良かったです。たしかに、HTMLタグの記述で時間がかかっていた部分がスピードアップされてきました。これで記事を量産できそうです。

この記事がお役に立ちましたら幸いです。

では、また。

※本サイトの漫画やイラストはフィクションであり、実在の製品・団体・人物・地名とは関係ありません。
※本サイトに掲載する情報には充分に注意を払っておりますが、その内容について保証するものではありません。
※本サイトの使用ならびに閲覧によって生じたいかなる損害にも責任を負いかねます。

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次