【WP】bodyタグには「body_class();」を記述しよう
2021/2/18
2021/10/5
1981 views
「body_class();」記述
bodyタグに<?php body_class(); ?>を記述する
ワードプレスのオリジナルテーマを作成始めたら、まずはhtmlやbodyなどの大枠の要素を記述していくと思います。
そのときに必ずbodyタグに「 <?php body_class(); ?>」を記述するようにしましょう。
以下は記述例です。
<body <?php body_class(); ?>>記述するとどうなるの？
記述した場合、bodyタグに下記のようなclassが自動で付与されて表示されます。
<body class="home page-template page-template-index page-template-index-php page page-id-6 logged-in admin-bar no-customize-support">それぞれ、どの固定ページや投稿、どのテンプレートファイル、どのユーザーがログインしているかなどを判別してclass名を返してくれています。
これを使うことにより、CSSで分岐条件セレクタとして使えることができます。
たとえば、トップページのフォントサイズだけ変えたい場合は以下のように指定することができます。
CSS
body.home {
font-size: 120%;
}まとめ
テンプレートタグだけで、bodyにさまざまなクラスを自動で付与してくれることで、多様な条件分岐で活用できます。
WordPressでサイト構築するひとつのメリットですね。
この記事へのコメント
- まだ書き込みはありません