Woocommerce My Account

Posted on  by 



Shows the ‘my account’ section where the customer can view past orders and update their information. You can specify the number of orders to show. By default, it’s set to 15 (use -1 to display all orders.).

  1. WooCommerce is developer friendly, too. Built with a REST API, WooCommerce is scalable and can integrate with virtually any service. Design a complex store from scratch, extend a store for a client, or simply add a single product to a WordPress site—your store, your way.
  2. This is where you set up options to manage accounts as well as privacy settings on your WooCommerce store. Navigate to WooCommerce Settings Accounts & Privacy.

The WooCommerce My Account pages feature a “left sidebar” navigation menu (by default, links are: “Dashboard”, “Orders”, “Downloads”, “Addresses”, “Account details”, “Logout”).

A cool (and easy) improvement may be moving such navigation to the top, and displaying it horizontally instead of vertically. You’d think this is a complex PHP customization… but you’ll feel great when you’ll notice you just need CSS for that.

Please note the CSS may change slightly based on your theme, in case it applies custom CSS to the default WooCommerce My Account navigation panel. I will list below a couple of solutions for default WooCommerce and for the Storefront theme, so at least you have an idea of what you could need in terms of tweaking it. Enjoy!

Woocommerce My Account

CSS Snippet (Default WooCommerce): Display My Account Navigation Menu Horizontally As Opposed to Vertically

Customize My Account For Woocommerce

First thing, we want to stretch the My Account navigation and the My Account tab content onto a full width on big devices (by default, WooCommerce already applies such rule for devices up to 768px):

Here’s the result:

Second, we need to center align the navigation menu (UL tag) and make its items move horizontally (LI tags):

CSS code, all together, so you can copy/paste:

CSS Snippet (Storefront Theme): Display My Account Navigation Menu Horizontally As Opposed to Vertically

Is There a (Reliable) Plugin For That?

Woocommerce My Account Plugin

If you’d love to code but don’t feel 100% confident with CSS, 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 changing the navigation menu layout, you can also customize the color scheme, add banners, set up reCaptcha on the register and login forms, add, sort, rename, delete and group 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:





Coments are closed
Re5r05a Small Paint Brushes For Walls