サイドバー・カテゴリーの階層化｜はてなブログ（無料）

この度、運営しているブログを「ワードプレス」から「はてなブログ」に切り替えました。
そこで本記事では、はてなブログの無料バージョンで、どれだけのカスタマイズができるのか試してみたので、上手くいったものをお知らせします。

今回は、サイドバーのカテゴリー階層化です‼️
作業の手順を、わかりやすくまとめましたので、ぜひチャレンジしてみて下さいね。

作業１．投稿した記事のカテゴリー付けを行う

通常は1つだけ付けていると思いますが、階層化するので2つ付けます。例えば、通常の「小遣い稼ぎ」に加えて、「小遣い稼ぎ-グログ」といった感じです。ハイフンは英数字半角で入れます。

作業２．パンくずリストの表示

管理画面→デザイン→工具マーク→記事→「パンくずリスト」にある、「記事ページにパンくずリストを表示する」にチェックを入れ「変更を保存する」をクリック。

作業３．サイドバーカテゴリーの編集

管理画面→デザイン→工具マーク→サイドバー→ カテゴリーの「編集」をクリック。

タイトル→ カテゴリー（自由）
並び替え順→ アルファベット順
表示件数→ 全て表示

にして「適用」をクリックし、上部にある「変更を保存する」をクリック。

作業４．フッタに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>

作業5．ヘッダのタイトル下にCSS記載

管理画面→工具マーク→ヘッダ→「タイトル下」のスペースに以下をコピー＆テースト。

↓ ↓ ↓

<link type="text/css" rel="stylesheet" href="https://hatena.wackwack.net/v1.1/css/fulldisplay.min.css"/>