Facets is a great tool to improve search UI by adding filtering options that the end user can use to filter the search results by category, price, location or any other similar fields. A typical use of a Facet is to allow filtering the search results by a price range on a shopping cart website, or filtering jobs based on location.
Our Job posting content type provides fields such as Terms of employment, State/Territory and Agency. Let’s add them as facets and see if that improves our search.
Facets module is already enabled in your training environment.
Go to Administration → Configuration → Search and metadata → Facets. This page has a few facet sources available. These facets were created for you by the Facets module from each of the Views in your site. As you may expand your site with more Views that use a Search API index, they all become available here.
Locate our Job search in the Facet source, and click configure:
Enter a unique filter key. This key will be used in the query string to identify the facet source, which avoids errors when using multiple facets. We could leave this configuration empty; in which case the Facets will use an internally generated string.
Click the Add facet button.
Select View Jobs Search, display Page as the Facet Source.
Select State (field_jobstate) as the Field.
Enter State/Territory in the Name field. This will be used as the facet header.
Save the configuration and configure the facet.
Widget: List of checkboxes.
Show the amount of results: selected.
List item label: selected.
Transform entity ID to label: selected.
URL alias: state.
Empty facet behaviour: Do not display facet.
Operator: OR.
Sort by active state: not selected.
Sort by count: not selected.
Sort by display value: selected.
Sort order: Ascending
The “Sort by display value: Ascending” will ensure the taxonomy terms for the State/Territory will be listed alphabetically.
Alternatively, we may enable the weight-based ordering of the facet filters to replicate the term sorting in the taxonomy vocabulary. For this to work, you unselect the “Sort by display value” above and select the “Sort by taxonomy term weight” checkbox.
For now, leave the “Sort by display value” selected.
Save the configuration. This will create a block, which we have to place into the Content top region, so it appears to the end user.
Navigate to the Structure → Block Layout.
Place the State/Territory block (category Facets) into the Content above region.
Restrict the visibility of the block to the Jobs Search page (/jobs-search).
Save blocks the block layout page.
Test your facet by navigating to the Jobs Search page.
Use your experience from the previous step and create a facet for the Agency field. Place it as a block in the Content Top region.