Overriding WooCommerce templates

If you've ever wanted to change the layout of the single product page, the cart page, or even one of the e-mails sent out by WooCommerce, you can do that by overriding the templates in WooCommerce. If you're familiar with WordPress theme templates, they are very similar. If you copy a WooCommerce template to your theme, WooCommerce will load your template instead of the default template that is in the plugin.

Being able to overload any template in WooCommerce means you can customize every aspect of how WooCommerce looks to your customers. If you want to remove something, change something, or add something new, that's all possible.

For our purposes, we'll be adding some CSS classes to the HTML. If we can reuse existing CSS classes that we've already styled, then that saves us a lot of time as we won't need to rewrite those styles.

Getting ready

You need to have at least one product in your store.

How to do it…

Overriding WooCommerce...