Collection Filters
On pages with a "Collection Container", "URL Filter" can be used to filter the displayed entries in the Collection Container. For example, a click on a button can be used to display all entries about houses. Also, the sorting order can be adjusted. This way you give the website visitors the possibility to show only entries they are especially interested in.
In order to use URL filters, you have to activate them by checking the box "Consider URL filters" in the Collection Container:
If the item with the link is located within a collection container, Sitejet can even set this URL filter automatically. Just switch to the "Link" tab and select "Collection Filter" as link type:
This article, however, deals with the use of individually composed URL filters. How all this works is explained below:
Filter by fields
In general, it is possible to filter by checkbox, date and text fields. To filter by one (or more) fields, the same URL structure is always required:
COLLECTION-CONTAINER-PAGE#!filter[columns.*FIELD*]=*OPERATOR*:*VALUE*
Please replace *COLLECTION-CONTAINER-PAGE*, *FIELD*, *OPERATOR* and *VALUE* as follows:
- *COLLECTION-CONTAINER-PAGE*: This is the URL to the page, where the collection container exists:
- If the collection container is on the same page, this part can be omitted
- For example, if the collection container is located on the "blog" page and the "slug" to the blog page is "/blog", simply replace *COLLECTION-CONTAINER-PAGE* with "/blog
- *FIELD*: The field key usually corresponds to the field name in the collection itself and can be requested by clicking on "More" and selecting "Collections Manager". There you will click on the cog icon for the collection you want to edit (1.), then you will click on the field for that you want the key (2.) and below label, you will find the key (3.):
- *OPERATOR*: The following options can be used as a comparison operator if the value of the field should not exactly match the *VALUE*.
- lt: lower than
- lte: lower than / equal
- gt: greater than
- gte: greater than / equal
- notEqual: not equal
- *VALUE*: Depending on the field type, it is necessary to specify the value to be filtered by in a certain format.
- Choice: The value must be URL-coded, including upper and lower case, which means that characters (e.g. the space character) must be replaced by a specific character string (%20).
- Checkbox: The value is either "1" for "selected" or "0" for "not selected (without quotes)
- Date: The date must be entered in the format "YYYY-MM-DD" without quotation marks, where "YYYY" is the year, "MM" is the month and "DD" is the day (with a leading "0" for numbers below "10"). In addition to an exact date, "now" can also be used. In combination with the comparison operator "lte", you can filter for all entries, which have a date value of today or in the past.
- Text fields: For texts it is only possible to filter for exact texts
Example:
For this example imagine the following scenario:
- Only entries with a date field named "published on" and a date after 23.03.2020 should be displayed
- The Collection Container is located on the page with the slug "/blog".
- The entries should be displayed after clicking a button
Assign the following link to the button:
/blog#!filter[columns.published_at]=gt:2020-03-23
Several filters are concatenated with the help of an "&" sign. For example, you could additionally filter according to the author. Then the filter URL would look like this:
/blog#!filter[columns.published_at]=gt:2020-03-23&filter[columns.author]=John%20Doe
Adjust order
Also the order of the collection entries to be displayed can be adjusted. In doing so, an additional parameter is appended to the URL. The general format for changing the order looks like this:
order=columns.*FIELD*_*DIRECTION*
Please replace *FIELD* and *DIRECTION* as follows:
- *FIELD*: As already mentioned in section "Filter by Fields", the respective field is uniquely identified by the field identifier
- *DIRECTION*: Here you specify the order in which the collection entries should be sorted according to the field specified by "Field key":
- ASC: ascending order (A-Z)
- DESC: descending order (Z-A)
If all entries of the blog described above are to be sorted in descending order by publication date, the corresponding URL part for the order could look as follows:
/blog#!order=columns.published_at_DESC
If you now want to combine both filters from the "Filter by Fields" section and the order from this section, the URL will look like this
/blog#!filter[columns.published_at]=gt:2020-03-23&filter[columns.author]=John%20Doe&order=columns.published_at_DESC
Limit results
In addition to filtering and sorting you can also limit the number of entries to be displayed. You do this with the keyword "limit". For example, if you only want to display 3 entries, the URL would be as follows:
/blog#!limit=3
You can also specify that not the first entries should be displayed, but entries at a certain position. Use the keyword "Offset" for this. "Offset" moves the selection of entries to be displayed. For example, if you want to display the 4th, 5th and 6th entry, use the following URL:
/blog#!limit=3&offset=3
Become a part of our Community!
Exchange ideas with other web designers about current developments, tips, and tricks and show your favorite sites. Get advice and talk to us about possible features you would like to see on Sitejet. You can join the Sitejetters community here.
