どーも、いとです。
スマホ表示の「カテゴリ一覧」デザインと項目を修正しました。
今回は折り畳み式デザインとなっております！
カテゴリ一覧修正
▼Before
長い！！！！
そしてカテゴリ乱立しすぎィ！
心ゆくままに記事を書き続けた結果、カテゴリの収集がつかなくなってきました。
▼After
親カテゴリを4つに絞りました！
だいぶスッキリしたと思います。
「▼」または親カテゴリの余白をクリックすると、下層のカテゴリが見えるようになっています。
折り畳み式リストhtmlに挑戦
既存のカテゴリ表示htmlを改造する方向で検討しました。
[イメージ図]
▼親カテゴリリンク
子カテゴリリンク
子カテゴリリンク
▼親カテゴリリンク
子カテゴリリンク
変更前にカテゴリリンクを階層っぽく並べていたので、親カテゴリで開閉させる仕組みを追加すればイケるのでは？
145.rei-yumesaki.net
上記サイト様のリスト開閉htmlを参照しつつ、コードを書き直していきました。
軽い気持ちで始めたカテゴリ一覧の改修。まさか仕事終わりの金曜日に夜中の3時までコード修正をするハメになるとは思いませんでしたが、なんとか完成！！
▼html編集で苦戦したところ
・リストの中にリストを入れ込む
→<li>が大量にありすぎて構造が複雑になってしまった。コピペでリストを作っていたら迷子タグが出てきて泣いた
▼メリット
・表示させたいカテゴリを自分で取捨選択できる
→よく更新するカテゴリや見てほしいカテゴリだけを表示させることが可能
・記事のカテゴリ修正が不要
→階層があるかのように表示させているだけなので、記事に紐付いているカテゴリの親子を直す必要はない
▼デメリット
・カテゴリが増減・カテゴリ名が変わる場合はコードも修正が必要
→メンテナンスが大変
以上、カテゴリ一覧修正についての記事でした！
本ブログに来る方の中には
「〇〇カテゴリは興味あるけれど、□□カテゴリは興味ない！」
という人もいらっしゃると思います。
これからも雑記ブログとして突き進む（カテゴリは増える）予定ですが、「ブログを見に来た人が目的のコンテンツに辿り着けない」のは本意でないので、この機会にカテゴリを整理しました。これが今回改修に至った経緯となります。
ブログ記事の内容はアホ丸出しですが、見やすさ等は意識して改善していきたいと思っていますので、これからもよろしくお願いします！
では、今回はこのへんで(・∀・)ノシ
