Showing posts with label How to create and edit woocommerce template. Show all posts
Showing posts with label How to create and edit woocommerce template. Show all posts

Tuesday, 19 May 2015

How to create and edit Custom Templates of woocommerce

WooCommerce (and almost all add-ons) provides a templating system. This means that every element displayed on a WooCommerce page can be overridden.
This system’s advantage is that you can modify the display of an element without editing WooCommerce core files (which is absolutely NOT recommended, if you do so, all your modifications will be lost at the next WooCommerce update, so just don’t do it). All templates are located in a woocommerce/templates folder. As explained in our documentation, all you have to do is to create a woocommerce folder within your theme’s directory, and in this folder duplicate the files you’d like to override. Please note that we strongly recommend using a child theme in order not to lose any modifications during your theme update.
Overriding default templates also allow you to customize all emails sent by WooCommerce ;-)

Example:

Let’s say you would like to add a new class to product tabs in order to apply custom CSS code to the tabs. You would need to duplicate the woocommerce/templates/single-product/tabs/tabs.php file in the following folder wp-content/themes/your-theme-folder/woocommerce/single-product/tabs/ and change the following code <ul class=« tabs”> to <ul class=« tabs my-custom-tabs-class « >.

Popular Articles