Comment réorganiser les onglets du menu « Mon compte » de Woocommerce
Je vous explique dans cet article comment réorganiser facilement votre menu « Mon compte » de Woocommerce après avoir ajouté un onglet.
Nous voilà dans la partie 2 de l’optimisation du menu « Mon compte » de Woocommerce.
Vous avez raté la première partie de ce tutoriel ? Aucun problème, c’est par ici.
Dans cet article, je vais vous expliquer comment réorganiser les onglets de la page « Mon compte ».
Petit flasback
Voilà où nous nous sommes arrêtés la dernière fois.
Nous avons ajouté l’onglet « Retours » mais comme le montre l’image ci-dessous, cet onglet se situe en dessous du bouton « Déconnexion », ce qui n’est pas très logique.
Alors pour modifier cela, voici le code à ajouter, toujours dans le fichier functions.php de votre thème enfant :
/**
* Reorder account items.
*
* @return array Ordered Items.
*/
function reorder_account_menu( $items ) {
return array(
'dashboard' => __( 'Dashboard', 'woocommerce' ),
'orders' => __( 'Orders', 'woocommerce' ),
'edit-account' => __( 'Edit Account', 'woocommerce' ),
'edit-address' => __( 'Addresses', 'woocommerce' ),
'retours' => __( 'Retours', 'woocommerce' ),
'customer-logout' => __( 'Logout', 'woocommerce' ),
);
}
add_filter ( 'woocommerce_account_menu_items', 'reorder_account_menu' );
Et voila le résultat :
Détaillons un peu ce code
Dans cette partie, nous pouvons voir les onglets du menu « Mon compte », en anglais, mais cela n’a pas d’impact si vous avez bien renommé vos onglets dans les réglages de Woocommerce. Et donc apparait, en ligne 5, notre slug « retours » avec son titre.
Et si vous voulez modifier l’ordre du menu, il faut tout simplement modifier l’ordre des onglets.
Vous pouvez positionner la ligne 5 à la ligne 2 etc.
'dashboard' => __( 'Dashboard', 'woocommerce' ),
'orders' => __( 'Orders', 'woocommerce' ),
'edit-account' => __( 'Edit Account', 'woocommerce' ),
'edit-address' => __( 'Addresses', 'woocommerce' ),
'retours' => __( 'Retours', 'woocommerce' ),
'customer-logout' => __( 'Logout', 'woocommerce' ),
Testé sur WordPress 6.1.1 et Woocommerce 7.1
Un nouveau projet WordPress ? Besoin d’aide ?
Contactez-moi ou visitez mon site et je me ferais un plaisir de vous aider.
Besoin d'un code personnalisé ?
À lire aussi
Afficher le mot de passe de votre champ « password » dans Jetformbuilder
Jetformbuilder est un outil puissant pour créer des formulaires en ligne interactifs. Cependant, il ne propose pas par défaut la possibilité d’afficher le mot de passe saisi par l’utilisateur. Ce tutoriel vous guidera à travers l’ajout d’un bouton permettant de visualiser le mot de passe dans les champs de type « mot de passe » de Jetformbuilder. […]
Masquer une section spécifique avec WooCommerce lorsque le panier est vide
Dans cet article, nous allons examiner un extrait de code qui permet de masquer dynamiquement une section spécifique sur un site WordPress utilisant WooCommerce lorsque le panier est vide. Cette fonctionnalité peut être particulièrement utile pour améliorer l’expérience utilisateur et simplifier l’interface lorsque le panier est vide. Voici le code à intégrer dans votre fichier […]
Changer le texte qui se trouve en bas du back-office WordPress
Dans cet article, apprenez comment changer facilement le nom du pied de page du back-office WordPress en utilisant un filtre spécifique et en modifiant le fichier functions.php de votre thème. Personnalisez votre site en quelques minutes.