How To Remove Sections from Storefront Homepage

Storefront is a free theme (with 4,564,000+ download), developed & designed by WooCommerce Core Developers. I’ve put together a list of snippets so that you can quickly and easily customize your Storefront Homepage.

Storefront Homepage

The Storefront theme’s Homepage has 6 sections:

  1. Page Content
  2. Product Categories section
  3. Featured Products section
  4. Recent Products section
  5. Top Rated Products section
  6. On Sale Products section
  7. Best Selling Products section
storefront homepage blocks

How To Setup Storefront Homepage

To display Homepage sections on your homepage, you have to assign the Homepage template to your page.

storefront homepage template

Follow these steps to display storefront sections on your homepage:

  1. Go to Dashboard -> Pages and create a page title homepage
  2. On the right hand side, you will find a box titled “Page Attributes
  3. Select “Homepage” from “Template” drop-down.
  4. Click on Update to save the change.

Remove Homepage Sections

How To Remove Sections from Storefront Homepage

You may want to customize your homepage and remove some sections (e.g.: Product category, Recent, Best-selling). There are many plugins for this process. However, each plugin will slow down your site. Without a plugin, you can add a very short code to complete the process.

First, the location of the file containing the sections: themes/storefront/inc/woocommerce/storefront-woocommerce-template-hooks.php If you edit this file, your new codes will be removed when your theme is updated. So be sure to use a storefront child theme. (How do I create a storefront child theme?)

Follow these steps to remove homepage sections:

  1. Create a storefront child theme.
  2. Go to functions.php (wp-content/themes/your-child-theme/functions.php)
  3. Open the functions.php with n++ or other editors.
  4. Add the following code to the end. This code allows you to remove sections from the homepage.
function remove_sections_homepage() {
    remove_action('homepage', 'storefront_product_categories', 20 );
    remove_action('homepage', 'storefront_recent_products', 30 );
    remove_action('homepage', 'storefront_featured_products', 40 );
    remove_action('homepage', 'storefront_popular_products', 50 );
    remove_action('homepage', 'storefront_on_sale_products', 60 );
};

add_action( 'init', 'remove_sections_homepage', 1);

NOTE: If there is a section you want to display, remove it from the code above.

If you have a question, please comment! I always want to help.

That’s All!

Leave a Reply