Skip to content

How to Create WooCommerce Product Size Filter in Elementor? (Button Filter)

Table Of Content

Size is one of the most-filtered WooCommerce attributes, and shoppers expect it as a row of clickable buttons (S, M, L, XL), not a checkbox list.

The Woo Filter’s Button display style, pointed at your store’s Size attribute, produces exactly that.

For the full settings tour of the WP Search Filters widget, see WP Search Filters Widget Settings Overview.

Requirement – This widget is a part of The Plus Addons for Elementor Pro, make sure it’s installed & activated to enjoy all its powers.

Before You Start

  • Prerequisite: Elementor (free) installed and active.
  • Edition: WP Search Filters is a Pro widget – it requires The Plus Addons for Elementor Pro to be installed and active.
  • Widget to enable: go to The Plus Addons > Widgets, search for WP Filters and turn its toggle on.
  • Prerequisite: WooCommerce installed and active, with at least a few products published.
  • A WooCommerce Size attribute (e.g. `pa_size`) with values assigned to products.

Steps

Add the WP Filters widget, set Filter Type to Woo Filter, then set the display style to Button.

Woo filter display style set to button, showing size values

Set Select Attributes to your store’s Size attribute taxonomy.

Settings Overview

SettingWhat it doesDefault
Select Source (Woo Filter)Set to Button for a clickable row of values.–
Select AttributesSet to the Size attribute taxonomy specifically.–

Related Docs

Related Frequently Asked Questions

Related Docs