Here’s a collection of tips, snippets and articles to answer your biggest WooCommerce customization questions. You can use the search button above to refine your search, or alternatively click on one of these popular WooCommerce customization tags: Checkout page, Single product page, Cart page
You might also want to visualize the WooCommerce “hooks” in case you’re a little more familiar with coding – here’s the link to the popular “Visual Hook Guide Series“, where you can find all the WooCommerce PHP actions in a user-friendly way :)
If you wish to subscribe to our weekly WooCommerce email roundup, click here. Otherwise, enjoy the latest articles on this page!
If a WooCommerce product comes with weight and/or height / length / width values, these will be displayed by default in the Single Product page, under the “Additional Information” tab.
Should you need to hide them completely from the frontend while keeping the list of attributes below them, thankfully there’s a PHP one-liner you can use. Enjoy!
Continue reading WooCommerce: Hide Weight & Dimensions From Additional Information Tab @ Single Product
Since… today, Business Bloomer online courses are affordable for everyone.
It’s unfortunate that digital products (such as our WooCommerce online courses) are priced in USD dollars but there is no adjustment for less privileged countries.
This is a pity because content should be accessible to ALL WooCommerce developers around the world, no matter their income level. I receive dozens of emails per month from amazing people who can’t really afford a USD 397 course because they make that amount of money in 4 months if they’re lucky.
So, let’s change this. Here comes Purchasing Power Parity (PPP) to the rescue.
PPP is a special metric that tells us the real “purchasing power” of a given country. Take a basket of identical goods, pay in your local currency in your own country; purchase the same items in USD in the United States. Compare that difference to the actual exchange rate. Now you really have an idea of how much a country can afford to pay for that basket of goods.
Let’s talk in plain English. Are you from India? You may get up to 75% off our online courses. Are you from South Africa? Maybe a 59% discount! Are you from Argentina? 61% off on average. Are you from Norway? No discount, sorry (it seems you do better than the US). And so on…
In this post, I’ll go through a quick PPP math example to give you some context, and then I’ll tell you how I implemented PPP discounts in this same WooCommerce website.
Want to help me test the PPP discount functionality which is currently in beta? Add a course to cart e.g. CustomizeWoo PRO, select your billing country at checkout, and leave a comment below with the discount you got, if any.
Enjoy!
Continue reading WooCommerce: Purchasing Power Parity (PPP) Discounts
As you know, once you log in and go to My Account, WooCommerce displays the “Dashboard” tab content (also called the Dashboard “endpoint”). The Dashboard tab features the default “Hello Rodolfo Melogli (not Rodolfo Melogli? Log out) From your account dashboard you can view your recent orders, manage your shipping and billing addresses, and edit your password and account details.” message.
Now, what if we want to set another My Account tab as the default one upon login, for example the “Orders” one, or the “Downloads” one for a digital downloads WooCommerce business? Well, there are a couple of quick and not-so-quick solutions, enjoy!
Continue reading WooCommerce: Change Default My Account Tab
We covered a lot of WooCommerce Checkout customization in the past – it’s evident that the Checkout is the most important page of any WooCommerce website!
Today we’ll code a nice UX add-on: how do we show product quantity inputs beside each product in the Checkout order table? This is great if people need to adjust their quantities on the checkout before completing their order; also, it’s helpful when you have no Cart page and want to send people straight to Checkout and skip yet another click.
In this post, we’ll see how to add a quantity input beside each product on the Checkout page, and then we’ll code a “listener” to make sure we actually refresh the Checkout and update totals after a quantity change. Enjoy!
Continue reading WooCommerce: Change Product Quantity @ Checkout Page
This is an interesting WooCommerce customization – as you know WordPress menus and widgets read whatever product category name and display it in the frontend.
Let’s say your product category title is “Tables”. This will show up in the navigation menu if you have set it up that way, in te breadcrumbs if you have any, in the sidebar category widgets, and as a title on the single product category page.
This is great and all, but what if your product category name is “Red Round Tables By Whatever Brandname“? As you can imagine, displaying this in a sidebar or navigation menu may be a little too much, while it’s fine to use it as a H1 on the single product category page for SEO reasons and enhanced readability.
So, the question is – how do we define an “alternative” product category name, so that this can be used on the product category page as custom title, while using the default one for other smaller locations such as menus and widgets?
Well, this is how it’s done – enjoy!
Continue reading WooCommerce: Override Product Category Page Title
Ok, we all know that Stripe, PayPal and all successful online payment orders go to “processing” order status, BACS and cheque go to “on-hold”, and so on. Each payment gateway has its own default paid status.
Now, what if you use custom order statuses, or what if you wish to change Stripe orders to “completed”, BACS orders to “pending” and PayPal orders to “on-hold”? Thankfully, this is super easy with a handy PHP snippet. Enjoy!
Continue reading WooCommerce: Change Payment Gateway Order Status
We’ve already seen how to rename the “Place Order” button on the WooCommerce Checkout page, but today I want to find a way to rename it dynamically and conditionally i.e. based on the payment gateway that is selected while checking out.
The snippet requires the payment gateway “ID” – here’s a quick tut in case you don’t know how to retrieve that: How to Find WooCommerce Payment Gateway ID
Other than that, it’s pretty simple logic. Enjoy!
Continue reading WooCommerce: Rename “Place Order” Based on Chosen Payment Gateway
Ok, I may need an English language refresher… But the point I was trying to make was that yes, there is a way to switch the number of columns in the WooCommerce shop page, however that’s static.
What if I wanted to show 5 columns of products on large desktops, 4 columns on desktops, 3 on tablets and 2 on smaller devices? Well, this “dynamic” behavior is – this time around – managed by CSS. Let’s see how it’s done!
Continue reading WooCommerce: Switch Shop Columns Responsively
Today’s snippet is a helpful shortcut for getting the list of customers in your WooCommerce website. This may be necessary during customization, especially if you need tailor-made features for administrators and shop managers in the backend or frontend.
How did I find out about the solution below? Well, our job is mainly copy/paste from online forums or read thoroughly the WooCommerce core files on a daily basis – so it must’ve been one of the two. Enjoy!
Continue reading WooCommerce: Get List Of All Customers
The WooCommerce “Order Again” button displays for ‘completed’ orders on the Thank You page and View Order page. That’s a pity, because it would be useful to show it on the My Account > Orders page as well, as a custom “action”, same as the “View”, “Pay” (if pending), “Cancel” (if subscription), “Edit” (custom snippet), “Confirm” (custom snippet) buttons.
The good news is that we can code it ourselves! And just reuse most of the code we already wrote, as well as rely on the WooCommerce “listener” for the existing “Order Again” button. Enjoy!
Continue reading WooCommerce: Order Again Button @ My Account > Orders
The Storefront theme is one of the most popular WooCommerce themes. As of today, it has 200,000 active installations and 4.5/5 ratings, as well as a great overall performance.
But sure, you can’t win them all. Storefront is missing an important feature: the top bar. That’s a pity, because most ecommerce themes have either a dedicated widget area or somewhere you can add content in the theme options.
So, let’s go fix that. Here’s how to add a top bar with a background to your Storefront theme. Enjoy!
Continue reading WooCommerce: How to Add a Top Bar to Storefront Theme
Exactly. By default, when you search for orders in the WordPress > WooCommerce > Orders backend, using a SKU will give you 0 results. Which is pretty poor for a store manager.
Let’s change this. Despite the code is a little complex, all you need is a simple copy & paste. Enjoy!
Continue reading WooCommerce: Search Orders By SKU @ Admin
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!
Continue reading WooCommerce: Reorder My Account Tabs
You can use a shortcode or block in order to display the WooCommerce products on sale. However, what if you wanted a proper “product category” called “Sale” – and where you didn’t need to manually assign this category to each product?
Basically, how do we display all the discounted products in a custom category called “Sale”, without doing any manual work?
Here’s a super quick tutorial. Enjoy!
Continue reading WooCommerce: “Sale” Category (Automatic)
We already saw how to show product categories in the Cart, how to display a category in the Shop page, but we never talked about showing ALL the product’s categories in the Shop / Category / Tag / Loop pages.
On top of that, we’ll also study the wc_get_product_category_list() function again, which is a super useful shortcut to get all the categories for a given product. Enjoy!
Continue reading WooCommerce: Display Product Categories @ Shop
An order can be marked as “completed” only by the WooCommerce store manager – manually. In certain cases, this operation may be automatic i.e. for downloadable orders.
However, what if we want our customers to complete (confirm) their processing order instead? Well, this is quite easy: we display a “CONFIRM ORDER” button under My Account > Orders, and on click some code triggers the status change. Enjoy!
Continue reading WooCommerce: Let Customers Complete a Processing Order
We’ve already found out how to check if a WooCommerce product is simple, variable, grouped… Today we add more conditional tags as we study which WooCommerce “product types” are included within the official WooCommerce Subscriptions extension.
There are two new product types in such case: “Simple Subscription” and “Variable Subscription”, with the difference being you can offer multiple billing periods within the same product page (choice between daily, monthly and yearly for example) with the latter.
So, how do we know if a given product ID is a subscription, and also whether it’s a simple or variable one? Here’s the quick solution – enjoy!
Continue reading WooCommerce: Check If Product Is A Subscription
Go to WooCommerce Checkout as a logged out user. Fill out billing name, surname, address, email and phone. Change your mind and go back to Cart. Return to Checkout. Billing name, surname, email and phone (basically everything but the address) are gone!
But hey, this annoying WooCommerce flaw is about to go away with a few lines of code. Either reload the Checkout page or go back to it later – your info will still be there (as long as you haven’t cleared your cache/cookies and the WooCommerce session hasn’t expired of course).
Enhoy!
Continue reading WooCommerce: Retain Field Values @ Checkout Reload
Surprisingly enough, variable products with a price range display two prices: at the top right you find the “parent” product price, displayed as a range; but once you select a variation, a second price appear just above the variation add to cart. Somewhat confusing.
In today’s snippet, we’ll see once and for all how to replace the top right variable product price with the one of the current variation, while also hiding the variation price. Therefore, you’ll see a single price on the single product page for variable products! Enjoy!
Continue reading WooCommerce: Replace Variable Price With Active Variation Price
In the era of online courses, subscriptions, custom-made products and product personalization, it may happen a scenario where a user can only purchase a product once in their lifetime.
In this short tutorial, we will see how this is done.Clearly, the user must be logged in in order for the code to trigger, so this applies to stores that require checkout login in order to proceed with the order.
Enjoy!
Continue reading WooCommerce: Only Allow to Buy a Product Once