Classes sur le body

Type de snippet : CSS

WP permet de générer de façon automatique des classes qui s’ajoutent sur la balise body selon le template de page utilisé pour l’affichage en front. C’est pratique pour affiner les styles des différentes pages du site.

Générer les classes par défaut

Ajouter au niveau du template header.php

<body <?php body_class(); ?>>

Ajouter une custom classe sur tout le site

Ajouter une autre classe en plus de celles générées par défaut.

NB: ces deux méthodes ajoutent la classe sur toutes les pages du site.

Méthode1

<body <?php body_class('class-name'); ?>>

Méthode 2

Utiliser un filtre sur body_class

add_filter( 'body_class', function( $classes ) {
    return array_merge( $classes, array( 'class-name' ) );
} );

Ajouter une classe au body selon le template de page

add_filter( 'body_class', 'custom_class' );
function custom_class( $classes ) {
    if ( is_page_template( 'page-example.php' ) ) {
        $classes[] = 'example';
    }
    return $classes;
}

Enlever des classes générées par body_class()

add_filter('body_class', function (array $classes) {
    if (in_array('class-to-remove', $classes)) {
      unset( $classes[array_search('class-to-remove', $classes)] );
    }
  return $classes;
});

A noter

Attention aux classes que l’on souhaite ajouter, il ne faut pas utiliser des mots déjà réservés par WordPress, comme « category » par exemple, si vous l’utilisez déjà dans votre html/css cela pourrait générer des conflits.