Prints the tools for selecting product filter values.
Kuvaus
The tag is available starting from the Basic plan.
See the detailed instructions on how to implement product filters in a theme.
By default, the tag prints a <ul>
list of available product filter values. You can format the selection tools according to your preferences in the helper
attribute.
Syntaksi
{FilterOptions(
helper: string
)}
Näkyvyys
Toimii näkyvyydessä: product-list-filter
Näkyvyys
The tag is used only in the {ProductListFilters}
tag's helper
attribute.
Implementing product list filters
Below you can see a simple implementation of product filters on a product category's product list:
{ProductListFilters(
before: '<div class="ProductListFilters">',
helper: {{
{Filtername(before: '<span class="FilterName {FilterClass}">', after: '</span>')}
{FilterOptions(
before: '<ul class="FilterOptions">',
helper: {{
<li>
<a href="{FilterOptionSelectUrl}">{FilterOptionName} ({FilterOptionResultCount})</a>
</li>
}},
after: '</ul>'
)}
}},
after: '</div>'
)}
{Products}
Filters are added before the product list by using the {ProductListFilters} tag.
The list includes the name of each filter ({FilterName}
) and available values ({FilterOptions}
).
For each available value, the following are printed:
- a link for enabling the value (
{FilterOptionSelectUrl}
) - the value's name (
{FilterOptionName}
) - the number of products found by each value (
{FilterOptionResultCount}
)
The implementation in this example doesn't exclude the option to disable filters. For this, see detailed instructions on how to implement product filters in a theme.
Attribuutit
helper:
Defines the content and output format of a single list element.
Allowed values: the Interface and HTML markup that define the output's markup and content.
The
helper
attribute can be used in two ways:- you can indicate the desired markup directly as the attribute's value, or
- you can indicate a reference to a file with the desired markup as the attribute's value.
The reference should be indicated in relation to the theme's root directory.
See also detailed instructions on using the
helper
attribute.after/before:
By using the
after
andbefore
attributes you can define content that is output either after or before the tag's output.Allowed values:The HTML and Interface markup
E.g.
before:
'<p>Tämä merkkaus näkyy ennen tagin omaa sisältöä.</p>'after:
'<p>Tämä taas näkyy tagin oman sisällön jälkeen.</p>'
If the tag does not produce any content, neither the content of the
after
andbefore
attributes will be output.escape:
Adds an escape character before quotation marks in the output.
The attribute makes it easier to process the tag-produced content when using JavaScript.
Allowed values:true/false. The default value is false.
or:
Defines alternative content that is displayed if the tag itself does not produce any content.
Allowed values:The HTML and Interface markup
E.g.
or:
'Sisältöä ei löytynyt.'