はてなブログで使用できるマークダウンまとめ
今日は、はてなブログで使用できるマークダウンをまとめます。
そもそも、マークダウンとは何なのか。
先達ブロガーさんや、パソコンに詳しい方は既にご存知かとは思いますが、
はてなブログでブログを記述する際の記法の一つですね。
Markdown（マークダウン）は、文書を記述するための軽量マークアップ言語のひとつである。本来はプレーンテキスト形式で手軽に書いた文書からHTMLを生成するために開発されたものである。
Wikipediaより抜粋です。
要するに、条件通りに記載をすると、このブログみたいに綺麗に整形されるということですね。
マークダウンの書き方
見出しの作成
一番使用するであろう、見出しの書き方は「#」です。
見出しは、はてなブログでは目次に使用できますね。
【書き方サンプル】
# 見出し1
## 見出し2
### 見出し3
#### 見出し4
##### 見出し5
###### 見出し6
【結果】
見出し1
見出し2
見出し3
見出し4
見出し5
見出し6
改行
マークダウンでは、改行の挙動が少し特殊になります。
ただの改行はスペース2個を文末に記述し、段落を作成する場合は1行空けます。
これは正直、実際に使用頂いた方が分かりやすいと思います。
【書き方サンプル】
改行←半角スペース2個
改行←次行が改行のため、半角スペース2個は不要
←1行改行
段落
【結果】
改行
改行
段落
リスト
リストは、「*」「+」「-」のいずれかで作成できます。
混在での記述も可能で、ネストも複数設定できます。
リストは、前後に空行が必要です。
【書き方サンプル】
* リスト1
* リスト2
* リスト3
* リスト4
* リスト5
+ リスト6
+ リスト7
+ リスト8
- リスト9
【結果】
- リスト1
- リスト2
- リスト3
- リスト4
- リスト5
- リスト4
- リスト3
- リスト2
- リスト6
- リスト7
- リスト8
- リスト9
番号付きリスト
段落付きリストは、「1.」の数字とドットで作成できます。
番号は自動的に採番され、ネストもタブで設定できます。
【書き方サンプル】
1. リスト1
1. リスト2←文頭にタブを入れることで、ネストを実現
1. リスト3
1. リスト4
1. リスト5
1. リスト6
1. リスト7
1. リスト8
1. リスト9
【結果】
- リスト1
- リスト2
- リスト3
- リスト4
- リスト5
- リスト4
- リスト3
- リスト2
- リスト6
- リスト7
- リスト8
- リスト9
テーブル
テーブルは、「|」「-」「:」を組み合わせて実現します。
まだまだ使い方を勉強中です。
テーブルについても、前後に空行が必要です。
【書き方サンプル】
|左揃え|中央揃え|右揃え|
|:--|:--:|--:|
|テスト1|テスト2|テスト3|
|テスト4|テスト5|テスト6|
|テスト7||テスト8|
|||テスト9|
【結果】
| 左揃え | 中央揃え | 右揃え |
|---|---|---|
| テスト1 | テスト2 | テスト3 |
| テスト4 | テスト5 | テスト6 |
| テスト7 | テスト8 | |
| テスト9 |
水平線
何かと多用してしまう、水平線です。
「*」もしくは「-」を3つ並べて記述します。
途中にブランクを入れることもできます。
【書き方サンプル】
***
* * *
---
- - -
【結果】
引用
引用は、「>」で実現します。
ネストも設定できます。
【書き方サンプル】
>テスト1
>>テスト2
【結果】
テスト1
テスト2
強調、斜体
強調と斜体は、「*」もしくは「_」の組み合わせで実現します。
1つで強調、2つで斜体、3つで強調と斜体の組み合わせになります。
【書き方サンプル】
**テスト1**
__テスト2__
*テスト3*
_テスト4_
***テスト5***
___テスト6___
【結果】
テスト1
テスト2
テスト3
テスト4
テスト5
テスト6
取消線
あまり実用性はないかもしれませんが、一応。
「~~」で取消線を実現できます。
書きたくないことも、これで書けるわけですね。
【書き方サンプル】
~~テスト1~~
【結果】
テスト1
コード
コードはバッククォートで実現しますが、あまり実用性はないかもです。
もっとも、この記事では多用しています。
書き方サンプルでは、分かりやすいようにわざと全角で記述しています。
【書き方サンプル】
‘# テスト1‘←このように、「#」を無効化できる
【結果】
# テスト1←このように、「#」を無効化できる
目次
これは、はてなブログ専用の記述ですね。
かなり便利です。
【書き方サンプル】
[:contents]
【結果】
今後使用したいマークダウン
ここまでに紹介した内容で、ほとんどのブログは記述できるかと思います。
私も使用しているものは、ここまでで全部記載していますし。
それ以外で使用したいものは、以下の2つです。
それを使いこなして、もっとブログを面白くしたいです。
画像タグ
まだ、添付できるような画像があまりないです…。
画像は事前にアップロードするため、タイトル名などを調整する必要があります。
さすがに、ブラウザから記述した方が簡単そうですね。
リンク
これも、今後どんどんリンクを設定したいものです…。
Markdownモードの設定
はてなブログでマークダウンにてブログを記述する際には、Markdownモードに設定して下さい。
「設定」→「編集モード」にて、Markdownモードを設定です。
マークダウンを記述するエディタ
マークダウンは、半角スペースを入力したりするため、ブラウザ上で書くのはなかなか大変です。
半角ブランクを表示できるエディタの使用をおすすめします。
私は、Visual Studio Codeを使用してブログを記述しています。
投稿時は、ブラウザに丸っとコピーするしかないのが、ちょっと残念なところですが。
ローカルで記載した元ネタは、dropboxでオンラインにバックアップを取れるようにしています。
これで、万が一の場合にも安心ですね。
今後の展開
せっかくなので、もっとマークダウンを書きやすい環境を整えたいと考えています。
ブログの質を上げることは勿論ですが、ブログを書きやすい環境というのも大切だと思います。
