Filter
Filter items in grid layout.
Another stack can be used for navigation:
Drop a Subnav and a Grid stack into the Filter stack.
Set an ID to the Grid stack, use that ID in Filter > Target ID.
Construct your grid, assigning for each Width a distinct class: for example white
, black
, blue
etc.
Construct your filter using the Subnav, at Subnav item choose interaction: Filter.
For each Subnav item add the class entered in Grid Width, for example if you used white
then enter .white
(preceeded by a full stop).
Multiple filters
Define different classes and add any number of controls to filter them. The filter controls are exclusive, meaning just one criteria is filtered at a time.
Sorting
To sort items alphanumerically just add the sort attribute option to the filter control and define the meta data attribute by which the items should be sorted. By default, items are sorted in ascending order. Add the order: desc
to sort items in descending order.