←Retour au blog

Comment ajouter/supprimer/mettre à jour les onglets dans la page Mon compte WooCommerce

2022-02-05•3 min de lecture

Le plugin WooCommerce dispose du shortcode [woocommerce_my_account] disponible que l'on peut intégrer dans n'importe quelle page pour afficher aux clients connectés toutes les informations relatives à leurs commandes passées, adresses, détails de paiement et plus encore, en fonction des plugins que vous pourriez avoir installés sur le site. Le shortcode affiche les données organisées par onglets et contenu unique dans chacun, comme vous pouvez le voir dans l'image suivante :

Page Mon compte par défaut

Comment pouvons-nous supprimer, modifier ou ajouter de nouveaux onglets ?

Oui, une option consiste à utiliser un plugin existant, et l'autre option consiste à écrire quelques lignes de PHP. Je fournirai quelques extraits de code PHP ci-dessous afin que vous puissiez les ajouter à votre fichier functions.php et effectuer les personnalisations nécessaires. Nous utilisons les hooks de filtre WordPress suivants : woocommerce_account_menu_items et woocommerce_get_endpoint_url

Supprimer des onglets

/**
 * Supprime le lien des précommandes de la page Mon compte.
 * @param $menu_links
 * @return array|string[]
 */
function my_site_remove_my_account_links( $menu_links ) {
    // Supprime l'onglet précommandes de la page mon compte.
    // Cet onglet est créé par le plugin https://woocommerce.com/products/woocommerce-pre-orders/
    unset( $menu_links['pre-orders'] );
    // Vous trouverez ci-dessous les onglets par défaut.
    //unset( $menu_links['dashboard'] ); // Supprime l'onglet Tableau de bord.
    //unset( $menu_links['orders'] ); // Supprime l'onglet Commandes.
    //unset( $menu_links['edit-address'] ); // Onglet Adresses.
    //unset( $menu_links['payment-methods'] ); // Supprime l'onglet Moyens de paiement.
    //unset( $menu_links['edit-account'] ); // Supprime l'onglet Détails du compte.
    //unset( $menu_links['customer-logout'] ); // Supprime l'onglet de déconnexion.
    return $menu_links;
}
add_filter ( 'woocommerce_account_menu_items', 'my_site_remove_my_account_links' );

Mettre à jour les titres des onglets

/**
 * Met à jour le titre des onglets dans la page Mon compte.
 * @param $menu_links
 * @return array|string[]
 */
function my_site_update_my_account_links( $menu_links ) {
    // Met à jour le texte de l'onglet commandes.
    $menu_links['orders'] = __('Mes commandes passées');
    // Vous trouverez ci-dessous les onglets par défaut.
    // $menu_links['dashboard'] = __('Votre texte personnalisé pour le tableau de bord'); // Met à jour le titre de l'onglet Tableau de bord.
    // $menu_links['edit-address'] = __('Votre texte personnalisé pour les adresses'); // Met à jour le titre de l'onglet Adresses.
    // $menu_links['payment-methods'] =__('Votre texte personnalisé pour les moyens de paiement'); // Met à jour le titre de l'onglet Adresses.
    // $menu_links['edit-account'] = __('Votre texte personnalisé pour le compte'); // Met à jour le titre de l'onglet Adresses.
    // $menu_links['customer-logout'] = __('Votre texte personnalisé pour la déconnexion'); // Met à jour le titre de l'onglet de déconnexion.
    return $menu_links;
}
add_filter ( 'woocommerce_account_menu_items', 'my_site_update_my_account_links' );

Ajouter un onglet personnalisé, qui lie à une URL interne/externe

/**
 * Ajoute un nouveau lien personnalisé à la page Mon compte.
 * @param $menu_links
 * @return array|string[]
 */
function my_site_add_my_account_links( $menu_links ) {
    // Décommentez ces lignes si vous souhaitez afficher le nouvel onglet uniquement à un rôle spécifique.
    // Obtenir l'utilisateur actuel.
    // $user = wp_get_current_user();
    // if ( !in_array( 'MON_ROLE', (array) $user->roles ) ) {
    //  return $menu_links;
    // }
    // customendpoint sera accroché via le filtre woocommerce_get_endpoint_url.
    $new = [ 'customendpoint' => __('Mon nouvel onglet') ];
    return array_slice( $menu_links, 0, 1, true )
            + $new
            + array_slice( $menu_links, 1, NULL, true );
}
add_filter ( 'woocommerce_account_menu_items', 'my_site_add_my_account_links' );
/**
 * Définit l'URL pour le point de terminaison customendpoint créé dans woocommerce_account_menu_items
 * @param $url
 * @param $endpoint
 * @param $value
 * @param $permalink
 * @return mixed|string
 */
function my_site_custom_endpoint( $url, $endpoint, $value, $permalink ) {
    if ( $endpoint === 'customendpoint' ) {
        $url = '/url-interne/';
        // Vous pouvez également avoir une URL externe.
        // $url = 'https://davidloor.com';
    }
    return $url;
}
add_filter( 'woocommerce_get_endpoint_url', 'my_site_custom_endpoint', 10, 4 );

Pour une explication complète de la page Mon compte WooCommerce, vous pouvez visiter :
https://woocommerce.com/document/the-my-account-page/

Catégories:

WooCommerce