【WordPress】body_class()でbodyタグにクラスを追加・削除する方法

WordPressでは、body_class()関数を使って自動的にbodyタグにクラスを付与することができますが、特定の条件に基づいてクラスを追加・削除したい場合もあります。この記事では、body_classフィルターフックを使用して、簡単にカスタマイズする方法を紹介します。

スポンサーリンク

クラスを追加する方法

特定のページや投稿にクラスを追加したい場合、以下のコードをテーマのfunctions.phpファイルに追加します。

function my_custom_body_classes( $classes ) {
    // 新しいクラスを追加
    if ( is_single() ) {
        $classes[] = 'single-post-view';
    }
    return $classes;
}
add_filter( 'body_class', 'my_custom_body_classes' );

このコードでは、シングル投稿ページ(is_single()がtrueの場合)にsingle-post-viewというクラスをbodyタグに追加します。この方法により、投稿ページごとに異なるスタイルを簡単に適用できます。

クラスを削除する方法

デフォルトで追加されるクラスや不要なクラスを削除したい場合は、次のコードを使用します。

function my_remove_body_classes( $classes ) {
    // 削除したいクラス名を指定
    $class_to_remove = 'example-class';
    
    // クラスが存在する場合に削除
    if ( in_array( $class_to_remove, $classes ) ) {
        $classes = array_diff( $classes, array( $class_to_remove ) );
    }

    return $classes;
}
add_filter( 'body_class', 'my_remove_body_classes' );

このコードでは、example-classというクラスがbodyタグに含まれている場合に、それを削除します。これにより、スタイルの競合を避けることができ、ページの見た目を整理することができます。

よくある質問(FAQ)

Q. body_classフィルターでbodyタグに独自クラスを追加するには?
A. add_filter(‘body_class’, function($classes){ $classes[] = ‘my-custom-class’; return $classes; })をfunctions.phpに追加します。条件分岐と組み合わせて特定のページのみに適用することもできます。
Q. WordPressが自動出力するbodyクラス(page-id-XXX等)を削除するには?
A. body_classフィルターでarray_diffを使って削除したいクラスを取り除きます。例:remove_itemsを含むクラスをarray_filterで除外する処理を書きます。
Q. body_class()とpost_class()の違いは何ですか?
A. body_class()はbodyタグに付与するクラスを出力し、ページ全体の状態(固定ページ・カテゴリー等)を示します。post_class()は各投稿のコンテナdivに付与するクラスで、投稿固有の情報(カテゴリー・タグ等)を含みます。

まとめ

body_classフィルターフックを使用することで、bodyタグに必要なクラスを追加したり、不要なクラスを削除することができます。これにより、サイトのカスタマイズがより柔軟になり、テーマのスタイル調整が容易になります。ぜひ、あなたのサイトに合ったカスタマイズを試してみてください。