Markdown記法についてメモ１
数式をブログ中記入したいと思ってた矢先、どうも入れ方がわからないと思ってググった時のメモ。
今までブログ編集モードを「見たままモード」で書いていたのだけど、それだとどうも入れられないらしく、しかも後から設定画面から変更しないといけないと来たから困ったもんだ。最初にそれのせいで後悔している先人様を見つけたので参考まで。 subcul-girl.com
どうやら「はてな記法」か「Markdown記法」が良いらしいが、「はてな記法」ははてブ限定の記法なのだろう。「Markdown記法」は見たところ
など使える範囲が広そう。なのでこっちを採用して行くことにしよう。わざわざはてなブログ特化で慣れてもなって感じなので。とりあえずこれで数式入れられるようになるだろう。ちなみにこの人の記事見たところEvernoteとかと連携ができるっぽい。Onenoteとかも出来んのかなあ、、できると嬉しいんだけど。
そんでもってMarkdown記法の簡単な使い方記事見つけたので掲載。 www.asobou.co.jp
改行と段落
改行は行末で半角スペース2つ分、改行は１行分開ける。という事で試しに改行してみる。
あ
い
う
あ い う
見出し
「#」が一つでh1タグ、「##」が2つでh2タグとなり6つまで記述できます。
またh1とh2だけ別の記述方法があり文章の改行後に「=」を2つ以上記述するとh1に改行後に「-」を2つ以上記述するとh2になります。
とのこと。ということで試してみる。
h1
h2
h3
h4
h5
h6
#h7(h6になった#7と表示される）
引用
先頭に「>」と半角スペースを入力すると引用になります。入れ子にすることも可能です。
ということでこれもやってみる。 俺は猿だ。 嘘だ。誰がそんなこと言ったのか
君だよ。
I cannot understand what you said.
はい。
一度入れ子にすると次に「>」を一個にしても効かないようだ。
あと改行じゃなくて１行開けないと引用は終わらないみたい。
水平線
「-」、「_」、「*」を3つ以上並べることで水平線を表示します。
ということで実践。
あああああ-----
おうおうおう*******
huhu
aaaa
これらの文字は１行に同じ文字だけ並べないとうまくいかないようだ。
リンク
「リンク文字列」でリンクに変換されます。
URLを表示するだけなら
[https://mirpy.hatenablog.com]
のような感じで良い。
https://mirpy.hatenablog.com
URLの文字列の代わりにタイトルを表示させたい場合は
[https://mirpy.hatenablog.com:title]
とすればOK。
ぜろといち
サイトに埋め込みたい場合は
[https://mirpy.hatenablog.com:embed:cite]
と書けばOK。
mirpy.hatenablog.com
なんて事をしなくてもリンク貼ればはてなブログ側で勝手にやってくれるけど、Markdown記法中になんだか分かってないよりは分かっていた方が良いだろう。
画像
で画像が表示されます。
という事でいらすとやの素材を元にやってみる。
まずはそのままリンク貼り付けたもの
[https://2.bp.blogspot.com/-Vo_Zg1TcAz8/V5NDnu2l8WI/AAAAAAAA8dQ/bVr8Ybi7k9oSX8MH0Af9Kvv5MzW-ccwJQCLcB/s500/ai_pet_family.png]
https://2.bp.blogspot.com/-Vo_Zg1TcAz8/V5NDnu2l8WI/AAAAAAAA8dQ/bVr8Ybi7k9oSX8MH0Af9Kvv5MzW-ccwJQCLcB/s500/ai_pet_family.png
URLがそのまま表示されて、クリックすれば画像が表示される仕組みだ。
次に画像を埋め込んだ（？）もの
[https://2.bp.blogspot.com/-Vo_Zg1TcAz8/V5NDnu2l8WI/AAAAAAAA8dQ/bVr8Ybi7k9oSX8MH0Af9Kvv5MzW-ccwJQCLcB/s500/ai_pet_family.png:image=https://2.bp.blogspot.com/-Vo_Zg1TcAz8/V5NDnu2l8WI/AAAAAAAA8dQ/bVr8Ybi7k9oSX8MH0Af9Kvv5MzW-ccwJQCLcB/s500/ai_pet_family.png]
URLの終わりに
:image=https://2.bp.blogspot.com/-Vo_Zg1TcAz8/V5NDnu2l8WI/AAAAAAAA8dQ/bVr8Ybi7k9oSX8MH0Af9Kvv5MzW-ccwJQCLcB/s500/ai_pet_family.png
と書かれいる。つまり:image=の後ろに全く同じURLが来るという形になっていることがわかる。
ただ上記のものだとalt属性がついていないので、引用のものと同じように記述すると
カーソルを合わせたり、画像が表示されてないときじゃなければ:image=と見た目は変わらない。
ソースコード
1行だけの場合はバッククォートで囲みます。
複数行の場合は先頭にスペースを4つ入れます。
利用しているエディタによりますが、プログラミング言語ごとのシンタックスハイライトに対応している場合は 「```言語名」と「```」でソースコードを囲むとハイライトされます。
すでに上で結構使っているから良いだろうこれは。
それよりもMarkdown 記法の文字をエスケープするときは直前にバックスラッシュ\を入れることを知っている方が大事か。
例えば```のエスケープは\`\`\` とかく。
バックスラッシュ自体は２本同時に書いて\\のように記述する。
強調
強調したい文字を「*」で囲むとemタグとなり強調になります。 より強い強調は「**」でstrongタグになります。
これも試してみる。
俺は強い。でもあいつの方がもっと強い。
一個だけの場合は斜体になるみたい。
リスト
ハイフン、プラス、アスタリスクのいずれかと半角スペースで箇条書きリストになります。
- リスト1
- ネスト リスト1_1
- ネスト リスト1_1_1
- ネスト リスト1_1_2
- ネスト リスト1_2
- ネスト リスト1_1
- リスト2
リスト3
番号付きリスト1
- 番号付きリスト1_1
- 番号付きリスト1_2
- 番号付きリスト2
- 番号付きリスト3
なんか考えるのめんどくさくなったからリストは後で良いや。
数式結局扱ってなかったけどひとまずここまで。
