WordPressで制作したWebページのbodyタグには、サイトのフロントページなら「home」、固定ページなら「page」や「page-template」など、自動的にクラス名が設定される。これを使うと各ページで画面のデザインを変えることが出来る。

例えば、フロントページを表示している時の背景色は白、固定ページを表示している時は背景色はグレーにする場CSSファイルに以下のようなコードを追加すればよい。

body.home{
	background-color:white;
}
body.page{
	background-color:gray;
}

またページ内のコンテンツ部分に「<div id=”content”>」というような指定をしていたとして、その部分の背景色を各ページによって変えるには以下のようなコードになる。

.home #content{
	background-color:#F0EEF7;
}
.page #content{
	background-color:#CEEBE4;
}

これでほとんど対応できるが、場合によってclass名を追加したいという時もある。そのような時には次のようにadd_filterでbody_classを使う。

例えば、カテゴリーが「movie」を表示している時には「cat-movie」というクラスを加える、という場合には以下のようなコードをfunctions.phpに追加するだけでよい。

function add_class_name($classes) {
	if(in_category('movie')){
		$classes[] = 'cat-movie';
	}
	return $classes;
}
add_filter('body_class','add_class_name');

これは要するに、通常header.php内に記述されているbody_class()という関数が記述されているが、この関数をカスタマイズしているということである。