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!
Sometimes solutions are very simple, and you don’t need rocket science to fix your issue!
A client of mine needed to hide a category from the Product Categories Shortcode (“product_categories”); in fact, there is no parameter that allows you to “exclude” a given product category such as “uncategorized” or whatever category you wish.
A rare issue, but once again a quick fix! Here’s how you do it.
Continue reading WooCommerce: Exclude Category from Shortcode
This is an interesting topic. A WordPress/WooCommerce client could not add CSS via the usual way. In fact, Gravity Forms plugin (and in particular the “directory” extension), stores entries in the database BUT the directory page and the entries filtered list have the same classes, ids, and cannot be “targeted” with CSS.
Long story short, and Gravity Form or not Gravity Form, here’s the snippet you can use to add CSS to any WordPress page as long as you know its URL.
Continue reading WordPress: How to Add CSS to a Specific Page URL
A client asked me to customize the Product Categories Widget that comes included with WooCommerce. In this case, they wanted to show ALL categories but the current one (when looking at a category page of course).
You can also use this tutorial to hide certain category IDs from the widget, or maybe “all product category names that start with a given string of text”. Case studies are millions, but the code base is always the same – we’ll make use of the “woocommerce_product_categories_widget_args” filter and provide a list of product categories to exclude. Enjoy!
Continue reading WooCommerce: Hide Categories From Product Cat Widget
When you have special shipping requirements, maybe you want checkout users to see the shipping form section visible on load.
Here’s how you do it. You’ll also find the opposite task in case you happen to have the shipping form opened by default and you want to hide it. Enjoy!
Continue reading WooCommerce: “Ship to a Different Address” Opened by Default
A client asked me to completely remove the message that appears after you add a product to the cart from the product page. This is simply done by using a PHP snippet, so here’s the quick fix for you!
Continue reading WooCommerce: Remove / Edit “Added to Your Cart” Message
I worked with a client who uses the Shipstation plugin. After updating to the latest version of WooCommerce (2.2), the plugin stopped working and its tab under “settings” could not be clicked. On top, some of the dropdowns got broken. Here’s the fix, hoping that Shipstation updates the plugin asap. Continue reading WooCommerce: Shipstation plugin is broken [solved]
How can you redirect customers to a beautifully looking, custom, product-specific thank you page?
Thankfully you can add some PHP code to your functions.php and define a redirect to a custom URL (as opposed to the default order-received endpoint). This is a great way for you to add specific up-sells, social media share and other information that could help you convert additional sales.
Continue reading WooCommerce: Redirect to Custom Thank you Page
WooCommerce functions add the shipping method label on the Cart totals, on the left hand side of the price. This ruins the price amounts alignment (subtotal, shipping, taxes, total) and many clients have asked me to remove it completely. Also, it could be that sometimes you don’t want to show the name of a shipping rate on the front-end. So, here’s how you do it!
Continue reading WooCommerce: Remove Shipping Labels @ Cart (e.g. “Flat Rate”)
The cart totals table cell title “Shipping” or “Shipping and Handling” appears also on the checkout page. So, what if you wish to “translate” this string from English to “better” English or completely customize it? Thankfully there’s a quick 4 lines snippet for you. Enjoy!
Continue reading WooCommerce: Translate “Shipping” @ Cart Totals
Sometimes you may want to add a prefix or a suffix to your prices. It could be something like “From…”, “Only…”, “…tax free” and so on.
The first good news is this is very easy to do with a WooCommerce filter (remember, filters change the value of an existing variable, while actions add content). The second good news is that you don’t need to know PHP, just copy/paste my snippet!
Continue reading WooCommerce: Add Prefix / Suffix to Product Prices
In some countries there is no Postcode/ZIP (such as Ireland!). How do we make the Postcode/ZIP field not required, or how do we completely remove it? The answer is very simple. Continue reading WooCommerce: Disable PostCode/Zip Field on the Checkout Page
Interesting issue. A client found out that if you push the “enter” on your keyboard while on the WooCommerce Checkout page, the form will be automatically submitted. Ouch! What if the customer wanted to use a different shipping method? What if “enter” is pushed by mistake? So, here’s how you disable it. Continue reading WooCommerce: Disable Keyboard “Enter” on Checkout Page
On a website using USD and WooCommerce Subscriptions, a weird error showed up. After doing a bit of research, I found out that orders above $999.99 were showing as $1 on the Cart and Checkout page. Pretty weird! Here’s how I fixed it. Continue reading WooCommerce: Fix for Wrong Order Total
A very common WooCommerce shop page issue: sometimes (and especially with affiliate stores), WooCommerce product titles are way too long and go over several lines, messing with the overall vertical alignment.
On top of this, you may also want to keep the shop experience consistent, and make all the WooCommerce product titles of the same length. This is how you do it. Enjoy!
Continue reading WooCommerce: How to Shorten Product Titles
This is a very cool snippet that many of you should use to increase your average order value. Ecommerce customers who are near the “free shipping” threshold will try to add more products to the cart in order to qualify for free shipping. It’s pure psychology.
Here’s how we show a simple message on the WooCommerce Cart page. Enjoy!
Continue reading WooCommerce: “You Only Need $$$ to Get Free Shipping!” @ Cart
When importing a big export file from another site, or when installing dummy data from your template developer, the error “the uploaded file exceeds the upload_max_filesize directive in php.ini” is likely to show. Here’s what you can do to fix it. Continue reading WooCommerce: Fix the “uploaded file exceeds the upload_max_filesize directive in php.ini” error
If you wish to print the payment gateway name on order emails (in its own paragraph below the order items table), here’s a handy snippet for you.
All you need to use is the “woocommerce_email_after_order_table” hook to pick the correct position, and then the “get_payment_method_title” WooCommerce function to return the payment gateway name. Enjoy!
Continue reading WooCommerce: Add Payment Method to Order Emails
Interesting WooCommerce customization here. A client of mine asked me to hide/remove prices from the shop page and category pages as she wanted to drive more customers to the single product pages (i.e. increasing the click-through rate).
As usual, a simple PHP snippet does the trick. I never recommend to use CSS to “hide” prices, as they would still be visible in the code – PHP stops the prices from loading, so they’re invisible to the user.
Continue reading WooCommerce: Hide Prices on the Shop & Category Pages
If the WooCommerce product sorting functionality (“Default Sorting” dropdown) is a waste of space or you don’t need that select box at all, you may want to remove it.
This PHP solution is simply cleaner than CSS – and no matter if you code or not, you just need to copy/paste my snippet in your theme’s functions.php.
Continue reading WooCommerce: How to Remove the “Default Sorting” Dropdown
Mostly when the long description and additional information are short, you may want to move this block of content to the right hand side of the product image – as opposed to “waste” a lot of space underneath it. Here’s how you move the product tabs! Continue reading WooCommerce: Move Product Tabs Under the Short Description
