Langues: Anglais * Menus 日本語 Slovenčina •中文 (简体)• (Ajoutez votre langue)
Le menu de navigation est une fonctionnalité de thème introduite avec la version 3.0. WordPress inclut un mécanisme facile à utiliser pour introduire des menus de navigation personnalisés dans un thème. Afin d’intégrer la prise en charge des menus dans votre thème, vous devez ajouter quelques segments de code à vos fichiers de thème.
Référence de la fonction
Menu de navigation du registre | Afficher le menu de navigation |
---|
Enregistrez les menus
Tout d’abord, dans les fonctions de votre thème.php, vous devez écrire une fonction pour enregistrer les noms de vos menus. (C’est ainsi qu’ils apparaîtront dans l’écran d’administration des menus Appearance->.) À titre d’exemple, ce menu apparaîtrait dans la boîte « Emplacements des thèmes » sous la forme de « Menu d’en-tête ».
function register_my_menu() { register_nav_menu('header-menu',__( 'Header Menu' ));}add_action( 'init', 'register_my_menu' );
Et cela ferait apparaître deux options de menu, le menu d’en-tête et le menu supplémentaire –
function register_my_menus() { register_nav_menus( array( 'header-menu' => __( 'Header Menu' ), 'extra-menu' => __( 'Extra Menu' ) ) );}add_action( 'init', 'register_my_menus' );
Afficher les menus sur le thème
Une fois que vous avez fait cela, votre thème sera presque prêt. La dernière étape de préparation consiste à indiquer au thème où vous souhaitez que les menus apparaissent. Vous le faites dans le fichier de thème correspondant. Ainsi, par exemple, nous pourrions vouloir que notre menu d’en-tête soit dans l’en-tête.php. Ouvrez donc ce fichier dans l’éditeur de thème et décidez où vous souhaitez placer votre menu. Le code à utiliser ici est wp_nav_menu dont nous aurons besoin une fois pour chaque emplacement de menu. Ajoutez donc ce code –
<?php wp_nav_menu( array( 'theme_location' => 'header-menu' ) ); ?>
Tout ce dont vous avez besoin pour vous assurer que l’emplacement thématique pointe vers le nom que vous avez fourni pour votre menu dans les fonctions.code php ci-dessus. (Notez que c’est le menu d’en-tête qui est utilisé ici plutôt que le menu d’en-tête sans trait d’union. Le menu d’en-tête est le nom que le code comprend, le menu d’en-tête est la version lisible par l’homme que vous voyez dans la page d’administration.)
Pour compléter le code, vous pouvez placer votre menu supplémentaire ailleurs. Peut-être que vous voulez un menu sur l’une de vos pages, par exemple, et vous voudrez peut-être même qu’il soit un peu jazzé avec un DIV contenant d’une certaine classe –
wp_nav_menu( array( 'theme_location' => 'extra-menu', 'container_class' => 'my_extra_menu_class' ) );
Pour que vous mettiez ce qui précède dans votre modèle de page, et non seulement le menu apparaîtrait où que vous le mettiez, il serait stylé comme my_extra_menu_class afin que vous puissiez travailler avec cela en CSS.
Panneau de menus
C’est tout le travail d’arrière-plan. Pour terminer, il vous suffit de visiter le panneau de menus Appearance-> dans l’administrateur de votre site. Maintenant, au lieu de voir du texte suggérant que votre thème ne prend pas en charge nativement les menus, vous verrez des options d’emplacement de thème.
Vous pouvez maintenant utiliser le créateur de menu de l’interface graphique sur ce panneau d’administration pour assembler vos menus. Donnez-leur chacun un nom, puis attribuez un menu à un emplacement avec les options déroulantes.
(Vous verrez vos nouveaux choix de navigation lorsque vous ajouterez un nouveau menu.)
Ressources externes
- Au revoir, maux de tête. Bonjour, menus ! – Tutoriel raisonnable par Justin Tadlock qui a plus de détails sur les options disponibles
- Générateur de menu de navigation WordPress
Lié
Menu de navigation
- register_nav_menus()
- register_nav_menu()
- unregister_nav_menu()
- has_nav_menu()
- >wp_nav_menu()
- wp_get_nav_menu_items()
Prise en charge du thème: add_theme_support(), remove_theme_support(), current_theme_supports()
Caractéristiques du thème: barre latérale, menus, formats de publication, balise de titre, arrière-plan personnalisé, en-tête personnalisé, logo personnalisé, vignettes de publication, liens d’alimentation automatique, html5, style d’éditeur, content_width