April 12, 2024

Add WooCommerce Filters with Elementor, Themify, Or WP Grid Builder

Play Video
Tutorial Walkthrough
This video tutorial provides an in-depth walkthrough, and we recommend following along with the video to grasp the concept fully. Below, you'll find a summary of the tutorial, but please note that it may leave out some detailed steps, so watching the video will give you the most comprehensive understanding.

Finding the right product on a website with a vast selection can be daunting for customers. Add WooCommerce Filters to enhance the user experience and streamline product discovery, integrating advanced filtering options into your WooCommerce store. This tutorial explores three powerful tools: Elementor, Themify Product Filter, and WP Grid Builder, each offering unique advantages for adding WooCommerce filters to your WordPress site.


Please make sure you have the following installed and activated:

Why Adding Filters to WooCommerce is Beneficial

Adding filters to your WooCommerce store can enhance the shopping experience by allowing customers to navigate through your products and pinpoint exactly what they’re looking for. This customization not only streamlines the product search process but also:

  • Improves User Experience
    Filters save time and effort by narrowing down choices based on specific criteria, such as size, colour, price range, or category, leading to a more satisfactory and less overwhelming shopping experience.
  • Increases Conversion Rates
    By making it easier for customers to find what they want, filters can directly contribute to higher conversion rates. Shoppers are more likely to make a purchase when they can easily find products that meet their needs.
  • Reduces Bounce Rates
    An intuitive filtering system keeps users engaged, reducing the likelihood of them leaving your site due to frustration or inability to find what they’re looking for.
  • Enhances Product Visibility
    Filters help expose customers to products they might not have discovered through traditional navigation, increasing the visibility of lesser-known items and potentially boosting sales across your catalogue.

Summary of ‘Add WooCommerce Filters’ Video Tutorial

  • 0:00
    The video begins by discussing the challenges of navigating a WordPress site with a large number of products, categories, attributes, and price ranges. It suggests that while WordPress offers some built-in widgets for product search and filtering (such as filtering products by price, categories, and attribute), these are not recommended due to their basic and unattractive design when implemented on a shop page.
  • 1:35
    The video advises against using WordPress’s built-in widgets for filtering products. Instead, it recommends using Elementor’s Taxonomy Filtering widget, part of Elementor Pro, for a more attractive and functional filtering system. It emphasizes activating the taxonomy filter feature in Elementor and demonstrates how to add and configure the taxonomy filter widget within a shop template.
  • 4:58
    The tutorial explores customizing the appearance and functionality of the taxonomy filters, including layout adjustments (horizontal, vertical), style customizations (border types, colors, spacing), and the ability to allow multiple selections for more versatile filtering.
  • 7:02
    It notes a drawback of the taxonomy filters: the application of an ‘all’ logical combination across all filters, which might not be desirable for all use cases. It suggests that while the taxonomy filter widget is good for basic filtering needs, it lacks advanced features like color indicators for attributes or price range filtering.
  • 8:00
    The video introduces Themify Product Filter, a free plugin that offers a more advanced filtering system compared to the basic Elementor widget. It walks through the installation process and highlights the plugin’s versatility, including the ability to customize filter lists, create different versions for desktop and mobile, and improve attribute filtering beyond what Elementor offers.
  • 15:17
    Gridbuilder WP, a premium plugin, is presented as the preferred option for advanced filtering needs. The tutorial covers its installation, including an add-on for Elementor integration, and demonstrates how to create and customize facets (filters) for product categories, price ranges, and other attributes with greater flexibility and aesthetic control.
  • 23:31
    Conclusively, the video argues that Gridbuilder WP, despite being a paid solution, offers the best functionality and customization options for adding advanced filters to a WooCommerce WordPress shop. It positions Gridbuilder as superior to both the basic WordPress filtering system and other plugin options discussed, emphasizing its efficiency, aesthetic appeal, and the ability to tailor filters to specific site needs.

Official Documentation

Add WooCommerce Filters – Conclusion

Incorporating advanced filters into your WooCommerce store significantly improves navigation, helping customers find exactly what they need with ease. Whether you choose the simplicity of Elementor, the versatility of Themify Product Filter, or the comprehensive capabilities of WP Grid Builder, each tool offers a path to creating a more accessible and user-friendly shopping experience on your WordPress site.

Required Resources

WP Grid Builder Logo
Free Options
WooCommerce Logo
Free Options
Elementor Logo
Free Options
Credit to Web Squadron
Web Squadron is a popular YouTube channel dedicated to providing informative tutorials, tips, and insights on web development and design. With a strong focus on WordPress and website builders like Bricks Builder, the channel aims to help users of all skill levels, from beginners to advanced developers, create and optimize their websites. By offering easy-to-understand, step-by-step guidance, Web Squadron provides practical and valuable content.
Add WooCommerce Filters with Elementor, Themify, Or WP Grid Builder
Welcome back!
Enter your Helwp credentials to sign in.

No Account yet? Sign Up

My Account
Give Feedback
Describe your feedback *
Rate Helwp
Problem *
Describe the problem
Want us to reply?
Your E-Mail
Affiliate Disclosure

At Helwp, we’re committed to transparency and honesty. Therefore, we want to inform you that some of the links on our website are affiliate links. This means that, at no additional cost to you, we may earn a small commission if you click through and make a purchase.

We only promote products or services that we genuinely believe in. These affiliate commissions help us to maintain the website and continue to provide you with free, high-quality WordPress content.

If you are interested in how you can support us even further, check out our support page.