Menus WordPress

On utilise la fonction add_theme_support() pour intégrer le sytème de menu de WordPress

add_theme_support('menus');

register_nav_menus( string[] $locations = array() ) permet de créer plusieurs menus

Tableau : nomage des emplacements de menu du thème et assignation au ID des menus

*text-domain correspond au nom du thème indiqué dans le fichier style.css

Ajout d’un hook action appelant la fonction d’enregistrement des menus (action > comportement)

	function register_alchemy_menu(){
	register_nav_menus(
		array(
			'header' => esc_html__( 'Menu header', 'alchemy' ),//text-domain:alchemy*
			'footer' => esc_html__( 'Menu footer', 'alchemy' )
		)
	);
}
	add_action( 'after_setup_theme', 'register_alchemy_menu' );
}

Affichage du menu dans le fichier correspondant : wp_nav_menu()

Attribution de l’id d’emplacement de menu du theme

Retrait des conteneur WordPress

Attribution de la classe souhaitée

<?php  wp_nav_menu([
    'theme_location' => 'header',
    'container' => false,
    'menu_class' => 'header-menu'
    ]);
    ?>
</header>

Ajout d’une classe pour les éléments de menu

apply_filters( ‘nav_menu_css_class’, string[] $classes, WP_Post $menu_item,

stdClass $args, int $depth )

Ajout du filtre appelant la fonction du thème —> return pour obtenir une valeur( filtre > valeur )

wp_doc

—> $depth ? user for paddings ?

function alchemy_menu_class($classes) {
    $classes[] = 'alchemy_menu_class';
    return $classes;
}
add_filter('nav_menu_css_class', 'alchemy_menu_class');

On peut ajouter des attributs au liens niché dans les élements <li> du menu, en utilisant la fonction

nav_menu_link_attributes() via un filtre.

return pour obtenir une valeur( filtre > valeur )

function alchemy_menu_link_class($attrs) {
    $attrs['class'] = 'alchemy_menu_link_class';
    return $attrs;
}
add_filter('nav_menu_link_attributes', 'alchemy_menu_link_class');

Ajouter un item au menu :

• ajout d’un élément de liste non cliquable

function add_li_item( $items, $args){
    if($args->theme_location === 'footer') {
        $items .= "<li class=\\"alchemy_menu_class\\">TOUS DROITS RÉSERVÉS</li>";
    }
    return $items;
 }; 
 add_filter('wp_nav_menu_items','add_li_item',10, 2);

<aside> ⚠️ Rappel sur l’insertion d’un item de menu connexion-dépendant :

• Projet Planty </aside>

add_filter('wp_nav_menu_items','add_admin_link',10,2);

function add_admin_link($items, $args) {
	if (is_user_logged_in() && $args->theme_location === 'main-menu') {
		$items.= '<li class="lien-admin"><a href="' . get_admin_url() .'">Admin</a></li>';

	}
	return $items;
}

Ajouter logo dans header WordPress

Activer la fonctionnalité custom-logo dans le fichier functions.php du thème WordPress.

Cela déclare la fonctionnalité custom-logo avec des paramètres pour la hauteur et la largeur du logo, ainsi que la possibilité de largeur flexible.

add_theme_support( 'custom-logo', array(
    'height'      => 175,
    'width'       => 400,
    'flex-width' => true,
) );

Dans le fichier header.php de votre thème, ajoutez le code suivant pour afficher le logo :

Cela appelle la fonction the_custom_logo() qui affichera le logo personnalisé défini dans les paramètres de la fonctionnalité custom-logo.

<?php the_custom_logo(); ?>

Si vous souhaitez afficher le logo différemment en fonction de la page visitée, vous pouvez utiliser la fonction body_class() pour générer des classes CSS en fonction de la page actuelle.

Par exemple :

Cela affichera le logo personnalisé pour la page d’accueil, mais un autre logo pour la page “À propos”.

<?php if ( is_home() ) { ?>
    <header>
        <?php the_custom_logo(); ?>
    </header>
<?php } elseif ( is_page('about') ) { ?>
    <header>
        <!-- logo pour la page "À propos" -->
    </header>
<?php } ?>