Skip to main content
wpcrux.com

Back to all posts

How to Override WooCommerce Template Files?

Published on
7 min read
How to Override WooCommerce Template Files? image

Best WooCommerce Template Override Guides to Buy in September 2025

1 The Ultimate WordPress & WooCommerce Handbook: From Setup to Success in Online Selling

The Ultimate WordPress & WooCommerce Handbook: From Setup to Success in Online Selling

BUY & SAVE
$12.90
The Ultimate WordPress & WooCommerce Handbook: From Setup to Success in Online Selling
2 WordPress WooCommerce: Tienda online con WooCommerce (Spanish Edition)

WordPress WooCommerce: Tienda online con WooCommerce (Spanish Edition)

BUY & SAVE
$35.90 $37.90
Save 5%
WordPress WooCommerce: Tienda online con WooCommerce (Spanish Edition)
3 Building E-Commerce Solutions with WooCommerce - Second Edition

Building E-Commerce Solutions with WooCommerce - Second Edition

BUY & SAVE
$38.99
Building E-Commerce Solutions with WooCommerce - Second Edition
4 WordPress WooCommerce: Webshop met WooCommerce (Dutch Edition)

WordPress WooCommerce: Webshop met WooCommerce (Dutch Edition)

BUY & SAVE
$24.99
WordPress WooCommerce: Webshop met WooCommerce (Dutch Edition)
5 Formation Woocommerce: Créer et exploiter une boutique en ligne (French Edition)

Formation Woocommerce: Créer et exploiter une boutique en ligne (French Edition)

BUY & SAVE
$9.99
Formation Woocommerce: Créer et exploiter une boutique en ligne (French Edition)
6 Setting Up and Running an Online Store

Setting Up and Running an Online Store

BUY & SAVE
$2.99
Setting Up and Running an Online Store
+
ONE MORE?

To override WooCommerce template files, follow these steps:

  1. Create a child theme: Before making any changes to the template files, it's important to create a child theme to avoid losing modifications during theme updates.
  2. Locate the template file you want to override: WooCommerce provides a list of template files that can be overridden. These files are located in the "woocommerce" folder within your theme's directory. Identify the file you wish to modify.
  3. Create a new folder: In your child theme's directory, create a new folder called "woocommerce". This folder will house the overridden template files.
  4. Copy the template file: Navigate to the "woocommerce" folder in your parent theme and locate the template file you want to modify. Copy this file and paste it into the "woocommerce" folder in your child theme.
  5. Make desired changes: Open the copied template file from the child theme's directory using a code editor. Modify the file as per your requirements, such as changing the HTML structure, CSS styles, or adding/removing functionalities.
  6. Save the changes: Save the modified template file and ensure that it's placed in the correct file directory within your child theme.
  7. Test the changes: Go to your website and verify if the changes have been applied. Check if the overridden template file has successfully replaced the original WooCommerce template.

By following these steps, you can ensure that your modifications will remain intact even after WooCommerce or theme updates.

Where can you find the default WooCommerce template files?

The default WooCommerce template files can be found in the "woocommerce" folder within your WordPress theme. By default, this folder is located in wp-content/plugins/woocommerce/templates/. However, it is recommended not to modify these files directly as changes would be lost during WooCommerce updates. Instead, you should create a child theme and override the templates there.

How do you create a child theme in WooCommerce?

To create a child theme in WooCommerce, follow these steps:

  1. Create a new folder for your child theme in the wp-content/themes/ directory of your WordPress installation. Give the folder a suitable name, such as "my-child-theme".
  2. Inside the new folder, create a new file called style.css. This file will contain the CSS styles specific to your child theme.
  3. Open the style.css file and add the following code at the top to define the theme information. Replace the placeholders accordingly:

/* Theme Name: My Child Theme Theme URI: http://example.com/my-child-theme/ Description: My child theme description. Author: Your Name Author URI: http://example.com Template: twentynineteen-child <-- Replace with the name of the parent theme you want to use (e.g., "twentynineteen") Version: 1.0.0 */

  1. Save the style.css file.
  2. Create another file inside the child theme folder called functions.php. This file will be used to enqueue the parent theme's styles and customize theme functionality. Add the following code to this file to enqueue the parent theme's styles: