Note: The Toggle Post Filter can only be used once on a page (including widgets), and it cannot be used together with the shortcode or block of the Dynamic Post Filter.
This feature consists of four blocks that you can place at different locations of the page, including widgets. The main part is the menu block and here you supply almost all parameters.
- Toggle Post Filter – Menu (required)
- Toggle Post Filter – Posts (required)
- Toggle Post Filter – Message Field (optional)
- Toggle Post Filter – Reset Button (optional)
- Toggle Post Filter – Slider Button (optional, only for the slider layouts)
- Toggle Post Filter – Order menu (optional)
Instead of the Reset Button block you can also use the default WordPress button block and enter “tg_dpf_toggle_reset_button” as “Additional CSS class(es)”.
Please make sure you don’t use the “legacy” menu block. This block is still functional but its options have been migrated to the posts block.
The following options appear in the editor side panel after you selected a block. Some of them appear only when you activated the corresponding function. For example, you can set the title of the search field only after you activated text search.
You find post-related options in the post (body) block.
Use only tags from selected taxonomies (“tag types”). Available are only taxonomies that have been enabled in the Settings. If you leave this option empty, we use all enabled taxonomies.
Restricts the tags that should be used. If you leave this option empty, we use all tags of selected groups and taxonomies.
Restricts the tags that should be excluded.
How the tags should be logically connected. Possible values are:
- any tag matches (“IN”/”OR”): One or more tags in any group must match the post tags for a post to be displayed.
- all tags match (“AND”): All tags across all tags must match.
- at least one tag matches from each group (“IN AND”):
Groups where no tags are selected won’t be considered. If you use AND or IN AND on five groups and a visitors selects only tags from the first two groups, they may already see posts. The unused other three groups don’t count in.
Lets you determine the order of the tags (terms).
A custom sort order is available with a 3rd-party plugin.
Whether to sort the tags in ascending or descending order.
Hide tags that are not being used in (public) posts.
Lets you initialize the filter with a selected toggle set to on. See the information under Preset Tags.
Select tag groups that will be shown to visitors. By default all your groups will appear.
Adds a text search field at the beginning of the menu. The entered word can be prepended with a minus so that it will be excluded. The logical connection with other search criteria is always AND, which means that the text search can narrow down the list of posts that was determined by the other search criteria.
Options:
- off: no text field appears
- on enter: Search begins when you press ‘enter’.
- on enter or timed: Search begins when you press ‘enter’ or when you pause typing.
Time in minutes that the selection of posts that match the search criteria should remain available for faster access on the server.
The Toggle Post Filter can optionally remember the selection of groups and tags so that your visitors who clicked on an article and then return to this page will see the same list of articles again. If no post has been clicked, the page will scroll to the group selection menu.
This option requires that visitors accept cookies in their browsers. If you are using this filter more than once on your site, you should use different values for div_id so that each filter uses a different cookie.
Optionally filter also by terms of an additional taxonomy (not necessarily one of the taxonomies used for tag groups). You can, for example, show only posts that belong to a particular category.
See static taxonomy above. Here you select the terms (tags, categories).
Title above the text search field.
Placeholder message for the text search field.
Layout of the menu part, containing the toggles.
- classic: The menu items appear vertically stacked in a narrow container. Posts display on the right side. If you select “classic” for the menu, also the body part with the posts should use the “classic” layout.
- buttons: Like the classic layout, but instead of toggles we use buttons. Optionally show an icon on active buttons.
- classic with tags: The menu is arranged like the “classic” layout. Tags appear in a tag shape and line up in rows (like in tag clouds).
- wide: Groups are lined up horizontally. Posts should display below the menu. If you select “wide”, the post layout can be any of wide, boxed, columns, columns-avoid-break and masonry.
- wide with buttons: Like the “wide” layout, but instead of toggles we use buttons. Optionally show an icon on active buttons.
- wide with tags: The menu is arranged like the wide layout. Tags appear in a tag shape and line up in rows (like in tag clouds).
- slider left: The menu slides in from the left side, covering the contents of the page. The slider remains open while you click on the buttons so that you scroll through the search results while the menu remains open. Consider composing the page in a way that the slider doesn’t cover the posts.
You close the menu by clicking on the X or outside the slider. For the slider you will also need the button to open the slider. The slider uses buttons with optional icons. - slider left with tags: The menu is arranged like the “slider left” layout. Tags appear in a tag shape and line up in rows (like in tag clouds).
- slider right: The same as the left slider, opening from the right.
- slider right with tags: The menu is arranged like the “slider right” layout. Tags appear in a tag shape and line up in rows (like in tag clouds).
Place an icon on active buttons. (Not available with toggles.) Some common icons are available as buttons. For other icons you need to convert the block to a shortcode.
Set the width of the slider menu in pixels. Only available with the “slider left with tags” and the “slider right with tags” menu layouts.1
Set the background color of the tags. Only available with the “slider left with tags” and the “slider right with tags” menu layouts.
Set the background color of the tags that are toggled on in the filter. Only available with the “classic with tags”, “wide with tags”, “slider left with tags” and the “slider right with tags” menu layouts.
The plugin comes with two default themes, light and dark.
Display each group as an accordion where toggles are hidden under the group label. If you use the option “Remember selected filter and post”, all groups that contain active toggles will be open.
Please note that also hidden toggle switches are effective.
You can set here classes to be referred to in CSS. You need some knowledge of CSS to create your own theme.2
Define a class for the <div>.
Define an ID for the enclosing <div>.