Business Bloomer
  • About
  • WooCommerce Blog
  • Online Courses
  • Login
  • 0
  • About
  • WooCommerce Blog
  • Online Courses
  • Login
  • 0

WooCommerce: How to Merge My Account Tabs

> Published: Feb 2018 - Revised: Mar 2021
> Blog Category: WooCommerce Tips
> Blog Tags: My Account
> Blog Comments: 29 Comments
Tweet

Join 15,000+ WooWeekly subscribers

The default WooCommerce My Account tabs are many. Sometimes, they’re too many. In this post, we will see how to “merge” two tabs into a single one.

For example, how can we move the content of the “Edit Address” tab into the “Edit Account” tab – and save users some navigation time?

WooCommerce: merge two “My Account” tabs

PHP Snippet: Merge Two My Account Tabs @ WooCommerce My Account Page

Merging two tabs means hiding a tab, and after that moving its content to another tab. Super easy, and you can apply this to any tab, as long as you change the snippet below with the correct name of the tabs (or endpoints, like WooCommerce calls them).

/**
* @snippet       Merge Two "My Account" Tabs @ WooCommerce Account
* @how-to        Get CustomizeWoo.com FREE
* @author        Rodolfo Melogli
* @compatible    WooCommerce 5.0
* @donate $9     https://businessbloomer.com/bloomer-armada/
*/

// -------------------------------
// 1. First, hide the tab that needs to be merged/moved (edit-address in this case)

add_filter( 'woocommerce_account_menu_items', 'bbloomer_remove_address_my_account', 999 );

function bbloomer_remove_address_my_account( $items ) {
   unset( $items['edit-address'] );
   return $items;
}

// -------------------------------
// 2. Second, print the ex tab content (woocommerce_account_edit_address) into an existing tab (woocommerce_account_edit-account_endpoint). See notes below!

add_action( 'woocommerce_account_edit-account_endpoint', 'woocommerce_account_edit_address' );

// NOTES
// 1. to select a given tab, use 'woocommerce_account_ENDPOINTSLUG_endpoint' hook
// 2. to print a given tab content, use any of these:
// 'woocommerce_account_orders'
// 'woocommerce_account_view_order'
// 'woocommerce_account_downloads'
// 'woocommerce_account_edit_address'
// 'woocommerce_account_payment_methods'
// 'woocommerce_account_add_payment_method'
// 'woocommerce_account_edit_account'

Is There a (Reliable) Plugin For That?

If you’d love to code but don’t feel 100% confident with PHP, I decided to look for a reliable plugin that achieves the same result.

In this case, I recommend the YITH WooCommerce Customize My Account Page plugin. On top of merging My Account tabs, you can also move the tab menu around, customize the color scheme, add banners, set up reCaptcha on the register and login forms, sort, rename, delete tabs, conditionally show tabs to a given user role and much more.

But in case you hate plugins and wish to code (or wish to try that), then keep reading 🙂

Related posts:

  1. WooCommerce: Add New Tab @ My Account Page
  2. WooCommerce: Add First & Last Name to My Account Register Form
  3. WooCommerce: Hide or Rename a My Account Tab
  4. WooCommerce: Add Privacy Policy Consent @ My Account Registration
  5. WooCommerce: Separate Login and Registration Pages
  6. WooCommerce: Allow Users to Edit Processing Orders
  7. WooCommerce: Deny Automatic Login Upon Registration @ My Account
  8. WooCommerce: File Upload @ My Account Registration Form
  9. WooCommerce: Rename “My Account” If Logged Out @ Nav Menu
  10. WooCommerce: Add a Custom Download File @ My Account

Where to add this snippet?

You can place PHP snippets at the bottom of your child theme functions.php file (delete "?>" if you have it there). CSS, on the other hand, goes in your child theme style.css file. Make sure you know what you are doing when editing such files - if you need more guidance, please take a look at my free video tutorial "Where to Place WooCommerce Customization?"

Does this snippet (still) work?

Please let me know in the comments if everything worked as expected. I would be happy to revise the snippet if you report otherwise (please provide screenshots). I have tested this code with Storefront theme, the WooCommerce version listed above and a WordPress-friendly hosting on PHP 7.3.

If you think this code saved you time & money, feel free to join 14,000+ WooCommerce Weekly subscribers for blog post updates or 250+ Business Bloomer supporters for 365 days of WooCommerce benefits. Thank you in advance :)

Need Help with WooCommerce?

Check out these free video tutorials. You can learn how to customize WooCommerce without unnecessary plugins, how to properly configure the WooCommerce plugin settings and even how to master WooCommerce troubleshooting in case of a bug!

Rodolfo Melogli

Business Bloomer Founder

Author, WooCommerce expert and WordCamp speaker, Rodolfo has worked as an independent WooCommerce freelancer since 2011. His goal is to help entrepreneurs and developers overcome their WooCommerce nightmares. Rodolfo loves travelling, chasing tennis & soccer balls and, of course, wood fired oven pizza.

Follow @rmelogli
Category: WooCommerce Tips
Tag: My Account

Post navigation

Previous post: WooCommerce: Display Order Delivery Date @ Checkout
Next post: WooCommerce AMA with Rodolfo Melogli (Ask Me Anything Woo #1)

29 thoughts on “WooCommerce: How to Merge My Account Tabs”

  1. Avelin
    November 12, 2021

    Hello, how do i merge more than 2 tabs into one? I’m trying to merge both the payment-methods tab as well as the edit-address tab into the edit-account tab but can’t seem to figure out the code. Thanks!

    Reply
    1. Rodolfo Melogli
      November 29, 2021

      Hello Avelin thanks so much for your comment! Yes, this is definitely possible, but I’m afraid it’s custom work. If you’d like to get a quote, feel free to contact me here. Thanks a lot for your understanding!

      Reply
  2. Luke
    July 30, 2021

    I was just wondering if, rather than merging into the same endpoint, we move the menu options into a submenu for a parent endpoint.

    i.e.

    <li>Orders</li>
    <li>Account Details</li>
      <ul>
        <li>Payment Methods</li>
        <li>Addresses</li>
       ... etc
    
    Reply
    1. Rodolfo Melogli
      August 20, 2021

      I guess that’s an option as well. Will require some customization

      Reply
  3. Hasnain Mahar
    March 25, 2021

    What is 999 there and what about the word “bbloomer” you used in your code? What should I replace it with?

    Reply
    1. Rodolfo Melogli
      April 19, 2021

      I recommend to keep the 999 (priority) but you can change “bbloomer” to whatever you like

      Reply
  4. Phil
    March 11, 2021

    Using these actions/hooks, is it possible to actually add the billing and shipping forms in the account page? Rather than links to the edit billing/shipping, the actual forms are there?

    Reply
    1. Rodolfo Melogli
      March 22, 2021

      I’m pretty sure that’s possible!

      Reply
  5. Diego
    June 18, 2020

    Hi.
    Can I also merge Woocommerce Membership tabs? I want to move content to “MY ACCOUNT DETAILS” from “MANAGE” to display the membership details. But I can’t find the correct name for this last tab to complete the snippet.
    I would really appreciate your help!

    Reply
    1. Rodolfo Melogli
      June 28, 2020

      Hi Diego, thanks so much for your comment! Yes, this is definitely possible, but I’m afraid it’s custom work. If you’d like to get a quote, feel free to contact me here. Thanks a lot for your understanding!

      Reply
  6. Helene
    April 27, 2020

    Not sure what I am doing wrong, but when I add this snippet the whole side menu disappears :O I haven’t changed anything about it.

    Any ideas?

    Reply
    1. Rodolfo Melogli
      April 29, 2020

      Uhm, not sure. Tried also on Storefront theme or 2020?

      Reply
  7. Chemin
    April 9, 2020

    When I merge the address to edit-account tab, the content in address will be right below the content in edit-account, i.e. the fields to edit address will be below the save changes button which is in edit-account tab.
    It looks weird that after the save changes button, there is still fields to be edited.
    Any idea to organize the structure?

    Reply
    1. Rodolfo Melogli
      April 9, 2020

      Hi Chemin, you’ll need a bit of CSS for that

      Reply
  8. Aurélien
    November 26, 2019

    Great approach except that endpoint url will not follow your new rules. For instance, if you edit a payment method and validate the form and will redirect to the default endpoint and your custom will be lost in the navigation. I’m trying to change the URL too but it doesn’t seem to be posible.

    Reply
    1. Rodolfo Melogli
      November 27, 2019

      Good point – I’m sure there is a way to change redirect URL though

      Reply
    2. Miko
      December 12, 2019

      Hey Aurélien,
      I’ve overcome this problem – all you have to do is go setting and change the end points of each page. Everything seems to be working fine for me 🙂 good luck buddy, if you need help feel free to contact me

      Reply
  9. Busola Okeowo
    January 11, 2019

    hi i merged the dashboard tab and a custom tab i created. now i want to separate them. I removed this line of code below but it still wont be separated.

    add_action( 'woocommerce_account_dashboard_endpoint', 'woocommerce_account_customlink' );

    any ideas please?
    #BloomerArmada

    Reply
    1. Rodolfo Melogli
      January 18, 2019

      Hey Busola, thanks for your comment. Did you remove the first part of the snippet as well?

      Reply
  10. joshuaeverettdunn
    November 22, 2018

    Maybe you touched on this, but is there a reason why bbloomer is within the code?

    Reply
    1. Rodolfo Melogli
      November 26, 2018

      Hey Joshua, thanks for your comment! That’s how I name my PHP functions, you can use whatever name you like 🙂

      Reply
  11. ridzuan
    October 30, 2018

    hi Rodolfo, may i know is it possible to show edit-address form without clicking the edit. It means when i click address it will automatically allow user to edit their form.

    Reply
    1. Rodolfo Melogli
      October 30, 2018

      Hello there, thanks so much for your comment! Yes, this is possible – but unfortunately this is custom work and I cannot provide a complementary solution here via the blog comments. Thanks a lot for your understanding! ~R

      Reply
  12. Helms
    June 29, 2018

    Works great! In your example, how would you move the edit address output before the edit account form?

    Reply
    1. Rodolfo Melogli
      July 4, 2018

      Hey Helms, you could try taking a look at the plugins listed here: https://businessbloomer.com/woocommerce-how-to-customize-the-my-account-page/

      Reply
  13. Antonio
    June 14, 2018

    Hello,

    I’ve tried to change the endpoints but I actually cannot merge the Order tab into the Downloads one. Any suggestion?

    Thanks!
    Antonio

    Reply
    1. Rodolfo Melogli
      June 18, 2018

      Hey Antonio, thanks for your comment! You’ll need to find out the exact hook and functions of the tab you want to move, sorry but this is custom work 🙂

      Reply
  14. Sharon
    February 28, 2018

    This is fantastic, Rodolfo. Can’t wait to implement it! Thank you!!! 🙂

    Reply
    1. Rodolfo Melogli
      March 1, 2018

      Fantastic 🙂

      Reply
Questions? Feedback? Support? Leave your Comment Now!
_____

If you are writing code, please wrap it between shortcodes: [php]code_here[/php]. Failure to complying with this (as well as going off topic, not writing in English, etc.) will result in comment deletion. You should expect a reply in about 2 weeks - this is a popular blog but I need to get paid work done first. Please consider joining BloomerArmada to get blog comment reply priority, ask me 1-to-1 WooCommerce questions and enjoy many more perks. Thank you :)

Cancel reply

Your email address will not be published. Required fields are marked *

Recent Posts
  • WooCommerce: Switch Shop Columns Responsively
  • WooCommerce: The Need For Custom Order Tables
  • WooCommerce: Get List Of All Customers
  • WooCommerce: How To Enable Stripe Payments
  • WooCommerce: Order Again Button @ My Account > Orders
About Business Bloomer

With 100,000 (and growing) monthly organic sessions, Business Bloomer is the most consistent, most active and most complete WooCommerce development/customization blog.

Of course this website itself uses the WooCommerce plugin, the Storefront theme and runs on a WooCommerce-friendly hosting.

Join 150,000+ Monthly Readers & 14,000+ Subscribers.

Become a Business Bloomer Supporter.

Join BloomerArmada and become an Official Business Bloomer Supporter:
easy-peasy, and lots of perks for you.
See your Benefits →
Popular Searches: Visual Hook Guides - Checkout Page - Cart Page - Single Product Page - Add to Cart - Emails - Shipping - Prices - Hosting
Latest Articles
  • WooCommerce: Switch Shop Columns Responsively
  • WooCommerce: The Need For Custom Order Tables
  • WooCommerce: Get List Of All Customers
  • WooCommerce: How To Enable Stripe Payments
  • WooCommerce: Order Again Button @ My Account > Orders
Latest Comments
  • Rodolfo Melogli on WooCommerce: 10 Crucial Issues That Should Be Fixed Right Now
  • Rodolfo Melogli on WooCommerce: 10 Crucial Issues That Should Be Fixed Right Now
  • Telkom on WooCommerce: 10 Crucial Issues That Should Be Fixed Right Now
  • Tomás Testart on WooCommerce: 10 Crucial Issues That Should Be Fixed Right Now
Find Out More
  • Become a WooCommerce Expert
  • WooCommerce Blog
  • WooCommerce Online Courses
  • WooCommerce Weekly
  • Bloomer Armada
  • Affiliate Program
  • Contact
Contact Info

Ciao! I’m Rodolfo Melogli, an Italian Civil Engineer who has turned into an international WooCommerce expert. You can contact me here:

Email: [email protected]

Twitter: @rmelogli

Hire me by the hour: Get Quote »

VisaMastercardAmexPayPal Acceptance Mark
Business Bloomer © 2011-2022 - Terms of Use - Privacy Policy