はてなブログの目次記法とid記法

　え、こんなのあったんだ。知らんかった。

きっかけ

　はてなブログ開発ブログにて気になるお知らせがあった。

• はてなのワクチン情報統制？　正しい情報とは一体
  • はてなブログでは標準的な医療情報と異なる見解が含まれたブログに警告を掲載することがあります

　このとき以下の情報をみつけた。

情報源

• 目次を入力補助ツールバーから挿入できるようにするなど、はてな記法を便利に使えるようにしました（2件）

　なにそれ、そんなのあったの？　今まで気づかなかった！

涙ぐましい苦労

　だから私はかつて以下のようなものを自作したというのに！　あの苦労は一体。まあ、使ってないんだけど。

• Bashスクリプト　キーワードからMarkdownのアンカーリストを作成する
• キーワードリストとテンプレートからMarkdownのアンカーを生成する
• キーワードリストとテンプレートからMarkdownのアンカー＋pre＋codeコードを生成する
• キーワードリストからMarkdownのアンカーコードを生成する

もう間違えないために

　はてな記法一覧を調べてみた。まだ知らないものがあるかもしれないし。

　google記法、wikipedia記法あたりは使うかもしれない。でもふつうにリンクを貼ればいいだけのような気もする。

目次記法

[:contents]

　これで見出しをリンク化できる。

　でも、以下のように目次を見出しにしちゃったら、目次自体も項目に出ちゃう。

# 目次

[:contents]

　この記事で書いてみたら以下のようになった。

id記法

id:ytyaru
id:ytyaru:detail
id:ytyaru:detail:large
id:ytyaru:image

ID記法	結果
id:ytyaru	id:ytyaru
id:ytyaru:detail	id:ytyaru
id:ytyaru:detail:large	id:ytyaru
id:ytyaru:image

　ちなみにリンクは http://blog.hatena.ne.jp/ytyaru/ だった。ようするに自分のブログへのリンク。

IDコール

　あと、他人のはてなID記法を使ったらその人へ「あなたへのお知らせ」に通知されるらしい。これを「IDコール」と呼ぶのだとか。

　まあ、ぼっちの私には関係ないかな。

もっといい感じにしたい

　どうでもいいけどid:っていらなくない？　あと私ならtitle属性にはてなIDをセットする。そうすればマウスオーバーではてなIDがポップアップされるはず。まあスマホでは見えなくなっちゃうけど。それにURLはブログでなくプロフィールページに飛ばしたい。そのほうがユーザーを指定したっぽい感じだし。というわけで、HTMLで書いてみよう。

　プロフィール画像取得URLは以下を参考にした。

• プロフィール画像

<a href="https://profile.hatena.ne.jp/ytyaru/"><img src="https://cdn.profile-image.st-hatena.com/users/ytyaru/profile.png"></img><span>ytyaru</span></a>

　私はytyaruです。

　うーん、IDは画像の上か下に表示したい。

<a href="https://profile.hatena.ne.jp/ytyaru/"><div><img style="display:block;" src="https://cdn.profile-image.st-hatena.com/users/ytyaru/profile.png"></img><span style="display:block;">ytyaru</span></div></a>

　私は

ytyaru

です。

　ブロック要素になってしまった。改行されないインライン要素のまま、画像と名前を縦に表示したかったのだが。それはできないらしい。

　<br>で改行するとさらに残念なことになった。

　私は
ytyaru