Sridhar Katakam

Genesis and WordPress Tutorials

Search, Price Slider, Product Categories and other Filters for WooCommerce in Genesis

by 8 Comments

This article covers setting up filters in a text widget inside a custom sidebar on WooCommerce product archive pages in Genesis using FacetWP and SearchWP (both commercial plugins).

We shall

  • add support for WooCommerce in Genesis w/o using the Genesis Connect for WooCommerce plugin
  • add the class needed for FacetWP to main.content
  • force content-sidebar layout setting
  • register and display a custom Primary sidebar
  • place shortcodes for displaying the FacetWP filters in a text widget in the custom sidebar

for WooCommerce product archive pages.

Sample screenshot of Shop page:

genesis-wc-filters-before

After applying a few filters:

genesis-wc-filters-after

Step 1

Install and activate FacetWP and SearchWP.

Step 2

If you have Genesis Connect for WooCommerce plugin activated, deactivate it.

If the following is already present in your child theme's functions.php file, comment it out or delete it:

add_theme_support( 'genesis-connect-woocommerce' );

Step 3

Add the following in child theme's functions.php:

To view the full content, please sign up for the membership.

Already a member? Log in below or here.

  • Hi Sridhar. I’m setting up WooCommerce on my site, but for various reasons I need to set the shop page up on a different page to the one defined in WooCommerce settings. In WooCommerce settings I have the shop page set to ‘Store’ (and I’m not using that page).

    I’ve got a separate page called “Shop” (built using BeaverBuilder plugin) which I’m using WooCommerce plugins to provide the necessary functionality.

    So, is it possible to amend the code above to provide this functionality on a non-WooCommerce template page such as one that I would build using BeaverBuilder?

    I’d be so grateful for any advice you can give. Thank you.

    Reply

  • Hi Sridhar,

    I’ve reverted to using the default woocommerce shop page in order to avoid any potential clashes and have followed the instructions as outlined in your tutorial. So I’ve got it set up exactly as outlined above. Everything is displaying fine. But when I perform a search it returns no results.

    You can see my shop page here: https://bibleleagueca.wpengine.com/shop/. I’ve only got 10 or so sample products in at the moment. But none of the filters return a result which is really strange.

    I tried to do some troubleshooting and came across a note on the SearchWP pages (https://searchwp.com/docs/kb/attention-wp-engine-customers-no-results-long-query-killed-query-notices/) which I thought might be relevant as I use WPEngine for hosting. But I’ve made the recommended change to wp-config.php and it hasn’t made any difference.

    Is there something simple I’ve done wrong here?

    Thanks for any help you can give on this.

    Reply
    • >