Filter, search, and sort a product table

WooCommerce / Product Table

Two different settings narrow a table. Dropdown filters only hide rows that are already loaded. Category, price, stock, and similar attributes change the product query before the table is built.

Dropdown filters

Add filters to put dropdowns above the table. Each filter searches the matching column, so that column has to be in columns.

Filter	Dropdown	Needs this column
categories	Product categories. category is the same filter.	categories
tags	Product tags.	tags
stock	In stock or out of stock, matched against the stock cell.	stock
att:color	Terms for that attribute. Add a label with a third part: att:color:Color.	att:color
tax:product_brand	Terms for that taxonomy. Optional label: tax:product_brand:Brand.	tax:product_brand

[yh_wc_product_table columns="image,name,att:color,att:size,stock,price,buy" filters="categories,att:color:Color,att:size:Size,stock" reset_button="true"]

reset_button="true" adds a Reset button above the table. It clears the dropdowns, the search box, and the sort, and puts the table back to the original order.

Search, totals, and pages

Attribute	Default	Values
search_box	Bottom	top, bottom, both, or false. true means bottom.
search_term	Empty	Text already typed into search when the table loads. search does the same thing.
instant_search	false	true filters as the customer types, without waiting for Enter.
pagination	Bottom	Same positions as the search box.
page_length	Bottom	The “show X entries” control. Same positions, or false.
totals	Bottom	“Showing 1 to 25 of 80”. Same positions, or false.
paging_type	numbers	numbers, simple, simple_numbers, full, or full_numbers.
rows_per_page	25	Capped at 200. -1 shows every row from the query on one page.
load_more	false	true replaces numbered pages with a Load more button.
lazy_load	false	Load rows over AJAX instead of printing them all in the page.
product_limit	500	Maximum products in the query. Hard cap 1000.

With the default settings, search runs in the browser on rows already printed. Turn on lazy_load="true" when the catalog is large enough that the first page should stay small. Products past product_limit are not in the table, so search cannot find them.

Choose which products are queried

These attributes run before the table renders. Combine them. A product has to match all of them.

Attribute	Example	Notes
category	category="hoodies,shirts"	Category slugs, comma-separated. Not the category name.
exclude_category	exclude_category="sale"	Slugs to leave out.
tag	tag="organic"	Tag slugs.
include	include="12,48,90"	Only these product IDs.
exclude	exclude="15,16"	Skip these product IDs.
product_type	product_type="simple"	simple, variable, grouped, or external.
min_price / max_price	min_price="10" max_price="100"	Leave either one at 0 for no bound on that side.
in_stock_only	true	Skip out-of-stock products.
on_sale_only	true	Only products on sale.
featured_only	true	Only featured products.
taxonomy and term	taxonomy="pa_color" term="blue"	One taxonomy term. Attribute archives use this for you.

Shoppers only see published products. A logged-in user who can edit products can pass status, for example status="publish,private".

Default sort

sort_by is the column used on first load. The default is menu_order, which is the WooCommerce product order. sort_order is asc or desc.

[yh_wc_product_table columns="sku,name,price,buy" sort_by="price" sort_order="asc" in_stock_only="true"]

Customers can still click another heading to sort, except image, buy, and the details button.

Common mistakes

Related