So I implemented @sabanna 's mixitup filtering for dynamic content. When I set two elements in the “mix” collection item with the same category, it doesn’t work. It only works when only one element has the category. How can we make it work for two elements?
Secondly, how can we make it bring up an element that partially matches the category? For example, if the control button has the category/data attribute “large” , but in the “mix” item the text is “large box”, it still should pull up. How to ago about that?
Issue 1: When you filter by “title” in the controls up top, it works great cause only 1 element in the collection items down below has the corresponding class (.mix-title). But when you filter by “office” up top, since 2 elements below have the corresponding class of .mix-office, it doesn’t work.
Secondly, if you try to filter by Practice up top (such as clicking on “Mediation” up top) , I’d like it to filter the records that have the word “Mediation” included in the rich text (which has the class mix-practice).
Each filter button has a data-filter attribute that has its own value. Plugin is searching through the items inside the container, that has the classnames matching those values.
For example: clicking on the button with data-filter=".miami-fl"
will make the plugin look for the item that has exact same classname miami-fl.
In your example, there is no such classname exist, because generated classname contains some other words in it, which makes it not matching the plugin request
The reason is that you have 2 elements with same class .mix-office. The code snippet, that you are using for generate classnames for dynamic items, putting text from both of them in ONE CLASS, which causes extra words in the classname and, as a result, does not match any data-filter attributes.
One of the ways to fix it: rename class on the 2nd element with the office address
As I described above, filtering plugin looking for the items with the certain classnames and it will not work the way you are requesting, unless you will make sure such specific classes applied to your dynamic items.
Currently, since it is several paragraphs inside ONE element with the class mix-practice it takes all the text inside the rich text and create ONE class from it.