Empire's sidebar can feature a tag filter, allowing customers to find products more quickly without leaving the collection page.
Use the theme editor to activate the sidebar, select a filter type, set the filter position, display filters in a grid layout, change the filter order, and exclude specific tags from your collection page sidebar filters.
Activate the sidebar
Enable the sidebar through the theme editor
- In the theme editor (Customize), click top open the template selector
- Select Collections, then Default collection
- Open Collection pages in the sidebar
- Activate Show sidebar
- Save
Select a filter type
Configure the settings below to show the tags By tag or By group.
If you display them By tag, all of the tags you have used will be displayed as checkable boxes in the sidebar. You can add and edit tags for each of your products in the Shopify admin.
Filter tags by group
For filters to be categorized in separate groups, like this example from the Supply demo store, follow the below steps.
First, add the organizing tags to the Products admin (Products > Edit product) in this format:
Interest_Animals, Interest_Art, Interest_Cooking
Enable By group in the theme editor
- In the theme editor (Customize), click top open the template selector
- Select Collections, then Default collection
- Open Collection pages in the sidebar
- Select By group in the Filters dropdown
- Save
Hide additional tags
Use the Hide additional tags after dropdown to restrict the number of tags displayed in the sidebar. By default, all tags will be displayed. The available options here are:
- 5 tags
- 6 tags
- 8 tags
- 10 tags
- 15 tags
- 20 tags
For example, if you selected 5 tags, the list of tags will truncate after 5 instances.
Set the position of the filter
The Filters position selector determines whether the tag filters will show above or below the optional sidebar menus.
Display filters in a grid layout
Filters in the sidebar are presented in a vertical list by default. Display certain filter groups in a grid-style layout, enter the group name of the desired filters into the Display filters as grid field.
For example, to change the 'Interest' group filters on the Empire Supply demo's Kitchen Tools, the name "Interest" would need to be added to the field to display this filter group as a grid.
Change the filter order
By default, the sequence for the Collection page filters is arranged alphabetically.
Reorder groups in the theme editor
- In the theme editor (Customize), click top open the template selector
- Select Collections, then Default collection
- Open Collection pages in the sidebar
- Use the Group order field to add the tag groups in the preferred order
- Save
For example, if there are three groups on a collection page for Size (Size_Small, Size_Medium, Size_Large), Color (Color_Red), Price range (Price range_1.99-9.99), rearrange these to put Price range first by adding "Price range" to the Group order field.
Reorder tags
Rearrange the tags listed under groups with the Tag order field. Similar to the Group order field, the Tag order field is used to identify a new sequence for the listed tags (as opposed to the default alphabetical order).
Add the tags in the preferred order, using the full tag as it appears in the Products admin. For example, if there are tags for size:
Size_S, Size_M, Size_L, Size_XL
These would appear in alphabetical order (L, M, S, XL). To change these to order for ascending size, add these to the Tag order field in the preferred order.
Exclude specific tags
Recent releases of Empire 5.10+ include an additional field to identify tags to exclude from the storefront. Add tags to the Exclude tags field to identify the tags to conceal from the sidebar.
This is especially helpful for tags that only have a behind-the-scenes role, such as tags for 3rd-party apps or automated collections
Explore additional features for Empire's collection pages