え、こんなのあったんだ。知らんかった。
きっかけ
はてなブログ開発ブログにて気になるお知らせがあった。
このとき以下の情報をみつけた。
情報源
なにそれ、そんなのあったの? 今まで気づかなかった!
涙ぐましい苦労
だから私はかつて以下のようなものを自作したというのに! あの苦労は一体。まあ、使ってないんだけど。
- 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>
私は
ブロック要素になってしまった。改行されないインライン要素のまま、画像と名前を縦に表示したかったのだが。それはできないらしい。
<br>
で改行するとさらに残念なことになった。
私は
ytyaru