Archive-product.php override woocommerce.php

Hi Themeco,

WooCommerce 3.4.3
Testing X 6.2.3 / Pro 2.2.3

I wish to override the archive-product.php using child theme, however in Wordpress Admin > WooCommerce > Status > Templates it displays the following message:

Your theme has a woocommerce.php file. You will not be able to override the woocommerce/archive-product.php custom template since woocommerce.php has priority over archive-product.php. This is intended to prevent display issues.

How can I override archive-product.php with a child theme?

Thanks.

Hi @strobley,

The X theme has a file called woocommerce.php for the reason of the customization to make it show as we intended in the theme. That is why you can not override that file. Instead, you need to use the functions.php file of the Child Theme and the Hooks of the Woocommerce to do the customization you intended to do in the product listing. For more information:

Also, you might be able to do a quick customization using the Conditional Tags. For more information:

https://codex.wordpress.org/Conditional_Tags

Thank you

Thanks Christopher.

I’m following this guide https://connekthq.com/woocommerce-infinite-scrolling/#edit-woocommerce-templates

Between woocommerce_product_loop_start(); and woocommerce_product_loop_end(); I need to completely remove the current code

if ( wc_get_loop_prop( 'total' ) ) {
	while ( have_posts() ) {
		the_post();

		/**
		 * Hook: woocommerce_shop_loop.
		 *
		 * @hooked WC_Structured_Data::generate_product_data() - 10
		 */
		do_action( 'woocommerce_shop_loop' );

		wc_get_template_part( 'content', 'product' );
	}
}

And replace with

	if ( wc_get_loop_prop( 'total' ) ) {

	if(is_archive()){ // Product Archives

		$obj = get_queried_object();
		$taxonomy = $obj->taxonomy; // Get taxonomy
		$taxonomy_term = $obj->slug; // Get term
		echo do_shortcode('[ajax_load_more post_type="product" taxonomy="'. $taxonomy .'" taxonomy_terms="'. $taxonomy_term .'" taxonomy_operator="IN" css_classes="products" posts_per_page="6" transition="fade"]');

	} else { // Shop Landing Page

		echo do_shortcode('[ajax_load_more post_type="product" css_classes="products" posts_per_page="6" transition="fade"]');			

	} 
}

How do I do this in functions.php as I cannot override the template using the normal means?

Hi There,

You can override the woocommerce.php file instead. This requires a template change, I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when a Pro update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

Then navigate to your child theme’s /framework/views/{your_stack}/ directory create a file named woocommerce.php and paste the code below:

<?php

// =============================================================================
// VIEWS/INTEGRITY/WOOCOMMERCE.PHP
// -----------------------------------------------------------------------------
// WooCommerce page output for Integrity.
// =============================================================================

get_header();

?>

  <div class="x-container max width offset">
    <div class="<?php x_main_content_class(); ?>" role="main">

	<?php
		if(is_archive()){ // Product Archives

			$obj = get_queried_object();
			$taxonomy = $obj->taxonomy; // Get taxonomy
			$taxonomy_term = $obj->slug; // Get term
			echo do_shortcode('[ajax_load_more post_type="product" taxonomy="'. $taxonomy .'" taxonomy_terms="'. $taxonomy_term .'" taxonomy_operator="IN" css_classes="products" posts_per_page="6" transition="fade"]');

		} else if(is_shop()) { // Shop Landing Page

			echo do_shortcode('[ajax_load_more post_type="product" css_classes="products" posts_per_page="6" transition="fade"]');			

		} else { //single productt page
			woocommerce_content();
		}
	?>

    </div>

    <?php get_sidebar(); ?>

  </div>

<?php get_footer(); ?>

Hope it helps :slight_smile:

Hi Thia,

Unfortunately this does not work. I’m using a child theme.

To understand where the problem is I have tried and successfully implement this plugin using the standard WooCommerce template override process using the Storefront Child Theme. This demonstrates the plug and process in the guide work for both the Shop Landing Page and Product Archive Pages with the normarl template override process.

There are 2 different problems with the code you helpfully provided.

Problem 1.
Using just the Shop Landing Page code, products are not displayed to screen though I can see the rendered code and the load more button. I have also added the products col-3 class ( I’ve also tried removing them with no success either). For ease of reading I’ve only pasted the relevant php block

            if ( is_shop() ) { // Shop Landing Page
                echo do_shortcode('[ajax_load_more post_type="product" css_classes="products col-3" posts_per_page="12" pause="true" button_label="View More" button_loading_label="Loading More" transition="fade"]');
            } else { //Single Product Page
                woocommerce_content();
            }

Problem 2.
When using the code including the Product Archive Page as follows - again, only pasting the relevant php block.

            if ( is_archive() ) { // Product Archives
                $obj = get_queried_object();
                $taxonomy = $obj->taxonomy; // Get taxonomy
                $taxonomy_term = $obj->slug; // Get term
                echo do_shortcode('[ajax_load_more post_type="product" taxonomy="'. $taxonomy .'" taxonomy_terms="'. $taxonomy_term .'" taxonomy_operator="IN" css_classes="products col-3" posts_per_page="12" pause="true" button_label="View More" button_loading_label="Loading More" transition="fade"]');
            } else if ( is_shop() ) { // Shop Landing Page
                echo do_shortcode('[ajax_load_more post_type="product" css_classes="products col-3" posts_per_page="12" pause="true" button_label="View More" button_loading_label="Loading More" transition="fade"]');
            } else { //Single Product Page
                woocommerce_content();
            }

This code generates the following error:
Notice: Undefined property: WP_Post_Type::$taxonomy in /webapp-development/dev-local.host/wp-content/themes/pro-child/framework/views/ethos/woocommerce.php on line 19

Notice: Undefined property: WP_Post_Type::$slug in /webapp-development/dev-local.host/wp-content/themes/pro-child/framework/views/ethos/woocommerce.php on line 20

Both are caused the following parts of the code

                $taxonomy = $obj->taxonomy; // Get taxonomy
                $taxonomy_term = $obj->slug; // Get term

As noted, all of this works perfectly and without error following the standard WooCommerce template override process. It seems to be the X / Pro themes preventing this from working - please let me know how to get it work.

Hey There,

These messages are not errors. These are just PHP notices.

To get rid of this, please disable the debug mode. You can do this by opening wp-config.php and adding


define('WP_DEBUG', false);

/* That's all, stop editing! Happy blogging. */

When you revisit the page, you should no longer be seeing those PHP notices.

Please let us know how it goes.

Thanks RueNel, that got rid of the messages… However the products are still not being displayed as defined in Problem 1.

Hey There,

Please printout the output of the queried object. Simply update the code and use this:

            if ( is_archive() ) { // Product Archives
                $obj = get_queried_object();

                print_r($obj);

                $taxonomy = $obj->taxonomy; // Get taxonomy
                $taxonomy_term = $obj->slug; // Get term
                echo do_shortcode('[ajax_load_more post_type="product" taxonomy="'. $taxonomy .'" taxonomy_terms="'. $taxonomy_term .'" taxonomy_operator="IN" css_classes="products col-3" posts_per_page="12" pause="true" button_label="View More" button_loading_label="Loading More" transition="fade"]');
            } else if ( is_shop() ) { // Shop Landing Page
                echo do_shortcode('[ajax_load_more post_type="product" css_classes="products col-3" posts_per_page="12" pause="true" button_label="View More" button_loading_label="Loading More" transition="fade"]');
            } else { //Single Product Page
                woocommerce_content();
            }

There should be a print out of the object, I would like you to insert the output in your next reply so that we can check the data.

Please let us know how it goes.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.