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.