WordPress – body_class()にクラスを追加

body_class()にクラスを追加するのはいいが追加するclassが多ければ当然不要なクラス名も各ページで表示されてしまいます。そうならないために条件分岐タグをうまく利用して特定のページのみクラス名を追加する方法を解説します。

すべての条件分岐タグはこちらで紹介しきれないのでよく使う条件分岐をご紹介します。

body_classにクラスを追加

body_class()にクラスを追加したい場合下記のようにフィルターフックを利用します。

add_filter('body_class', function($classes){
	if(is_home() || is_front_page()){
		$classes[] = 'class-name';
	}
	return $classes;
});

上記の例はメインページまたはフロントページの場合に'class-name'というクラス名を追加しています。それ以外のページでは追加されないようになっています。

条件分岐一覧

クラスをどのページへ追加するのかは条件分岐を知る必要があります。下記によく使う場所を用意しましたので参考にしてください。

カスタム投稿やカスタム分類については下記をご覧ください。

特定ページへクラスを追加する例

記事ページ

add_filter('body_class', function($classes){
	if(is_single()){
		$classes[] = 'class-name';
	}
	return $classes;
});

記事ページの場合のみにクラスを追加する設定になっています。もし特定の記事ページだけに追加したい場合is_single('29')といった形に変更することで追加することも可能です。

固定ページ

add_filter('body_class', function($classes){
	if(is_page()){
		$classes[] = 'class-name';
	}
	return $classes;
});

上記はすべての固定ページに追加する設定です。もし特定のpage-sample.phpといった固定ページのみに追加したい場合is_page('sample')とすればよし。

カテゴリーページ

add_filter('body_class', function($classes){
	if(is_category()){
		$classes[] = 'class-name';
	}
	return $classes;
});

カテゴリーのアーカイブページにクラスを追加します。特定のカテゴリーに設定したい場合IDかスラッグ名を条件に設定することで特定のカテゴリーにクラスを追加することも可能です。

ただ、カテゴリーページとカスタムタクソノミーは違うので注意が必要。

タグページ

add_filter('body_class', function($classes){
	if(is_tag()){
		$classes[] = 'class-name';
	}
	return $classes;
});

タグのアーカイブページにクラスを追加します。特定のタグページに設定したい場合IDかスラッグ名を条件に設定することで特定のカテゴリーにクラスを追加することも可能です。

ただ、タグページとカスタムタクソノミーは違うので注意が必要。

著者ページ

add_filter('body_class', function($classes){
	if(is_author()){
		$classes[] = 'class-name';
	}
	return $classes;
});

作成者ページが表示されている場合にクラスを追加する。

アーカイブページ

add_filter('body_class', function($classes){
	if(is_archive()){
		$classes[] = 'class-name';
	}
	return $classes;
});

検索結果ページ

add_filter('body_class', function($classes){
	if(is_search()){
		$classes[] = 'class-name';
	}
	return $classes;
});

404ページ

add_filter('body_class', function($classes){
	if(is_404()){
		$classes[] = 'class-name';
	}
	return $classes;
});

カスタム投稿タイプ

add_filter('body_class', function($classes){
	if(is_post_type_archive()){
		$classes[] = 'fafwefaw-miniblog';
	}
	return $classes;
});

カスタム投稿タイプの場合に追加します。register_post_type($post_type , $args);で登録している特定の投稿タイプのみに追加したい場合、投稿タイプ名を条件に設定します。もし登録している$post_typeが'news'だった場合is_post_type_archive('news')となります。また配列として設定して複数のカスタム投稿に追加することも可能です。

カスタム分類

こちらはregister_taxonomy()で登録したカスタムタクソノミーのアーカイブページに該当した場合にクラスを追加します。is_taxonomy()は廃止され現在ではis_tax()を使用します。

add_filter('body_class', function($classes){
	if(is_tax()){
		$classes[] = 'fafwefaw-miniblog';
	}
	return $classes;
});

こちらも特定のタクソノミーでクラスを追加したい場合register_taxonomy()で設定しているタクソノミー名を条件に設定してあげますis_tax('news-tag')。

参考文献

• https://developer.wordpress.org/themes/basics/conditional-tags/