How to make a custom theme compatible with woocommerce

How to make a Theme WooCommerce Compatible

How to make a custom theme compatible with woocommerce

WooCommerce uses its own templates for Shop page, single Product page, and Taxonomy pages. These are the pages that would be affected if there were any integration issues with the theme. To avoid any structure from breaking, it is best to provide support in your theme for WooCommerce. You have two options for this:

Using woocoomerce_content()

WooCommerce single product page and taxonomy pages, are displayed using the WooCommerce Loop. To make sure your theme calls the same, you need to do the following:

  • Create a copy of page.php and rename it to woocommerce.php

  • In woocommerce.php, replace the Loop with woocommerce_content();

    • i.e., instead of if(have_posts)… endif; should be replaced by woocommerce_content()

  • This will ensure that the WooCommerce templates are picked up for the product and taxonomy pages.

Using WooCommerce Hooks

Content displayed on the WooCommerce pages is wrapped between WooCommerce specified tags. For your theme, you can specify your own wrapper. You will need to unhook the WooCommerce wrappers first and then add your own. Make the following changes in functions.php of your theme.

remove_action( ‘woocommerce_before_main_content’, ‘woocommerce_output_content_wrapper’, 10);

add_action(‘woocommerce_before_main_content’, ‘my_content_wrapper_start’, 10);

function my_content_wrapper_start() {

echo ‘<section id=”primary”>’;

remove_action( ‘woocommerce_after_main_content’, ‘woocommerce_output_content_wrapper_end’, 10);

add_action(‘woocommerce_after_main_content’, ‘my_content_wrapper_end’, 10);

function my_content_wrapper_end() {

echo ‘</section>’;


Now that you have made the changes, the final thing you have to do, is specify that your theme now supports WooCommerce. You need to add the following in functions.php of your theme.

add_theme_support( ‘woocommerce’ );


add_action( 'after_setup_theme', 'woocommerce_support' );
function woocommerce_support() {
   add_theme_support( 'woocommerce' );
0 0 votes
Article Rating
Notify of
Inline Feedbacks
View all comments