There are times when you really want to do things right, you have a 5-figures budget and all the time in this world: you might want to override the whole WooCommerce CSS by disabling it completely, and applying your custom styles instead.
Despite this is an unusual task, I’ve researched the topic and here are my findings. Enjoy!
PHP Snippet: Disable WooCommerce Core CSS
Once upon a time there was a super handy checkbox in the WooCommerce settings for disabling CSS. Now, there is a 1-line snippet instead 🙂
This code still works, unless you report otherwise. To exclude conflicts, temporarily switch to the Storefront theme, disable all plugins except WooCommerce, and test the snippet again: WooCommerce troubleshooting 101
WooCommerce: Add CSS to Order Emails Unlike your WordPress theme, you can’t just add CSS to your style.css in order to customize the look of the WooCommerce emails. This handy PHP snippet is therefore the only viable solution. It’s a little tricky but once you get the idea, adding CSS to Order Emails is a breeze.
WooCommerce: Change the “Remove this Item” Icon @ Cart I have a very long to-write list. Possibly I have enough content for another 2 years 🙂 However, the other day a premium WooCommerce student asked me for some feedback on his custom CSS – so I had to give it priority! The request was: what’s the easiest way to change the little icon/button on […]
WordPress: How to Add CSS to a Specific URL 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, […]
WooCommerce: Product Category as Body Class @ Single Product Page A Business Bloomer fan asked me an interesting question this week: how to apply CSS on the single product page based on the product category? Well, the answer is pretty simple: if we’re able to add the category name to the HTML “body”, this can then be targeted in your custom CSS. So, let’s see […]
WooCommerce and Divi: how to override !important CSS I am a big fan of Elegant Themes, but a lot of CSS styles (mainly in Divi) contain “!important” in order to override WooCommerce styles when using the two in a combo. Now, the big problem is that we can’t override !important with another !important. Divi will win. But no matter whether Divi has been […]
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