現在はてなブログでこのブログを書いているのですが、先日デザインテーマを「Minimalism」に変えてみました。
※追記：2018年6月下旬に、はてなブログからWordPressに移行したため、現在は当ブログのデザインが異なっています。
そのついでに前から思っていた「カテゴリを階層化したい」という要望をやってしまうことに。
ここでポイントがまず2つ。
- カテゴリー階層化は、はてなブログ公式は対応していない
- 対応するには「パンくずリストを作成するブログパーツ」を使用すればいける
というわけで、ブログパーツ使わせてもらい早速設定してみました。
これまでのカテゴリーの状態。
整理して設定したのがこちら。ちょっとすっきりしました。
▶の部分を押すと下の階層が現れるようになっています。
これこれ〜！こんな風にしたかったんですよね。
今回使用したブログパーツを作成してくださったサイトさんはこちら。
備忘録のために、今回はその時にやった対応について書いていきます！
目次
1.パンくずリストを有効にする
はてなブログの管理ページから「デザイン」→「カスタマイズ」→「記事」と進みます。下の方にある「記事ページにパンくずリストを表示する」にチェックを入れます。
チェックしたら最後に「変更を保存をする」を忘れずに。
2.スクリプトの設定をする
次に管理ページの「デザイン」→「カスタマイズ」→「フッタ」に進みます。
パンくずリストを設定した「記事」の2つ下にあるはずです。
そこにスクリプトを貼り付けます。
スクリプトは、ブログパーツを作成してくださったサイトさんに書いてありますが、念のためこちらにも貼っておきます。
<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>
3.スタイルシートを設定する
管理ページから「デザイン」→「カスタマイズ」→「ヘッダ」に進みます。「フッタ」の3つ上ですね。そこに下記スクリプトを貼りつけます。
<link type=”text/css” rel=”stylesheet” href=”http://hatena.wackwack.net/v1.1/css/fulldisplay.min.css“/>
4.カテゴリーをルールに従い登録する
ここでようやくカテゴリーの登録です。
作成者さんいわく、下記のルールで登録するとのこと。
「親カデコリ-子カテゴリ」という命名規則で、擬似的な階層を表すカテゴリを登録する。
「親カテゴリだけ」のカテゴリを必ず登録する。
カデコリの並び順が「親カテゴリ」→「親カテゴリ-子カテゴリ」となるように登録する。
私のカテゴリでやるとこんな感じですね。
親カテゴリが「グルメ・土産」
子カテゴリが「土産」
さらにその子カテゴリが「東京」という順で並ぶようにしています。
見た目はこういう感じになります。
5.カテゴリーを並び替える
カテゴリーを登録したら、「デザイン」→「サイドバー」→カテゴリーの「編集」と進みます。
「編集」をクリックすると登録したカテゴリーが並んでいるので、ここでカテゴリーの順番を整理します。
「記事が追加された順」「記事が多い順」「アルファベット順」「カスタム」と選択できるので目的に合わせて変更してください。私は好きな並び順にしたかったので「カスタム」を選択しています。
重要なのは、ここで見えている並びが実際に見える並び順にも反映されるということ。
なんてことになり、記事が行方不明になってたりするので要注意です！！泣
（どこに行っていたかというとその下のライフログの中に入っていました…）
ドラッグ＆ドロップで順番は動かせるのでカテゴリーの編集から順番の並び替えはお忘れなく！
これで見た目はばっちりです。おつかれさまでした！
6.カテゴリーの階層化をうまくやるポイント
- スクリプトとスタイルシートの設定はカテゴリーの登録前にしておく
- 編集からカテゴリーの並び順を確認し、おかしければ調整する
- 「変更を保存する」を忘れずにクリックする
特にこの3点に気をつければ、あとは手順にそって進んでいけば問題ないかと。
私は最初、スクリプトとスタイルシートの設定をやらずにカテゴリー登録をしてしまったのですが、「グルメ・土産-土産-東京」のような見えてはいけないカテゴリーがブログに表示されてしまい、あわてて削除しましたw
「なんかうまくいかない！」「あるはずのカテゴリーが出てこない！」「変なところに出てる！」という方は上記3点を確認してみてください。
カテゴリーの設定は記事が少ない段階でやった方が楽に済むので、階層化を考えている方はお早めにどうぞ。
