Zurück zum Blog

So fügen Sie Tabs zur WooCommerce-Seite „Mein Konto“ hinzu/entfernen/aktualisieren

2022-02-053 Minuten Lesezeit

Das WooCommerce-Plugin verfügt über den Shortcode [woocommerce_my_account], den man in jede Seite einbetten kann, um den angemeldeten Kunden alle Informationen anzuzeigen, die sich auf ihre vergangenen Bestellungen, Adressen, Zahlungsinformationen und mehr beziehen, basierend auf den Plugins, die Sie möglicherweise auf der Website installiert haben. Der Shortcode gibt die Daten aus, die nach Tabs und eindeutigen Inhalten in jedem organisiert sind, wie Sie im folgenden Bild sehen können:

Standardseite „Mein Konto“

Wie können wir neue Tabs entfernen, ändern oder hinzufügen?

Ja, eine Option ist die Verwendung eines vorhandenen Plugins und die andere Option ist das Schreiben einiger Zeilen PHP. Ich werde unten einige PHP-Snippets bereitstellen, damit Sie sie zu Ihrer functions.php-Datei hinzufügen und alle erforderlichen Anpassungen vornehmen können. Wir verwenden die folgenden WordPress-Filter-Hooks woocommerce_account_menu_items und woocommerce_get_endpoint_url


Tabs entfernen

/**
 * Entfernt den Link zu Vorbestellungen von der Seite „Mein Konto“.
 * @param $menu_links
 * @return array|string[]
 */
function my_site_remove_my_account_links( $menu_links ) {
    // Entfernt den Tab „Vorbestellungen“ von der Seite „Mein Konto“.
    // Dieser Tab wird vom Plugin https://woocommerce.com/products/woocommerce-pre-orders/ erstellt.
    unset( $menu_links['pre-orders'] );
    // Unten finden Sie die Standard-Tabs.
    //unset( $menu_links['dashboard'] ); // Entfernt den Tab „Dashboard“.
    //unset( $menu_links['orders'] ); // Entfernt den Tab „Bestellungen“.
    //unset( $menu_links['edit-address'] ); // Tab „Adressen“.
    //unset( $menu_links['payment-methods'] ); // Entfernt den Tab „Zahlungsmethoden“.
    //unset( $menu_links['edit-account'] ); // Entfernt den Tab „Kontodetails“.
    //unset( $menu_links['customer-logout'] ); // Entfernt den Tab „Abmelden“.
    return $menu_links;
}
add_filter ( 'woocommerce_account_menu_items', 'my_site_remove_my_account_links' );

Aktualisieren Sie die Titel der Tabs

/**
 * Aktualisiert den Titel der Tabs auf der Seite „Mein Konto“.
 * @param $menu_links
 * @return array|string[]
 */
function my_site_update_my_account_links( $menu_links ) {
    // Aktualisiert den Text für den Tab „Bestellungen“.
    $menu_links['orders'] = __('Meine vergangenen Bestellungen');
    // Unten finden Sie die Standard-Tabs.
    // $menu_links['dashboard'] = __('Ihr benutzerdefinierter Dashboard-Text'); // Aktualisiert den Titel des Tabs „Dashboard“.
    // $menu_links['edit-address'] = __('Ihr benutzerdefinierter Adress-Text'); // Aktualisiert den Titel des Tabs „Adressen“.
    // $menu_links['payment-methods'] =__('Ihr benutzerdefinierter Text für Zahlungsmethoden'); // Aktualisiert den Titel des Tabs „Adressen“.
    // $menu_links['edit-account'] = __('Ihr benutzerdefinierter Konto-Text'); // Aktualisiert den Titel des Tabs „Adressen“.
    // $menu_links['customer-logout'] = __('Ihr benutzerdefinierter Abmelde-Text'); // Aktualisiert den Titel des Tabs „Abmelden“.
    return $menu_links;
}
add_filter ( 'woocommerce_account_menu_items', 'my_site_update_my_account_links' );

/**
 * Fügt einen neuen benutzerdefinierten Link zur Seite „Mein Konto“ hinzu.
 * @param $menu_links
 * @return array|string[]
 */
function my_site_add_my_account_links( $menu_links ) {
    // Kommentieren Sie diese Zeilen aus, wenn Sie den neuen Tab nur für eine bestimmte Rolle anzeigen möchten.
    // Ruft den aktuellen Benutzer ab.
    // $user = wp_get_current_user();
    // if ( !in_array( 'MY_ROLE', (array) $user->roles ) ) {
    //  return $menu_links;
    // }
    // customendpoint wird vom woocommerce_get_endpoint_url-Filter verknüpft.
    $new = [ 'customendpoint' => __('Mein neuer Tab') ];
    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' );
/**
 * Legt die URL für den Endpunkt customendpoint fest, der in woocommerce_account_menu_items erstellt wurde
 * @param $url
 * @param $endpoint
 * @param $value
 * @param $permalink
 * @return mixed|string
 */
function my_site_custom_endpoint( $url, $endpoint, $value, $permalink ) {
    if ( $endpoint === 'customendpoint' ) {
        $url = '/internal-url/';
        // Sie können auch eine externe URL haben.
        // $url = 'https://davidloor.com';
    }
    return $url;
}
add_filter( 'woocommerce_get_endpoint_url', 'my_site_custom_endpoint', 10, 4 );

Für eine vollständige Erklärung der WooCommerce-Seite „Mein Konto“ besuchen Sie bitte:
https://woocommerce.com/document/the-my-account-page/