はまぞうブログをカスタマイズ(10)自動的に生成される部分のhtmlとclass

はまぞうブログをカスタマイズ(10)自動的に生成される部分のhtmlとclass

はまぞうブログをカスタマイズ

はまぞうをカスタマイズするにあたって必要な情報として忘れちゃいけないのは、自動で生成される部分の出力htmlとそのclass名です。はまぞうでは3つのテンプレートがあり、各ページはページごとで3つの中から最初から決まっているテンプレートを読み込むことで作成されます。

特に個別記事とアーカイブは、よく読み込まれるテンプレートになるので大切になるわけですが、そこで忘れちゃいけないのが、どんなふうにhtmlやclassが出力されるかという点です。

サイドバーのときは、リストと見せかけておいて<div>の連続だったりしたので、今回もしっかりと確認してみることにしました。

【復習】サイドバーの出力htmlの確認

サイドバーに出力される基本のhtmlは以下のとおりになります。

 

上記のhtmlが、サイドバーのブロックごとに割り当てられたclassを含む<div>で囲まれます。

サイドバーのブロックごとに割り当てられるclass名

ブロック class
プロフィール profile
はまぞうおすすめ情報 ad
カテゴリー category
最新記事 recententry_img
過去記事 archives
最近のコメント comment
カレンダー calender
アクセスカウンタ counter
お気に入り link
ブログ内検索 search
QRコード qrcode

個別記事で生成されるhtmlでは何かあるか

結論から言うと、テンプレートで設定したclassがそのまま表示されます。したがって、個別記事のテンプレートを使うものすべてに統一的な表示になります。

wordpressのbody_classのように、ページごとのclassが割り当てられるわけではありません。カテゴリーIDをclassのように使うメモで残したことが、かなり役立ちそうです。


Back to Top