• WordPress

[WordPress]bodyに対してページごとで異なるidとclassを付ける方法

Posted on 2016年11月17日

記事一覧と記事詳細で同一のテンプレートを使っていたりすると、ページ出力の際にbodyに別のidやclassを付けたい事があります。bodyに対してページごとで異なるidとclassを付ける方法をまとめました。

bodyに対してページごとで異なるidとclassを付ける方法

条件分岐タグによって表示中のページを判断しています。

<?php
//IDの設定
if ( is_front_page() ) {//フロントページが表示中
	$body_id = '表示させたいID';
} else if ( is_single() ) {//個別投稿のページを表示中
	$body_id = '表示させたいID';
} else if ( is_page('contact') ) {//個別の固定ページを表示中
	$body_id = '表示させたいID';
} else if ( is_category() ) {//カテゴリーのアーカイブを表示中
	$body_id = '表示させたいID';
} else if ( is_tag() ) {//投稿タグのアーカイブを表示中
	$body_id = '表示させたいID';
} else if ( is_search() ) {//検索結果のページを表示中
	$body_id = '表示させたいID';
}
if (isset($body_id)){
	$body_id = ' id="'.$body_id.'"';
}else{
	$body_id = NULL;
}

//classの設定
if ( is_front_page() ) {//フロントページが表示中
	$body_class = '表示させたいclass';
} else if ( is_single() ) {//個別投稿のページを表示中
	$body_class = '表示させたいclass';
} else if ( is_page('contact') ) {//個別の固定ページを表示中
	$body_class = '表示させたいclass';
} else if ( is_category() ) {//カテゴリーのアーカイブを表示中
	$body_class = '表示させたいclass';
} else if ( is_tag() ) {//投稿タグのアーカイブを表示中
	$body_class = '表示させたいclass';
} else if ( is_search() ) {//検索結果のページを表示中
	$body_class = '表示させたいclass';
}
if (isset($body_class)){
	$body_class = ' class="'.$body_class.'"';
}else{
	$body_class = NULL;
}
?>

<body<?php echo $body_id; ?><?php echo $body_class; ?>>

条件分岐タグ

条件分岐タグを使うと、「特定のページでのみ表示させる」といった一定の条件の時のみ行なう処理を簡単に設定できます。
ここでは良く使いそうなもののみまとめました。その他にも条件分岐タグには様々なものが用意されているので、詳しくはこちらのサイトを参照してください。
条件分岐タグ – WordPress Codex 日本語版

条件分岐タグ

is_home()
メインブログページが表示されている場合。メインブログページとは時系列のブログコンテンツを表示するページのこと。
is_front_page()
サイトのフロントページとして設定されている投稿・固定ページが表示されている場合。デフォルトだと投稿一覧。
is_single()
個別の投稿ページが表示されている場合。()の中にパラメータ(投稿IDなど)を指定できる。
is_sticky()
投稿編集ページで「この投稿を先頭に固定表示」にチェックがある投稿が表示されている場合。()の中に投稿IDなどを指定できる。
is_sticky()
投稿編集ページで「この投稿を先頭に固定表示」にチェックがある投稿が表示されている場合。()の中にパラメータを指定できる。
is_page()
固定ページが表示されている場合。()の中にパラメータを指定できる。
is_category()
カテゴリーページが表示されている場合。()の中にパラメータを指定できる。
is_tag()
タグのアーカイブページが表示されている場合。()の中にパラメータを指定できる。
is_archive()
各アーカイブページが表示されている場合。
is_search()
検索結果ページが表示されている場合。
is_404()
404エラーページが表示されている場合。
is_paged()
アーカイブページやメインページに表示数より多い投稿があり、ページが複数に分かれる時。

条件分岐を使って表示を出し分けるには、下記のような書き方をします。

<?php if ( is_front_page() ): ?>
	// フロントページの時はここを表示
<?php elseif ( is_single() ): ?>
	// 投稿ページのときはここを表示
<?php else: ?>
	// フロントページ・投稿ページ以外の時はココを表示
<?php endif; ?>

この記事は以下のサイトを参考にさせて頂きました。
WordPress：body_classに独自のクラスを追加する方法＋代替で独自のIDやクラスのみをbodyに指定する方法 | NxWorld
WordPress：カスタマイズするなら覚えておきたい条件分岐について | NxWorld