Creating filters

Create meta or REST filters to find values unique to your data. Search, select and equate values based on the type of data you’re looking for. All filters can be combined to narrow your query.

Registering filters

New filters are registered for individual post types:

// replace {$type} with the post type name
add_filter("index_{$type}_filters", function($filters) {
	return $filters;
});

Parameters

id string

Required internal identifier string. For meta field filters, this must match the meta field’s name exactly.

label string

Required label for the filter. Appears in both the filters list and the active filters list

component string

The component type which controls the user interface control shown to the viewer. View the **Components section below for more information.

query string

The query type. Options are:

• meta_field
• rest_field

options array

For selection components, an array of values to choose from

---

Components

String

String components display a simple text box and query meta fields using a LIKE comparison:

$filters[] = [
	'id' => '_location',
	'query' => 'meta',
	'component' => 'string',
	'label' => 'Location',
	'placeholder' => 'enter city...',
];

Number

Number components display a comparison dropdown and text box. The dropdown provided comparisons for: = < and >operators:

$filters[] = [
	'id' => '_price',
	'query' => 'meta',
	'component' => 'number',
	'label' => 'Price',
	'placeholder' => 'enter price...',
];

Radio

Radio components display a list of options with one selectable value at a time. The value, compare, and type keys in the options array are inserted directly into a meta_query array. Read the WP_Meta_Query [https://developer.wordpress.org/reference/classes/wp_meta_query/] documentation for a list of full options.

$filters[] = [
	'id' => '_yoast_wpseo_content_score', // corresponds to the key value in meta_query 
	'query' => 'meta',
	'label' => 'Readability',
	'component' => 'radio',
	'options' => [
		[
			'label' => 'Good',
			'value' => [71, 100],
			'compare' => 'BETWEEN',
			'type' => 'NUMERIC',
		], [
			'label' => 'Ok',
			'value' => [41, 70],
			'compare' => 'BETWEEN',
			'type' => 'NUMERIC',
		], [
			'label' => 'Needs Improvement',
			'value' => [1, 40],
			'compare' => 'BETWEEN',
			'type' => 'NUMERIC',
		]
	]
];

Date

Date components provide a date picker that return an ISO date string of the viewer’s selection:

$filters[] = [
	'id' => '_event_start',
	'query' => 'meta',
	'component' => 'date',
	'label' => 'Start date'
];

Note: if your meta field stores a date as an ISO date string, you can use it immediately as a meta filter. If you store dates differently, you can use a rest_field query and convert the date (see the Filter Types [LINK] document for more information)

Resources