Ajouter, supprimer, mettre à jour un lien dans le menu Mon Compte de WooCommerce

Compte WooCommerce Ajouter un Lien

 

Introduction

Lorsque vous installez Woocommerce sur votre site Web, il créera automatiquement la page Mon compte pour vous. Si vous visitez la page Mon compte, vous y verrez des liens de menu liés au compte client. Comme la capture d’écran ci-dessous :

 

Pourquoi changer le menu Mon Compte ?

Il peut y avoir différents scénarios. La plupart du temps il s’agira de nouvelles fonctionnalités que vous souhaitez offrir à vos utilisateurs ou à des tierces parties. Voici quelques exemples :

  • Déposer un ticket
  • Accéder à l’historique des ventes et paiements, pour des vendeurs tiers par exemple
  • Accéder à ses annonces, pour des annonceurs

 

Supprimer des URLs du menu Mon Compte sans coder

  • Allez dans WooCommerce >> Réglages >> Avancé
  • Positionnez simplement votre curseur sur le point de terminaison à supprimer et supprimer le texte
  • Cliquez sur Enregistrer les modifications

 

Supprimer des URLs du menu Mon Compte avec du code

Vous devez utiliser le filtre woocommerce_account_menu_items. Rappelez-vous que, si vous souhaitez faire des mises à jour à votre site WordPress sans passer par un plugin, il faut placer votre code dans le fichier functions.php de votre thème, et de préférence, dans un thème enfant. Si vous ne savez pas comment faire pour créer un thème enfant, allez consulter ce tutoriel.

Ci-dessous le code à utiliser, pensez juste à décommenter la ligne pour laquelle vous souhaitez supprimer le point de menu.

add_filter ( 'woocommerce_account_menu_items', 'ws_customize_account_menu_items' );
function ws_customize_account_menu_items( $menu_items ){
 
    //unset( $menu_items['dashboard'] ); // Remove Dashboard from My Account Menu
    //unset( $menu_items['orders'] ); // Remove Orders from My Account Menu
    unset( $menu_items['downloads'] ); // Remove Downloads from My Account Menu
    //unset( $menu_items['edit-account'] ); // Remove Account details from My Account Menu
    unset( $menu_items['payment-methods'] ); // Remove Payment Methods from My Account Menu
    //unset( $menu_items['edit-address'] ); // Addresses from My Account Menu
    //unset( $menu_items['customer-logout'] ); // Remove Logout link from My Account Menu
return $menu_items;
 
}

 

Changer le texte d’un point de menu Mon Compte

Voici le code à utiliser pour renommer un point de menu dans votre page Mon Compte.

add_filter ( 'woocommerce_account_menu_items', 'ws_customize_account_menu_items' );
 function ws_customize_account_menu_items( $menu_items ){
     
    // Change the Menu Item name text
    $menu_items['dashboard'] = 'My Account'; // Rename "Dashboard" in My Account menu to 'My Account'
    $menu_items['orders'] = 'My Orders'; // Rename 'Ordrers' to 'My Orders'
    $menu_items['edit-address'] = 'My Addresses'; //Rename 'Addresses' to 'My Addresses'
    return $menu_items;
}

 

Ajouter un nouveau point de menu Mon Compte

Voici le code à utiliser pour ajouter un point de menu à votre page Mon Compte.

// add custom endpoint for My Account menu
add_filter ( 'woocommerce_account_menu_items', 'ws_customize_account_menu_items' );
function ws_customize_account_menu_items( $menu_items ){
     // Add new Custom URL in My Account Menu 
    $new_menu_item = array('my-tickets'=>'My tickets');  // Define a new array with cutom URL slug and menu label text
    $new_menu_item_position=7; // Define Position at which the New URL has to be inserted
    
    array_splice( $menu_items, ($new_menu_item_position-1), 0, $new_menu_item );
    return $menu_items;
}
// point the endpoint to a custom URL
add_filter( 'woocommerce_get_endpoint_url', 'ws_custom_woo_endpoint', 10, 2 );
function ws_custom_woo_endpoint( $url, $endpoint ){
     if( $endpoint == 'my-tickets' ) {
        $url = 'https://prod.webstreet.io/my-tickets/'; // Your custom URL to add to the My Account menu
    }
    return $url;
}

 

Ajouter un nouveau point de menu Mon Compte sur un site multilingue

Alors là ça se complique un peu ! Si vous avez un site multilingue, il va tout d’abord falloir rendre la chaine de caractère du point de menu traduisible. Voici le code à utiliser :

esc_html__( 'My tickets', 'generatepress-child' )

La fonction « esc_html__ », permet de retrouver la traduction du texte, ici « My tickets », dans le domaine mentionné en 2ème paramètre, ici « generatepress-child ». Si aucune traduction n’est trouvée, le texte n’est pas traduit.

En plus de cela, il faut créer un fichier de traduction pour votre thème enfant à partir du fichier de traduction du thème parent. Par exemple dans mon cas, je suis allée dans le dossier « wp-content/languages/themes » de mon installation WordPress. J’ai ensuite copié-collé le fichier generatepress-fr_FR.po et je l’ai renommé en generatepress-child-fr_FR.po. Puis, je l’ai ouvert avec un éditeur de texte, Visual Studio Code par exemple, et j’ai ajouté le terme à traduire à la fin du fichier, comme ceci :

#: functions.php:35
msgid "My tickets"
msgstr "Mes tickets"

Enfin, il faut générer le fichier .mo et pour cela il faut utiliser le logiciel PoEdit. Il vous faudra ouvrir votre fichier generatepress-child-fr_FR.po avec PoEdit et l’enregistrer. Automatiquement un fichier .mo sera généré. Pour terminer, envoyez ces 2 fichiers, generatepress-child-fr_FR.po et generatepress-child-fr_FR.mo sur votre serveur via Ftp, dans le dossier « wp-content/languages/themes ». And voilà ! Votre terme est traduit !

Il faut ensuite faire en sorte que l’URL s’affiche en fonction de la langue d’affichage du site ! Si le site est en anglais, je veux la version anglaise de l’URL, s’il est en français, je veux sa version française. Rien de plus simple avec Polylang ! Une fois Polylang installé, vous pouvez utiliser les fonctions de ce plugin. Dans notre cas, nous utilisons la fonction pll_get_post(), avec en paramètre l’identifiant du post concerné, puis la fonction get_permalink qui nous permettra d’obtenir l’url du post :

        $ticket_page = pll_get_post(390595);
        //retrieves the full permalink for the current page or post id
        $url = get_the_permalink($ticket_page);

Comme ce post a une version anglais et une version française, lorsque j’affiche mon site en anglais, c’est l’URL anglaise qui est affichée, lorsque j’affiche mon site en français, c’est l’URL française ! And voilà ! Ci-dessous le code complet, à ajouter à votre fichier functions.php de votre thème enfant :

// add custom endpoint for My Account menu
add_filter ( 'woocommerce_account_menu_items', 'ws_customize_account_menu_items' );
function ws_customize_account_menu_items( $menu_items ){
     // Add new Custom URL in My Account Menu 
    $new_menu_item = array('my-tickets'=> esc_html__( 'My tickets', 'generatepress-child' ));  // Define a new array with cutom URL slug and menu label text

    $new_menu_item_position=7; // Define Position at which the New URL has to be inserted
    
    array_splice( $menu_items, ($new_menu_item_position-1), 0, $new_menu_item );
    return $menu_items;
}
// point the endpoint to a custom URL
add_filter( 'woocommerce_get_endpoint_url', 'ws_custom_woo_endpoint', 10, 2 );
function ws_custom_woo_endpoint( $url, $endpoint ){
     if( $endpoint == 'my-tickets' ) {

        $ticket_page = pll_get_post(390595 );
        //retrieves the full permalink for the current page or post id
        $url = get_the_permalink($ticket_page);
    }
    return $url;
}

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée.

Ce site web utilise des cookies pour vous offrir une meilleure expérience.