記事下にカテゴリー一覧をタグクラウド風に設置するカスタマイズ
色々なジャンルの記事を書いていると、カテゴリーがバカみたいに多くなります。
サイドバーに表示するとちょっとサイドバーの領域を占領しすぎて嫌だなあと思うわけです。スクロールしてもスクロールしてもカテゴリー一覧しかねえなみたいな。
1カラムのブログの場合は、サイドバー領域が広いので、綺麗に表示されるんですよね。2カラムにしている方がカテゴリー一覧をサイドバーに表示しているのをよく見かけますが、個人的にカテゴリー一覧は記事下推奨です。スッキリしますしね！！
完成例
こちらはPC版。
こっちがスマホ版。
今回はこんな感じになるのを目指してカスタマイズしていきます。
注意点①テーマによっては干渉があります
はてなブログのテーマによっては、テーマの段階でカテゴリーにカスタマイズが行われている場合があり、うまく表示されない可能性があります。
注意点②それなりの知識は必要
コピペでOK！みたいに出来るほど僕は知識がありませんので、ブログのカスタマイズをいくつかやっている方向けのカスタマイズです。（色々各自調整する必要がある）
HTMLやCSSの知識は必要ない（とは思う）ですが、それなりにブログのカスタマイズをしてきた人向けです（二回目）。
1．表示したいカテゴリーを決める
全部表示したいって人は全部表示するんでもいいと思いますが、めっちゃ多いって人はある程度表示するカテゴリーを絞りましょう。
簡単な方法。カテゴリーを何個まで表示するというコードを実質3行程度で実装可能です。
おすすめの方法。好きなカテゴリーを表示できます。
2．サイドバーのカテゴリー一覧のHTMLをコピー
自分のサイトで右クリック→ページのソースを表示すると、軽く怖い英数字の羅列が表示されるので、その中からこんな感じの表記を探ります。
先ほど紹介した記事のようにするのであれば、このカテゴリーの部分を一旦メモ帳にコピーして、好きなタグのみを表示させるように調整してください。
一応言っておきますと、<li>~</li>を一つの塊として考えましょう。
削除する時は<li>~</li>までを消しましょう!
調整できたら記事下にペースト
あとは記事下にペーストするだけです。
ちなみに僕はこんな感じになりました。見本としてお使いください。
ちなみにうまくいかない場合はコメント欄までどうぞ。出来る限り調整するんで。
3．CSSを貼り付け
あとはCSSを貼り付けるだけです。お好みで調整してください。
結構プレーンな仕上がりなので各々のテーマに合わせて程よくカスタマイズしてください。
4．まとめ
最初にも言いましたが、カテゴリーが沢山ある人は、サイドバーに表示すると折角の関連記事や目次、人気記事といった要素が薄れてしまいます。
と言うのも、カテゴリーは文字の羅列すぎて、「ここには情報がないな」と判断されてしまうことが多いと思うわけです。
それなら範囲を広く取れて、なおかつ興味を持ったユーザーだけに知ってもらえる記事下が、カテゴリー一覧設置にはベストな位置だなと思ったわけです。
個人的な意見なので、判断は読者様各人に任せますが、よかったら参考にどうぞ。
