はてなブログの「カテゴリー」を階層化
こんな感じにサイドバーでカテゴリー分けをして表示したかったので、やり方を調べてみたら結構簡単にできるようなので試してみた。
まず始める前に注意点が1つ
カテゴリー表示の仕方がタグ方式のデザインテーマでは上手く表示されません。それが原因でデザインテーマの変更を余儀なくされました。
ブログのデザイン作成に詳しい方なら出来るかもしれないけど、自分はそこまで時間を掛けて調べても時間の無駄かなと思ったので簡単な道を辿ることにしました。
カテゴリーの階層化の仕方
1.公式パンくずリストにチェックを入れる
デザイン→カスタマイズ→記事にある『パンくずリスト』
2.カテゴリーの階層化
親カテゴリーを先に選び次に子カテゴリーを選ぶだけ。その際に子カテゴリーは、「親カテゴリー名-子カテゴリー名」と親と子の間をハイフンマイナスで繋ぐことを忘れてはいけない。
3.カテゴリーの表示設定
デザイン→カスタマイズ→サイドバー→にある『カテゴリー』を[編集]→[並び変え順]を[アルファベット順]にする。もし、サイドバーにカテゴリーを設置していない場合は、モジュールを追加で設置し設定する。
※並び替えをアルファベット順以外にした場合は上手くいきません。
4.スクリプトの設定
<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>
このコードをデザイン→カスタマイズ→フッタの欄にコピペ。
5.スタイルシートの設定
<link type="text/css" rel="stylesheet" href="https://hatena.wackwack.net/v1.1/css/fulldisplay.min.css"/>
このコードをデザイン→カスタマイズ→ヘッダにある「タイトル下』にコピペ。
以上で設定は完了。最後に変更を保存するを押すのを忘れずに。