Add custom endpoint to woocommerce "My account" tabs

Question

i'm trying to add a custom endpoint to the "My Account" section, to show the wishlists (generated by Yith's plugin). I've followed the following tutorial, but for some reason i end up with the tab on the left side just like i want, but then if i click it i get redirected to the wishlist page instead of having the content display on the right side like the other tabs do.

I think i have tried any code that was suggested here on stackoverflow in similar threads, but to no avail.

Heres everything i've ried so far:

// ------------------
// 1. Register new endpoint (URL) for My Account page
// Note: Re-save Permalinks or it will give 404 error
  
function bbloomer_add_premium_support_endpoint() {
    add_rewrite_endpoint( 'wishlist', EP_ROOT | EP_PAGES );
}
  
add_action( 'init', 'bbloomer_add_premium_support_endpoint' );
  
// ------------------
// 2. Add new query var
  
function bbloomer_premium_support_query_vars( $vars ) {
    $vars[] = 'premium-support';
    return $vars;
}
  
add_filter( 'query_vars', 'bbloomer_premium_support_query_vars', 0 );
  
// ------------------
// 3. Insert the new endpoint into the My Account menu
  
function bbloomer_add_premium_support_link_my_account( $items ) {
    $items['wishlist'] = 'Wishlist';
    return $items;
}
  
add_filter( 'woocommerce_account_menu_items', 'bbloomer_add_premium_support_link_my_account' );
  
// ------------------
// 4. Add content to the new tab
  
function bbloomer_premium_support_content() {
   echo '<h3>Wishlist</h3>';
   echo do_shortcode( ' [yith_wcwl_wishlist] ' );
}
  
add_action( 'woocommerce_account_premium-support_endpoint', 'bbloomer_premium_support_content' );
// Note: add_action must follow 'woocommerce_account_{your-endpoint-slug}_endpoint' format


\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\


/* Insert the new endpoint into the My Account menu.  @param array $items @return array */
function my_custom_my_account_menu_items( $items ) {
    // Remove the logout menu item.
    $logout = $items['customer-logout'];
    unset( $items['customer-logout'] );

    // Insert your custom endpoint.
    $items['wishlist'] = __( 'Wishlist', 'woocommerce' );

    // Insert back the logout item.
    $items['customer-logout'] = $logout;

    return $items;
}

add_filter( 'woocommerce_account_menu_items', 'my_custom_my_account_menu_items' );

function my_custom_endpoint_content() {
    echo do_shortcode( ' [yith_wcwl_wishlist] ' );
}

add_action( 'woocommerce_account_my-custom-endpoint_endpoint', 'my_custom_endpoint_content' );


\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\


/* hook wishlist in my account */
add_filter('woocommerce_account_menu_items', function($items) {
    $logout = $items['customer-logout'];
    unset($items['customer-logout']);
    $items['wishlist'] = __('Wishlist', 'txtdomain');
    $items['customer-logout'] = $logout;
    return $items;
});

add_action('woocommerce_account_license-keys_endpoint', function() {
    echo do_shortcode( ' [yith_wcwl_wishlist] ' );
});

please note, i've tried these snippets on different times, ofc not all at once, the "\" lines are to mark the end of a snippet.

You should provide the details of what you've tried, and the result. — Matts, Nov 29 '21 at 09:45
Follow this how to create custom endpoint (you may want to remove default wishlist endpoint) - https://stackoverflow.com/a/38056768/13378498 . In your endpoint call your shortcode https://docs.yithemes.com/yith-woocommerce-wishlist/free-settings/shortcodes/ — Snuffy, Nov 29 '21 at 09:58
not really php-savy here, just at the beginning... should i create "special-page.php" (ofc changing naming to my will) and call the shortcode there? — 94a94, Nov 29 '21 at 10:01

score 0 · Answer 1 · answered Nov 29 '21 at 23:49

Modify the first snippet you have to change functions from premium_support to wishlist and add to your site with the Code Snippets plugin.

// 1. Register new endpoint to use for My Account page
// Note: Resave Permalinks or it will give 404 error

function bbloomer_add_wishlist_endpoint() {
add_rewrite_endpoint( 'wishlist', EP_ROOT | EP_PAGES );
}

add_action( 'init', 'bbloomer_add_wishlist_endpoint' );


// ------------------
// 2. Add new query var

function bbloomer_wishlist_query_vars( $vars ) {
$vars[] = 'wishlist';
return $vars;
}

add_filter( 'query_vars', 'bbloomer_wishlist_query_vars', 0 );


// ------------------
// 3. Insert the new endpoint into the My Account menu

function bbloomer_add_wishlist_link_my_account( $items ) {
$items['wishlist'] = 'Wishlist';
return $items;
}

add_filter( 'woocommerce_account_menu_items', 
'bbloomer_add_wishlist_link_my_account' );


 // ------------------
// 4. Add content to the new endpoint

function bbloomer_wishlist_content() {
echo do_shortcode( ' [yith_wcwl_wishlist] ' );
}

add_action( 'woocommerce_account_wishlist_endpoint', 'bbloomer_wishlist_content' );
// Note: add_action must follow 'woocommerce_account_{your-endpoint-slug}_endpoint' format

Add custom endpoint to woocommerce "My account" tabs

1 Answers1