How to override woocommerce product-image template

Question

I want to use my own custom template file (with a custom name) for product image and gallery thumbnails, so need to override the default Woocommerce product-image template by using this:

add_filter( 'wc_get_template', 'modify_product_gallery_template', 10, 5 );
function modify_product_gallery_template( $located, $template_name, $args, $template_path, $default_path ) {
    if ( 'single-product/product-image.php' == $template_name ) {
        $located = '... my-gallery.include.php';
    }

    return $located;
}

But no success yet. Is there any other way for doing this?

Answer 1

It's a problem of path that has to be the absolute server path using get_theme_file_path() for example.

Assuming that your custom template file is named my-gallery.include.php and if:

1) it's located in your active theme's root directory you will use:

$located = get_theme_file_path('/my-gallery.include.php');

So in your code:

add_filter( 'wc_get_template', 'modify_product_gallery_template', 10, 5 );
function modify_product_gallery_template( $located, $template_name, $args, $template_path, $default_path ) {
    if ( 'single-product/product-image.php' == $template_name ) {
        $located = get_theme_file_path('/my-gallery.include.php');
    }
    return $located;
}

Code goes in function.php file of your active child theme (or active theme). Tested and works.

2) it's located inside a your active theme on a woocommerce subfolder , you will use:

$located = get_theme_file_path('/woocommerce/my-gallery.include.php');

3) If you want to override the template via your active theme , just copy the file from the woocommerce plugin to: woocommerce/single-product/product-image.php …

Now you can open edit the copied template and make changes without your actual code and the changes will appear once saved.

Answer 2

You can override woocommerce product-image template

project/wp-content/plugins/woocommerce/templates/single-product/product-image.php

Create below folder structure and copy above page and do modification as per your requirement

project/wp-content/themes/yourtheme/woocommerce/templates/single-product/product-image.php

Answer 3

To override any woocommerce template you don't need to write any code. You can do is simply creating that file inside your active theme. For Example in your case you want to overwrite 'product-image.php' which is located inside

wp-content/plugins/woocommerce/templates/single-product/product-image.php

So for that what you can do, you can just create that template inside your path and for that you need to create the path to the template inside the theme. Like in your case create the path to the template ie :

woocommerce -> templates -> single-product -> product-image.php

When woocommerce runs it will take the template from the theme if available else from the plugin.

Hope this make sense.