WooCommerce Visual Hook Guide: My Account Pages

Hey WooCustomizers, the Visual Hook Guide is back 🙂

In this episode, I’ve created a visual HTML hook guide for the WooCommerce Account Pages (there are multiple pages such as the My Account as logged in user, My Account as logged out, etc). This visual guide belongs to my “Visual Hook Guide Series“, that I’ve put together so that you can find WooCommerce hooks quickly and easily by seeing their actual locations – and you can also copy & paste in seconds unlike other “hook sniffer plugins” out there. Let me know in the comments what you think about this resource!

Enjoy!

WooCommerce My Account Page – User Logged Out – Login/Register Page [Visual Hook Guide]

My Account

woocommerce_before_customer_login_form

Login

Register

woocommerce_after_customer_login_form

WooCommerce My Account Page – User Logged In – Dashboard [Visual Hook Guide]

My Account

woocommerce_account_content

Hello Rodolfo (not Rodolfo? Sign out)

From your account dashboard you can view your recent orders, manage your shipping and billing addresses and edit your password and account details.

woocommerce_account_dashboard

WooCommerce My Account Page – User Logged In – Orders [Visual Hook Guide]

Orders

woocommerce_account_contentwoocommerce_before_account_orders (param: $has_orders)

Order	Date	Status	Total
#501	February 27, 2017	On Hold	€22.00 for 2 items	View Download invoice (PDF)
#500	February 27, 2017	On Hold	€32.06 for 2 items	View Download invoice (PDF)
#499	February 27, 2017	On Hold	€32.06 for 2 items	View Download invoice (PDF)
#466	February 21, 2017	On Hold	€32.06 for 1 item	View Download invoice (PDF)
#465	February 21, 2017	On Hold	€32.06 for 1 item	View Download invoice (PDF)
#464	February 21, 2017	On Hold	€32.06 for 1 item	View Download invoice (PDF)
#463	February 21, 2017	On Hold	€32.06 for 1 item	View Download invoice (PDF)
#462	February 21, 2017	On Hold	€32.06 for 1 item	View Download invoice (PDF)
#461	February 21, 2017	On Hold	€32.06 for 1 item	View Download invoice (PDF)
#460	February 21, 2017	On Hold	€32.06 for 1 item	View Download invoice (PDF)

woocommerce_before_account_orders_pagination

woocommerce_after_account_orders (param: $has_orders)

WooCommerce My Account Page – User Logged In – Downloads [Visual Hook Guide]

Downloads

woocommerce_account_contentwoocommerce_before_account_downloads (param: $has_downloads)

woocommerce_before_available_downloads

File	Remaining	Expires
Download – Test	∞	Never	Download

woocommerce_after_available_downloads

woocommerce_after_account_downloads

WooCommerce My Account Page – User Logged In – Addresses [Visual Hook Guide]

Addresses

woocommerce_account_contentwoocommerce_before_edit_account_address_form

The following addresses will be used on the checkout page by default.

Billing Address

Edit

Hello This
Is
Main
Street, CA 32444
United States (US)

Shipping Address

Edit

Hello This
Is
Main
Street, CA 32444
United States (US)

woocommerce_after_edit_account_address_form

WooCommerce My Account Page – User Logged In – Edit Address [Visual Hook Guide]

Addresses

woocommerce_account_contentwoocommerce_before_edit_account_address_form

woocommerce_after_edit_account_address_form

WooCommerce My Account Page – User Logged In – Payment Methods [Visual Hook Guide]

Payment Methods

woocommerce_account_contentwoocommerce_before_account_payment_methods (param: $has_methods)

Method	Expires
Visa ending in 4242	12/22	Delete

woocommerce_after_account_payment_methods (param: $has_methods)

Add Payment Method

WooCommerce My Account Page – User Logged In – Account Details [Visual Hook Guide]

Account Details

woocommerce_account_contentwoocommerce_before_edit_account_form

woocommerce_after_edit_account_form

95 thoughts on “WooCommerce Visual Hook Guide: My Account Pages”

Dominik
September 13, 2024

Wow, this is super helpful! I always struggled to figure out which hooks go where on the WooCommerce account pages, but this visual guide clears everything up. Thanks for breaking it down so clearly – definitely bookmarking this for future projects. Awesome job!

Reply
1. Rodolfo Melogli
  October 11, 2024
  
  Cheers!
  
  Reply
macse
September 4, 2024

is there any hook for Order Detail page?

Reply
1. Rodolfo Melogli
  October 11, 2024
  For the “View Order” page you mean? If yes:
  
  do_action( 'woocommerce_view_order', $order_id );
  Reply
nikhilesh
August 13, 2024

Great Site with lots of info

Hi I am looking to display the edit_account endpoint only when the user clicks on edit profile else it should display the entire profile as read only. ( The password fields are to be hide)

And I want to merge edit_account and edit_address endpoints to display only in one view when the user tries to edit the profile. And there it should have only one save changes button.

I have tried your hook but the edit_address is showing after the save changes button of edit_account endpoint.

Reply
1. Rodolfo Melogli
  August 13, 2024
  
  Nikhilesh, 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
Stephen Lav
February 18, 2023

Hi Rodolfo, I really appreciate your helpful guide.

I have a login page I would like to find the hook for which is the “Pay for Order” login page which shows for customers to login to pay for manually created woocommerce orders.

Reply
1. Stephen Lav
  February 18, 2023
  
  Actually I’ve used your snippet from below to bypass the login page.
  Much appreciated thanks.
  
  https://www.businessbloomer.com/woocommerce-allow-to-pay-for-order-without-login/
  
  Reply
  1. Rodolfo Melogli
    February 28, 2023
    
    Cool!
    
    Reply
Allan
October 27, 2022
This is great!
I have used your hooks in the past and they are such a great resource. Now I have challenge where i want to remove/add some fields in the editing of Billing Address. So the hook I want to use is woocommerce_before_edit_address_form_{$load_address}. But this doesn’t seem like the ordinary declaration with the {$load_address}. Right now I have declared it like this:
```
add_action('woocommerce_before_edit_address_form_(load_address)','dyc_before_edit_billing_address');
```
which is obviously wrong as it doesn’t get called. Could you shine some light on this?
Reply
1. Allan
  October 27, 2022
  Ah, tried this which worked.
  
  add_action('woocommerce_before_edit_address_form_billing','dyc_before_edit_billing_address');
  
  .
  The $load_address was just a string variable depending on if the billing or shipping form was loaded.
  Reply
  1. Rodolfo Melogli
    November 13, 2022
    
    Exactly, well done!
    
    Reply
Artin
November 10, 2021

Very helpful. I’ve used your WooCommerce solutions many times!

Reply
1. Rodolfo Melogli
  November 29, 2021
  
  Thanks!
  
  Reply
Hafiz Hamza
October 22, 2021

very informative I highly recommended this.

Reply
1. Rodolfo Melogli
  October 27, 2021
  
  Cheers
  
  Reply
Christopher
October 1, 2021

This is such a great article. I was struggling with the My Account page for months. Trying different things, wondering how the page worked with the logged-in, logged-out, separate login from register, add custom registration fields, customise the My Account logged-in page to make it look better, etc. I was always looking for a visual guide in order to understand how this page works. Now I finally did and I am so thankful for this post. Great stuff

Reply
1. Rodolfo Melogli
  October 12, 2021
  
  Thank you!
  
  Reply
Daniel
April 26, 2021

Hello! Great article, very useful. For some reason the “woocommerce_account_content” is displaying in the same place where the “woocommerce_account_dashboard” is (below the welcome text). Has it changed? Please help. Thank you.

Reply
1. Rodolfo Melogli
  June 1, 2021
  
  Hi Daniel, you can try using a low priority (watch the free tutorials) and hopefully in that case you can show something before the welcome text. Let me know!
  
  Reply
Ritika
March 23, 2021

Hi Rodolfo

This article is just amazing. Thank you for sharing your knowledge with us.
I am just looking for a way to change the View button styling under orders using some hook.
is this possible?

Reply
1. Rodolfo Melogli
  April 19, 2021
  
  Cheers! No, styling = CSS and not PHP
  
  Reply
Zshandi
December 14, 2020

Hello,

I am wonering if you have something similar to this but for Woocommerce Memberships? I am trying to add an action to my memberships management tab, just a button with a link in the actions column. I’ve tried using the action ‘wc_memberships_my_memberships_column_membership-actions’, but it doesn’t seem to do anything.

Any help is greatly appreciated.

Reply
1. Rodolfo Melogli
  December 16, 2020
  
  Nope, sorry
  
  Reply
Isaac
November 10, 2020

Hi Rodolfo,

Thanks for helping us out. I would like to add a custom tab/field in my account page which I can connect/sync to google worksheet for data value. Is this doable in woocommerce? Is there a plugin there for this purpose?

Many thanks for your help.

Cheers,

Isaac

Reply
1. Rodolfo Melogli
  November 25, 2020
  
  Hi Isaac, 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
Ineke Huibregtse
September 14, 2020

Hello Rodolfo,
Your website has saved me so many times, that I’m definitely going to subscribe to CustomizeWoo soon. 🙂
Just one remark/question about the visual guide. When I use the hook ‘woocommerce_before_account_navigation’, things end up underneath the page title, but above everything else. So, not in the left hand column, but full width, forcing down the rest of the content. Any thoughts on that?
I’m trying to avoid adjusting template files as much as possible.
Best regards!
Ineke

Reply
1. Rodolfo Melogli
  September 21, 2020
  
  Thank you Ineke. You probably need a bit of CSS as well in this case
  
  Reply
tyler
September 8, 2020

Hey Rodolfo, thanks for another super-helpful visual hook guide! Question: what about the “view order” page? Specifically, the page that has an endpoint like “/my-account/view-order/12345/”

Thanks!

Reply
1. Rodolfo Melogli
  September 10, 2020
  
  Good point. You can find hooks for that template under woocommerce/templates/my-account/view-order.php
  
  Reply
Joe
July 7, 2020

Hi Rodolfo

I kind of lost. How can I have a register form+dashboard etc ? all the combination for a new and regular client ? Meaning exactly what you show on that page

I can’t succeed with that

Reply
1. Rodolfo Melogli
  July 20, 2020
  
  The default WooCommerce “my account” shortcode does just that
  
  Reply
Evan
May 5, 2020

Hi Rodolfo

Do you have any articles on getting the Woocommerce login error message to show?
Or how to control it? The storefront theme does not show an error message when a user
adds an incorrect username or password. It just reloads the page. Any idea what could be causing this?

Thanks in advance

Reply
1. Rodolfo Melogli
  May 13, 2020
  
  To troubleshoot, disable all plugins but WooCommerce and also switch temporarily to “Twentyseventeen” theme – does it work? If yes, you have a problem with your current theme or one of the plugins.
  
  Reply
Vic
May 3, 2020

This was helpful. Thank you Rodolfo.

Reply
1. Rodolfo Melogli
  May 13, 2020
  
  Great!
  
  Reply
Phil
May 3, 2020

You have hook references including: woocommerce_before_edit_account_address_form. Is there an available before and after hook for the subscriptions page?

Reply
1. Rodolfo Melogli
  May 13, 2020
  
  Hi Phil, search for “add_action” calls through the subscription plugin files
  
  Reply
  1. Andrew Schultz
    October 21, 2020
    
    In this scenario I think you are better off editing this WooCommerce subscriptions template file
    
    woocommerce-subscriptions\templates\myaccount\view-subscription.php
    
    Reply
    1. Alexanne L.
      January 17, 2022
      
      Here are the 3 options you have for the «Subscriptions» tab in My account page :
      
      add_action( 'woocommerce_subscription_details_table', 'your_function' ); add_action( 'woocommerce_subscription_totals_table', 'your_function' ); add_action( 'woocommerce_subscription_details_after_subscription_table', 'your_function' );
      
      Reply
      1. Rodolfo Melogli
        February 14, 2022
        
        Awesome
        
        Reply
Robert
April 26, 2020

Hi Rodolfo,

Thanks for this excellent blog.
How do I change My Account to display dropdown instead of a menu page?
Any help would be truly appreciated, thanks!

Robert

Reply
1. Rodolfo Melogli
  April 29, 2020
  
  Hi Robert, 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
Aleksander
April 21, 2020

You can change the name of the field on the page:
my-account / edit-account /
my-account / edit-address / billing /
thanks

Reply
1. Rodolfo Melogli
  April 21, 2020
  
  Is that a question? 🙂
  
  Reply
  1. Aleksander
    April 22, 2020
    
    Thanks for the answer, I decided))
    
    Reply
Seoit
December 26, 2019

Thank you for this awesome article.
It will be usefull in my work!

Reply
1. Rodolfo Melogli
  January 6, 2020
  
  Welcome!
  
  Reply
Ming
November 18, 2019

Hello Rodolfo~ How do I move the My Account title (text wrapped in .entry-header) inside the .woocommerce-MyAccount-content div using hook? 🙂

Reply
1. Rodolfo Melogli
  November 19, 2019
  
  Hello Ming, 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
elsy
May 12, 2019

Hello, I’m currently experiencing a very complicated problem and maybe you have the answers that I’m looking for. The My-Account Navigation Menu in Storefront is appearing to the right side instead to the left side like all the menus around the world. I think that that was after update the theme, because I didn’t do any other thing in this section. I didn’t install any plugin related or something similar. And I didn’t insert any code to my theme or nothing. I’ve also switched to others themes and all themes have the My-Account Nav Menu to the LEFT SIDE. I’ve also cloned my website (before this problem arrive) in order to make tests in one of these versions. But both have exactly the same problem right now.

I’ve wrote to the Storefront support, but I didn’t receive any answers yet.
I’ll really appreciate if you can help me or give some answer or clue to solve this big issue, because I don’t have programming skills.. Thank you for your time!

Elsy

Reply
1. Rodolfo Melogli
  May 16, 2019
  
  Hello Elsy, 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
Ali
February 10, 2019

Hi,
All i need to do is to add one custom link inside my account page only when they logged-in can see the link. And my link is a button. what should I add to my function.php?

Reply
1. Rodolfo Melogli
  February 14, 2019
  
  Hello Ali, thanks so much for your comment! Yes, this is possible – 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
kyle
November 19, 2018

Thank you very much for making the hooks visual. Helped me out a lot to figure which ones i needed and where they are going to be placed on the page

Reply
1. Rodolfo Melogli
  November 26, 2018
  
  Great 🙂
  
  Reply
Abhi Kumar
October 23, 2018

“From your account dashboard you can view your recent orders, manage your shipping and billing addresses and edit your password and account details.”

Sir, How to edit this line? Or how to remove this line ?

Please help me……

Reply
1. Rodolfo Melogli
  October 30, 2018
  
  Hey Abhi, thanks for your comment! It’s a WooCommerce string, so you can translate it: https://businessbloomer.com/translate-single-string-woocommerce-wordpress/. Hope this helps!
  
  Reply
Robert
September 17, 2018

I was looking for it! Thank you very much for your time and knowledge 😉

Reply
1. Rodolfo Melogli
  September 20, 2018
  
  Thanks Robert 🙂
  
  Reply
Stonez
July 22, 2018

Hi,
I want to omit “last_name” in the Account Details page.

I already use a plugin “WooCommerce Checkout Field Editor” to hide this field on Account Details page.
However, when I clicked submit, then I got an error “last_name is required”.

How do I make “last_name” not required?

Reply
1. Rodolfo Melogli
  July 26, 2018
  
  Hey Stonez, 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
Roman
June 29, 2018

Hey, what is hook for single order preview ?

Reply
1. Rodolfo Melogli
  July 4, 2018
  Hey Roman, you’re right, in here there is no section for the “View Order” hooks. Good news is, there is only one:
  
  do_action( 'woocommerce_view_order', $order_id );
  
  Hope this helps 🙂
  Reply
Kristen
June 19, 2018

How do i put these codes in to make them active on my pages?

Reply
1. Rodolfo Melogli
  June 26, 2018
  
  Hello Kristen. You can place this in your child theme’s functions.php file – if you need more guidance, please take a look at this video tutorial: https://businessbloomer.com/woocommerce-customization-hangout/. Hope this helps!
  
  Reply
Andy
May 20, 2018

Hey Rodolfo, thank you so much for this great resource.

If you are still updating the post, may I suggest include the woocommerce_account_menu_items filter hook to add navigation items. It’s what I was looking for.

Either way, bookmarked! Thanks again.

Best,

Andy

Reply
1. Rodolfo Melogli
  May 21, 2018
  
  Hey Andy, thanks for your comment! This visual hook guide is for add_action only and not add_filter. One day I will do one for filters as well 🙂
  
  Reply
Arash Safari
March 29, 2018

Thank you for your awesome, neat and useful work.

Reply
1. Rodolfo Melogli
  March 30, 2018
  
  Cheers 🙂
  
  Reply
Pelle
March 20, 2018

How do I show “you are logged in as + username/email on top bar(top menu) or header menu? when I logged in from checkout page

Reply
1. Rodolfo Melogli
  March 24, 2018
  
  Hello Pelle, 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
Keely Worth
February 26, 2018

Great site 🙂

How do I change the text “No order has been made yet.” on the Account Orders page other than copying the orders.php template to my child theme?

Thanks

Reply
1. Rodolfo Melogli
  February 26, 2018
  
  Thank you Keely 🙂 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
Aky
November 2, 2017

I see how to add the product image to the email, but how would one add a product image to the order details page? I don’t actually see a hook for that?

Please let me know if you can you help?

Reply
1. Rodolfo Melogli
  November 3, 2017
  
  Hey Aki, thanks so much for your comment! Is this in the WordPress Dashboard > WooCommerce > Orders > Single Order?
  
  Reply
Arie
September 6, 2017

Thank you very much for sharing.. but i dont see the code

Reply
1. Rodolfo Melogli
  September 11, 2017
  
  Arie, thanks for your comment! Which code are you referring to?
  
  Reply
Rizki Pratama
July 27, 2017

Hi.

I found this visual very helpful for me.
But I think you miss a page here, that is Order Detail (which goes by URL /my-account/view-order/{id}/).
Can you please update the article to include visual hook guide for Order Detail page?

Thanks.

Reply
1. Rodolfo Melogli
  September 4, 2017
  
  Thanks Rizki, I’ll see what I can do 🙂
  
  Reply
2. Jerina
  March 15, 2018
  
  Hi, I’m searching for the same too
  
  Reply
xuxu
June 12, 2017

Nice work \o/

Added to bkm 🙂

Reply
1. Rodolfo Melogli
  June 15, 2017
  
  Thanks!
  
  Reply
Alain
January 5, 2017

Hi
I guess that couple of these maps are changed in the current version of WC. Isn’t ?
Alain

Reply
1. Rodolfo Melogli
  January 5, 2017
  
  Yes Alain, you’re right, I totally forgot to update this tutorial! I will put this on my urgent to-do list 🙂
  
  Reply
  1. Rodolfo Melogli
    April 18, 2017
    
    The updated hooks are live now 🙂
    
    Reply
Frederic
September 29, 2016

Hi,

Thank you very much for sharing your knowledge:)
I am using woocommerce 2.6, could you please tell me if this hooks are still valide?
Could you please tell me how I can add the reorder button in my account page please?

Thank you
Fred

Reply
1. Rodolfo Melogli
  September 29, 2016
  
  Fred, thanks for your comment! And yes, you’re right – this visual guide is a little out of date and it’s prior to 2.6. Sorry 🙂 I will make sure to revise this resource as soon as possible. Cheers!
  
  Reply
  1. Rodolfo Melogli
    April 18, 2017
    
    Updated hooks are now live 🙂
    
    Reply
Mark
August 25, 2016

Hey Rodolfo

Hope all good with you.

Can you tell me if you’ve covered anywhere how to remove items from the My Account menu?

Basically I want to REMOVE the link to Dashboard (I can’t understand why it’s even there because it seems to go to the same page!), the Account Details link (for logged in users) – I’m using a separate plugin to provide a much nicer visual of the clients profile. I also want to edit the text that shows up:

| From your account dashboard you can view your recent orders, manage your shipping and billing addresses and edit your password and account details. |

I don’t want to let them do anything other than view orders via Woo

I’m sure this should be relatively easy to edit but I’m going round in circles – AGAIN!!!

Reply
1. Rodolfo Melogli
  August 25, 2016
  
  Hello Mark, thanks a lot for your comment! I’m not sure what you mean here – can you maybe add a link to a screenshot to show exactly what you need? Cheers 🙂
  
  Reply
  1. Mark
    August 25, 2016
    
    Hi Rodolfo
    
    Here’s an annotated screenshot of the My Account page
    
    https://screencast.com/t/mqWxAfuVKGnu
    
    Thanks
    
    Reply
    1. Rodolfo Melogli
      August 25, 2016
      
      Excellent, thanks for that! I think that “navigation” is a new thing since WooCommerce 2.6, it didn’t use to be like that.
      
      So, I did a little search through the “/templates” folder in WooCommerce and found this file: woocommerce\templates\myaccount\navigation.php. That manages that navigation menu you get in your account and unfortunately there is no “apply_filters” that allow you to tweak that template without overriding it. You should therefore follow WooCommerce guidelines to override the template file: https://docs.woocommerce.com/document/template-structure/
      
      In regard to the “From your account dashboard…” you find this here: woocommerce\templates\myaccount\dashboard.php and should do the exact same thing as above. Again, no filter offered by WooCommerce in this case.
      
      Hope this helps!
      
      Reply
      1. Mark
        August 25, 2016
        
        Thanks Rodolfo
        
        Didn’t see this until late. will see what I can do over weekend and update you with outcome
        
        Reply
        
        Rodolfo Melogli
        August 26, 2016
        
        Cool!
        
        Reply

Questions? Feedback? Customization? Leave your comment now!
_____

If you are writing code, please wrap it like so: [php]code_here[/php]. Failure to complying with this, as well as going off topic or not using the English language will result in comment disapproval. 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 the Business Bloomer Club to get quick WooCommerce support. Thank you!