Custom Tab / Menu in der WooCommerce Account Seite

Dieser Code fügt einen neuen Tab in das WooCommerce Mein-Account / My-Account Menu (Tab-Bereich) hinzu (bei Klick auf den neuen Tab erfolgt eine Weiterleitung):

/**
 * WooCommerce Custom Account Page Tab / Menu
 * @since 1.0.0
 */


// 1. Register a new endpoint for the WooComerce My Account page
// Info: Press the Save Button in the WordPress - Permalinks Config or it will gives a 404 error

function hnp_woo_custom_tab_endpoint() {
    add_rewrite_endpoint( 'hnp-tab', EP_ROOT | EP_PAGES );
}
  
add_action( 'init', 'hnp_woo_custom_tab_endpoint' );
  

// 2. Add new query variables
  
function hnp_woo_custom_tab_vars( $vars ) {
    $vars[] = 'hnp-tab';
    return $vars;
}
  
add_filter( 'query_vars', 'hnp_woo_custom_tab_vars', 0 );
  

// 3. Insert the endpoint into the My Account Tabs
  
function hnp_woo_custom_tab_account_link( $items ) {
    $items['hnp-tab'] = 'Custom-Tab';
    return $items;
}
  
add_filter( 'woocommerce_account_menu_items', 'hnp_woo_custom_tab_account_link' );
  

// 4. Add content for the tab
  
function hnp_woo_custom_tab_account_content() {
   header("Location: https://google.de");
die();
}
  
add_action( 'woocommerce_account_hnp-tab_endpoint', 'hnp_woo_custom_tab_account_content' );

Hierbei eine Code-Version der, anstatt einer Weiterleitung, neuen Content hinzufügt:

/**
 * WooCommerce Custom Account Page Tab / Menu
 * @since 1.0.0
 */


// 1. Register a new endpoint for the WooComerce My Account page
// Info: Press the Save Button in the WordPress - Permalinks Config or it will gives a 404 error

function hnp_woo_custom_tab_endpoint() {
    add_rewrite_endpoint( 'hnp-tab', EP_ROOT | EP_PAGES );
}
  
add_action( 'init', 'hnp_woo_custom_tab_endpoint' );
  

// 2. Add new query variables
  
function hnp_woo_custom_tab_vars( $vars ) {
    $vars[] = 'hnp-tab';
    return $vars;
}
  
add_filter( 'query_vars', 'hnp_woo_custom_tab_vars', 0 );
  

// 3. Insert the endpoint into the My Account Tabs
  
function hnp_woo_custom_tab_account_link( $items ) {
    $items['hnp-tab'] = 'Custom-Tab';
    return $items;
}
  
add_filter( 'woocommerce_account_menu_items', 'hnp_woo_custom_tab_account_link' );
  

// 4. Add content for the tab
  
function hnp_woo_custom_tab_account_content() {
   echo '<h3>The Custom HNP-Tab</h3><p>Here comes a custom Text.</p>';
   echo do_shortcode( ' /* shortcode here */ ' );
}
  
add_action( 'woocommerce_account_hnp-tab_endpoint', 'hnp_woo_custom_tab_account_content' );

Sie möchten Ihren eigenen Onlineshop? MEHR INFORMATIONEN