Home » WooCommerce: Reorder My Account Tabs

WooCommerce: Reorder My Account Tabs

by Tutor Aspire

When you add a custom My Account tab, or when you’re not happy with the default My Account tabs order (Dashboard – Orders – Downloads – Addresses – Payment methods – Account details – Logout), you may need to change things around.

Here are two super simple snippets to achieve just that: reorder the My Account tabs, so your customers never miss that super important My Account section. Enjoy!

Here’s a quick screenshot to display how I was able to move the “Orders” tab from its original position to below the “Downloads” tab (snippet 1).

PHP Snippet 1: Move Single Tab @ My Account

This is the easiest, and cleanest, WooCommerce customization. Once you take a look at Snippet 2 you will understand why.

In this case scenario we want to place “Orders” between “Downloads” and “Addresses”: we use array_slice() to split the existing array of tabs in two parts, insert our tab in a specific position, and merge.

/**
 * @snippet       Move one tab @ My Account
 * @how-to        Get tutoraspire.com FREE
 * @author        Tutor Aspire
 * @compatible    WooCommerce 6
 * @donate $9     https://www.tutoraspire.com
 */

add_filter( 'woocommerce_account_menu_items', 'tutoraspire_add_link_my_account' );

function tutoraspire_add_link_my_account( $items ) {
$save_for_later = array( 'orders' => __( 'Orders', 'woocommerce' ) ); // SAVE TAB
unset( $items['orders'] ); // REMOVE TAB
$items = array_merge( array_slice( $items, 0, 2 ), $save_for_later, array_slice( $items, 2 ) ); // PLACE TAB AFTER POSITION 2
return $items;
}

PHP Snippet 2: Reorder Multiple Tabs @ My Account

When you need to rearrange the whole My Account tab menu, slicing the array to place a tab in between is not sufficient any longer. You must redefine the whole array with a custom order, and return it back.

The default array is this:

$items = array(
'dashboard'       => __( 'Dashboard', 'woocommerce' ),
'orders'          => __( 'Orders', 'woocommerce' ),
'downloads'       => __( 'Downloads', 'woocommerce' ),
'edit-address'    => _n( 'Addresses', 'Address', (int) wc_shipping_enabled(), 'woocommerce' ),
'payment-methods' => __( 'Payment methods', 'woocommerce' ),
'edit-account'    => __( 'Account details', 'woocommerce' ),
'customer-logout' => __( 'Logout', 'woocommerce' ),
);

So, in this snippet, we’re simply using a similar array, just with a custom sorting:

/**
 * @snippet       Reorder tabs @ My Account
 * @how-to        Get tutoraspire.com FREE
 * @author        Tutor Aspire
 * @compatible    WooCommerce 6
 * @donate $9     https://www.tutoraspire.com
 */

add_filter( 'woocommerce_account_menu_items', 'tutoraspire_add_link_my_account' );

function tutoraspire_add_link_my_account( $items ) {
$newitems = array(
'dashboard'       => __( 'Dashboard', 'woocommerce' ),
'customer-logout' => __( 'Logout', 'woocommerce' ),
'edit-address'    => _n( 'Addresses', 'Address', (int) wc_shipping_enabled(), 'woocommerce' ),
'edit-account'    => __( 'Account details', 'woocommerce' ),
'orders'          => __( 'Orders', 'woocommerce' ),
'downloads'       => __( 'Downloads', 'woocommerce' ),
'payment-methods' => __( 'Payment methods', 'woocommerce' ),
);
return $newitems;
}

You may also like