さて

自分ははてなブログを書く時にMarkdown記法を使っている。これは単純にhtmlが使えないという理由からなのだが、Markdownのみでもそこそこ書けるので問題はない。Markdownの力の及ばない範囲、すなわち文字を大きくしたり色をつけたりするのははてなブログの記事編集画面で適宜行っている。

そこで本稿でははてなブログで自分が使っているMarkdown記法（＋はてなブログ記法）について、備忘録をかねてまとめてみたい。

ちなみにそもそもMarkdownとはなんぞや？については以下のサイトをご参照下さい。

Markdownとは · 日本語Markdownユーザー会

• 見出し記法（#）
• 改行（スペース x 2）
• 段落分け
• 強調記法（**）
• 引用(>)
• リスト（*または-）
• 数字つきリスト（1. ）
• 水平線
• 画像の埋め込み
  • 画像サイズの指定
• リンクの書き方
  • 埋め込み式
  • リンク先記事タイトルのみ表示
  • URLを表示
• 打ち消し線（~~）
• 表組み
• はてなブログ記法（？）
  • 続きを読む
  • 目次機能
  • 注釈機能
  • さいごに

見出し記法（#）

見出しタグは#で記す。#の個数により各タグを使い分ける。

#：h1大見出し
##：h2中見出し
###：h3小見出し
####：h4小見出し
#####：h5小見出し
######：h6小見出し

自分は基本h3見出ししか使わないのだけど、SEO的にはh2見出しを使うべきという記事をどこかで読んだな。

改行（スペース x 2）

半角スペースを2つ入れると改行になる。リターンキーを押すだけの改行だと、改行にならないので注意が必要。

段落分け

段落を分けたい時はリターンキーを2回押して、段落間に空白の1行を挟むようにする。

1段落目です⏎
⏎
2段落目です

↑のように書くと↓のように表示される。

1段落目です

2段落目です

強調記法（**）

文字列を強調したい時は、*（アスタリスク）で文字列を挟む。使うアスタリスクの数によって表示が変化する。

*イタリック*： イタリック
**ボールド**： ボールド
***イタリック&ボールド***： イタリック&ボールド

引用(>)

引用をしたい時は>のあとに引用したい内容を書く。

>見よ、この圧倒的な情報量を！

↑のように書くと↓のように表示される。

見よ、この圧倒的な情報量を！

リスト（*または-）

*（アスタリスク）の後に半角スペースを入れてその後に文字を入力すると箇条書き形式のリストを作成できる。*は-でも代用可能。

* リスト1
* リスト2
* リスト3

↑のように書くと↓のように表示される。

• リスト1
• リスト2
• リスト3

数字つきリスト（1. ）

1. リスト1
2. リスト2
3. リスト3

半角で、数字+.(ピリオド)+スペースを入れてその後に文字を入力すると数字付きのリストが作成できる。

水平線

記事の区切りなどの意味で水平線を入れたい時はいくつかやり方があるが、自分が愛用しているのはアスタリスクを3つ並べるやり方。

***

↑のように書くと↓のように表示される。

---

主に記事の最後、アマゾンアフィリンクとの境界線として使用している。

画像の埋め込み

外部サイトの画像を引用して表示したい場合は次のように書く。

![代替テキスト](画像のURL)

例：
![ロザムンド・パイ](http://cdn-ak.f.st-hatena.com/images/fotolife/i/iGCN/20150915/20150915104730.jpg)

↑のように書くと↓のように画像が表示される。

画像サイズの指定

埋め込みリンクで画像を表示させようという方は実際には少ないと思う。はてなブログの記事編集画面にある＋写真を投稿ボタンを利用して写真をアップする人がほとんどだろう。

ここで、写真のサイズを調整するやり方を紹介しておく*1。

写真をアップすると、次のような画像IDが表示される。
[f:id:iGCN:20160213233804p:plain]

最後の"plain"のあとに、:w300と追記する事で画像の幅を設定できる。wの後の数字が画像の幅になる。

例：
[f:id:iGCN:20160213233804p:plain:w300]＞幅300

[f:id:iGCN:20160213233804p:plain:w100]＞幅100

リンクの書き方

[リンクテキスト](リンク先のURL)

例：
[あほー](http://www.yahoo.co.jp)

↑のように書くと↓のように表示される。

あほー

ここからははてなブログ記法になるけれども、はてなブログにおけるリンクの貼り方は3種類ある

埋め込み式

[リンク先のURL:embed:cite]

例：
[http://www.yahoo.co.jp:embed:cite]

↑のように書くと↓のように表示される。

www.yahoo.co.jp

埋め込み式は、リンク先によってはうまく表示されない事があるのでプレビュー画面で確かめた方が良い。

リンク先記事タイトルのみ表示

[リンク先のURL:title]

例：
[http://www.yahoo.co.jp:title]

↑のように書くと↓のように表示される。

Yahoo! JAPAN

URLを表示

[リンク先のURL]

例：
[http://www.yahoo.co.jp]

↑のように書くと↓のように表示される。

http://www.yahoo.co.jp

打ち消し線（~~）

打ち消し線は~~で文字列を挟むことで表現できる。

例：
~~おまえのかーちゃんでべそ！~~

↑のように書くと↓のように表示される。

おまえのかーちゃんでべそ！

表組み

表組みは使用頻度は低いのだが、使えると何となくカッコイイので紹介しておく。

|左寄せ|中央寄せ|右寄せ|
|:-|:-:|-:|
|左|真ん中|右|
|○|△|□|

↑のように書くと↓のように表示される。

左寄せ	中央寄せ	右寄せ
左	真ん中	右
○	△	□

2行目のスマイルマークのような部分で左寄せや右寄せの設定をしている。表の行列数はもちろん拡張可能。

---

はてなブログ記法（？）

続いて紹介していくのはMarkdown記法ではないが、はてなブログで記事を書く際によく使う機能（はてなブログ記法？）。

続きを読む

「続きを読む」は次のように書く。

<!-- more -->

自分は使っているIME（ちなみにかわせみを愛用している）の単語登録機能で「つづき」と打つと<!-- more -->に変換されるようにしている。

目次機能

目次は次のように書く。

[:contents]

冒頭のほうで紹介した見出しタグを自動で認識して見出しを作成してくれる優れものである。これも同じく単語登録機能で「もくじ」と打つと[:contents]に変換されるように設定している。

注釈機能

はてなブログでは学術論文のように注釈を挿入する事ができる。半角カッコ二つで注釈内容を囲んで書く事で、文末に注釈が挿入される*2。

例：
((注釈内容を書く。))

↑のように書くと↓のように表示される。

*3

さいごに

Markdownは慣れてしまえば簡単なので、是非利用していただけるとよいと思う。

こちらからは以上です。

明日はMacで使えるMarkdownエディタを紹介する予定。

では

（この記事は土屋さんのブログ記事に刺激されて酩酊した頭を絞って3時間を費やして書かれた）

---