←Terug naar het blog

Hoe tabbladen toe te voegen/verwijderen/bij te werken op de WooCommerce Mijn accountpagina

2022-02-05‱3 min lezen

De WooCommerce plugin heeft de shortcode [woocommerce_my_account] beschikbaar die men op elke pagina kan insluiten om ingelogde klanten alle informatie te tonen die gerelateerd is aan hun eerdere bestellingen, adressen, betalingsgegevens en meer, gebaseerd op de plugins die u mogelijk op de site hebt geĂŻnstalleerd. De shortcode geeft de gegevens weer, georganiseerd per tabblad en met unieke inhoud in elk, zoals u kunt zien in de volgende afbeelding:

Standaard Mijn accountpagina

Hoe kunnen we tabbladen verwijderen, wijzigen of nieuwe toevoegen?

Ja, een optie is om een bestaande plugin te gebruiken, en de andere optie is om een paar regels PHP te schrijven. Ik zal hieronder een paar PHP-snippets verstrekken, zodat u deze kunt toevoegen aan uw functions.php-bestand en de benodigde aanpassingen kunt maken. We gebruiken de volgende WordPress filter hooks woocommerce_account_menu_items en woocommerce_get_endpoint_url


Tabbladen verwijderen

/**
 * Verwijder de pre-orders link van de Mijn accountpagina.
 * @param $menu_links
 * @return array|string[]
 */
function my_site_remove_my_account_links( $menu_links ) {
    // Verwijder het pre-orders tabblad van de mijn accountpagina.
    // Dit tabblad wordt aangemaakt door de plugin https://woocommerce.com/products/woocommerce-pre-orders/
    unset( $menu_links['pre-orders'] );
    // Hieronder vindt u de standaard tabbladen.
    //unset( $menu_links['dashboard'] ); // Verwijder Dashboard tabblad.
    //unset( $menu_links['orders'] ); // Verwijder Bestellingen tabblad.
    //unset( $menu_links['edit-address'] ); // Adressen tabblad.
    //unset( $menu_links['payment-methods'] ); // Verwijder Betaalmethoden tabblad.
    //unset( $menu_links['edit-account'] ); // Verwijder Accountgegevens tabblad.
    //unset( $menu_links['customer-logout'] ); // Verwijder Uitloggen link tabblad.
    return $menu_links;
}
add_filter ( 'woocommerce_account_menu_items', 'my_site_remove_my_account_links' );

Tabbladtitels bijwerken

/**
 * Werk de titel van de tabbladen op de Mijn accountpagina bij.
 * @param $menu_links
 * @return array|string[]
 */
function my_site_update_my_account_links( $menu_links ) {
    // Werk de tekst voor het bestellingen tabblad bij.
    $menu_links['orders'] = __('Mijn Vorige Bestellingen');
    // Hieronder vindt u de standaard tabbladen.
    // $menu_links['dashboard'] = __('Uw Aangepaste Dashboard Tekst'); // Werk de Dashboard tabbladtitel bij.
    // $menu_links['edit-address'] = __('Uw Aangepaste Adressen Tekst'); // Werk de Adressen tabbladtitel bij.
    // $menu_links['payment-methods'] =__('Uw Aangepaste Betaalmethoden Tekst'); // Werk de Adressen tabbladtitel bij.
    // $menu_links['edit-account'] = __('Uw Aangepaste Account Tekst'); // Werk de Adressen tabbladtitel bij.
    // $menu_links['customer-logout'] = __('Uw Aangepaste Uitlog Tekst'); // Werk de uitlog tabbladtitel bij.
    return $menu_links;
}
add_filter ( 'woocommerce_account_menu_items', 'my_site_update_my_account_links' );

/**
 * Voeg een nieuwe aangepaste link toe aan de Mijn accountpagina.
 * @param $menu_links
 * @return array|string[]
 */
function my_site_add_my_account_links( $menu_links ) {
    // Verwijder de commentaar bij deze regels als u het nieuwe tabblad alleen voor bepaalde rollen wilt weergeven.
    // Haal de huidige gebruiker op.
    // $user = wp_get_current_user();
    // if ( !in_array( 'MY_ROLE', (array) $user->roles ) ) {
    //  return $menu_links;
    // }
    // customendpoint zal worden gehooked vanuit de woocommerce_get_endpoint_url filter.
    $new = [ 'customendpoint' => __('Mijn nieuwe tabblad') ];
    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' );
/**
 * Stel de URL in voor de endpoint customendpoint die is aangemaakt in 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 = '/interne-url/';
        // U kunt ook een externe URL hebben.
        // $url = 'https://davidloor.com';
    }
    return $url;
}
add_filter( 'woocommerce_get_endpoint_url', 'my_site_custom_endpoint', 10, 4 );

Voor een volledige uitleg over de WooCommerce Mijn accountpagina, kunt u terecht op:
https://woocommerce.com/document/the-my-account-page/