Filtering the Divi Shop Module

|

Divi comes with a collection of modules for WooCommerce (and newer cart & checkout modules). One of these is the Divi shop module which allows WooCommerce products to be displayed in a grid, similar to the blog module and portfolio module. One thing currently missing from the Divi shop module is the ability to filter the shop results. Fortunately, there are some options out there – here's a brief round up of some of those options.

Filtering the Divi shop module with Divi Filter

Divi Filter is a free plugin for Divi that allows you to add filters to a range of modules, including the Divi shop module. It lets you turn standard button module into a filter button for the shop module. To set it up, you need to manually add classes to both the button modules and then shop module, but this is all explained in the documentation. There is also a premium version with additional options, such as the ability to filter on rows.

Filtering the Divi shop module with WooCommerce Product Filter

WooCommerce Product Filter is a free plugin by Themify which lets you add a rich, aspect-based filter to any WooCommerce site. It includes built-in support for the Divi shop module. It lets you add a search / filter box which can filter through products by title, price range, categories, attributes, tags, and more. It can be added as a widget to the sidebar (or sidebar module), or added to a text module or code module via a shortcode.

Elegant Themes have published a detailed post on setting up WooCommerce Product Filter with Divi.

Filtering the Divi shop module with Product Filter by WooBeWoo

Product Filter is a free plugin by WooBeWoo which, similar to the Themify plugin, lets you add a rich, aspect-based filter to any WooCommerce site. While not Divi-specific, it includes support for the Divi shop module. It lets you add a search / filter box which can filter products by price, price range, categories, tags, author, featured, on sale, in stock, rating, search by text, and attribute filters.. It can be added as a widget to the sidebar (or sidebar module), or added to a text module or code module via a shortcode.

Using Divi FilterGrid with WooCommerce Extension

If the Divi shop module and its filtering options don't do what you need, another option is to use a third-party Divi module to display the grid of products. One such plugin is Divi FilterGrid by Divi Plugins. On its own, Divi FilterGrid allows you to display any custom post type, such as WooCommerce products, in a highly customizable grid. Combined with the FilterGrid's flexible filter system, this makes it possible to create a grid of products filterable by categories or tags.

Divi Plugins also offer a WooCommerce Extension to additional product data to be displayed in the grid.

Using Divi Ajax Filter

Another third-party option is Divi Ajax Filter by Divi Engine. Divi Ajax Filter plugin includes Divi Engine's "Custom Loop Layout" module which can be used to display a grid of WooCommerce products. The filtering features of the plugin can then be used to set up a filters on categories, tags, product attributes (like color), product price, ACF, and range sliders.

Divi Ajax Filter is available as a standalone plugin or as part of Divi BodyCommerce or Divi Machine.

 

This post may contain referral links which may earn a commission for this site

Divi Booster

Hundreds of new features for Divi
in one easy-to-use plugin

0 Comments

Submit a Comment

Your email address will not be published.