株式投資を淡々と続けるブログ

株の配当と株主優待で老後に備えます。IPO、投資信託なども。

はてなブログのカテゴリーを階層化してみた

こんばんわ。はやひで@淡々ブログです。

はてなブログを始めて、4ヶ月半ほど経ちました。
そうすると、改善したい点なども出てきます。

例えば、「カテゴリー」がありますが、記事が増えてくるにつれ、カテゴリーから過去に書いた記事を探すのが難しくなってきました。
「株主優待」のカテゴリーでいうと、現時点(2018/9/22)で34記事あります。
このまま株主優待の記事を書き続けたら、カテゴリーの中から優待記事を探すのにも一苦労かと。

そこで、このカテゴリーって階層化出来ないのかな?と思い調べると、やはりありました!

カテゴリーを階層化する方法

はてなブログのデフォルトの機能では、カテゴリーの階層化の機能はないようです。
そのため、WorldWorldWorldさんという方が作成されたようです。

blog.wackwack.net

とりあえず、ここに書かれている通りに設定すると、簡単にできました!
このような感じです。

「優待めし」と「株主優待」のカテゴリーにサブカテゴリーが出来ました。

とても見やすくなりました。満足!

パンくずリストもこのようになりました。

今までは・・

  • トップ > 株主優待 > オリックスの優待

階層化すると("株主優待"の下に"カタログ"のサブカテゴリーを追加)・・

  • トップ > 株主優待 > カタログ > オリックスの優待

ちゃんと階層化されています。

具体的には、はてなブログのカテゴリーに、「株主優待 」「株主優待-カタログ 」と設定します。

これ、記事が多くなると、全部の記事を見直して、サブカテゴリーを設定しなければなりません。
さすがにこれは大変なので、あまり記事が多くならない内にやっておいた方がよさそうです。

やり方の詳細は、上記のWorldWorldWorldさんのブログをご参照ください。

【スポンサーリンク】
 

HTML文にはコメント行を

今回の方法では、「デザイン」→「カスタマイズ」から、「ヘッダ」と「フッタ」に、HTML文を追記することになります。

ここで、既に何か記載されている場合、今回のHTML文を追加すると、後で見た時に、どの部分を何のために追加したのか分からなくなりそうです。

なので、HTML分を追加するときは、コメント行を入れておくのがよさそうです。
例えばこんな感じです。

<!-- パンくずリスト階層化 -->   ←コメント行

↓以下、追加HTML文
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://hatena.wackwack.net/v1.1/js/breadcrumb.min.js"></script>
<script src="https://hatena.wackwack.net/v1.1/js/category_archive.min.js"></script>

コメントは、<!-- と --> で囲みます。

ともかく、はてなブログでは、こんなことをしたい!と思って探すと大抵あるので、奥の深さに感心してしまいます。
そうやって、ブログを少しずつ改良していけるのも楽しいものですね。