はてなブログ 注釈（脚注）の付け方が超簡単だったのでサクっと解説

スキッティ出た、いらん、どうもナカニシ（@tssb26）です。

本読んでるとよくみかける脚注、※マーク付けてその部分を後で説明入れるやつ

たまにはてなブログでも見かけて、これどうやるんやろう、と思ってましたが方法はめちゃ簡単でした

頻繁に使う機能ではなさそうですが、フリガナ、難しい言葉、英単語、短い説明など、知っているとなにかと便利かも

ということで、はてなブログで注釈（脚注）の付け方を簡単に説明していきます

注釈、註釈、脚注とは？

注釈（註釈、ちゅうしゃく）とは

既述の文章や専門用語についての補足・説明・解説のこと。
補注（補註、ほちゅう）とも、単に注（註、ちゅう）ともいう。
※（米印）や・（中黒）、あるいは「注」や「註」の文字に続けて書かれる。

書物においては、注釈は可読性を考慮して本文と同じ頁の下部に置かれることもあるほか、すべてをまとめて巻末に置くこともある。
この場合、前者を脚注、後者を後注（または尾注）という。
ただし今日ではすべての注釈や補注に「脚注」の語をあてる用法が増えている

引用元：注釈 - Wikipedia

YouTubeに動画アップされている方なら「アノテーション」という言葉ご存知かと思いますが、あるデータに対して関連する情報（メタデータ）を注釈として付与する、それと同じ意味

それでは実際に注釈を付けてみましょう

注釈（脚注）の付け方

切実なサンプル文章、この「Switch」に注釈を付けていきます

編集モードは「見たままモード」で大丈夫です

まず「Switch」の後ろに、注釈で入れたい文章を打ち込みます
できれば注釈前後に半角スペースなんか入れるとわかりやすいかもです

こんな感じ

で、注釈になる部分を選択して「脚注ツールアイコン」をクリックします

すると、注釈になる部分は二重カッコで囲まれたと思います

これだけです、たったこれだけで記事中の二重カッコで囲まれた文章は、記事の最後に注釈として移動されまとめて表示されます

プレビューしてみるとこんな感じ

ね、簡単でしょ

文中の数字の付いた注釈リンクをクリックすると記事下の注釈までジャンプしますし、逆に記事下の注釈リンクは元記事の位置まで戻ります

あと、注釈リンクにカーソルを合わせると↓こんな風にその場で注釈を見ることもできます

複数の注釈（脚注）は勝手に連番になる

もちろん、注釈はいくつも付けられます
その場合、先頭から順番に連番が振られることになります

これを表示するとこんな感じ

二重カッコ直打ち

わざわざ文章選択して脚注スイッチ押して、みたいなことしなくても
注釈にしたい部分を二重カッコで囲めばいいんです

直接二重カッコを打ち込んだ方が早いですね

また、三重以上のカッコは注釈にはなりません
二重カッコを表示したい場合は逆カッコを一つ付けます

こんな感じ

表示するとこうです

注釈欄がみにくい

この注釈なんですけど、記事下にまとめられるのはいいんですが
そのままだとバックになんにも色が付いてませんので、文章と見分けが付かず見難いんですよね

そこで、classが付いているようですので、ちょっとCSSをいじってこーしました

枠付けると文章と同化せずはっきりしますね

こちらの記事を参考にさせていただきました
CSSのいじり方も書いてらっしゃいますので参考になさってください

affiliate-hatekun.hatenablog.com

最後に

いかがでしたか、あんまり使う機能ではなさそうですが、知っていると便利です

一応、記事と注釈がジャンプで戻るようにはなってますが、あまり多用すると読み辛いかもですね

ただ、使いようによっては暗号みたいな面白いこともできそう

あわせて読みたい関連記事

・ コピペで超簡単 はてなブログ 記事内の画像に枠線を付ける方法

・ はてなブログ デフォルトでリンクを別窓で表示させる方法

今回は注釈の付け方について書かせていただきました

いろいろ勉強していくうちになんかMarkdown記法がなにかと便利なんちゃうかなと思いつつ勉強しようかどうしようか本買ったほうがいいのか迷ってる2017年夏

はじめてのMarkdown 軽量マークアップ言語の記法と使い方 （I／O　books） [ 清水美樹 ]