It is difficult to help in this capacity because without purchasing the theme I cannot access the underlying Liquid code.
That said, I have a general idea of how it’s set up and am assuming it is utilizing the Vendor for the “Brand” listing but that is not necessarily relevant to the code unless you want to specifically target a filter.
The code should have something like this:
for filter in collection.filters
Within that you will want to check the for active values and the inactive values:
Thank you for your code suggestions. The initial question was related to the Warehouse os2 Theme, which I’m currently building out from the pre os2 version. However, since I’m new to Liquid, I wanted a more generic solution so that I may learn and apply to other themes in the future!
Yep, the solution I shared is as generic as it can get because it assumes the basic Liquid objects available to any hosted Shopify storefront. It’s a simple conditional that checks if the current filter in the loop of filters has more than one value and if it does output that filter and its values. You should be able to use that in any theme except the “filter.” may change depending on if that theme stored the filter in a variable of a different name.
I’m trying to solve this same problem using Dawn 2 theme, I’ve tried patching your code into the Filter.Filter.Liquid code snippet but it hasn’t worked for me. Do you know where I need to paste the code?
If I may share what worked for me since I was unsure where to place the code above. I’m using the Minion theme and not sure this will work with others but this is the gist of what I did for what it’s worth.
I installed the free XO Insert Code app and activate for Header in theme customization
I added this code as JavaScript
// Loop sidebar filter elements to hide those with only one option
window.addEventListener('load', function (event) {
// Desktop
const elements = document.querySelectorAll('#FacetFiltersForm .chm-toggle');
elements.forEach(element => {
if (element.querySelectorAll(".facets__item").length <= 1) {
element.style.display = 'none';
}
});
// Mobile
const mobile_elements = document.querySelectorAll('#FacetFiltersFormMobile .mobile-facets__main__content details');
mobile_elements.forEach(element => {
if (element.querySelectorAll(".facets__item").length <= 1) {
element.style.display = 'none';
}
});
});
Hopefully this will be useful to someone. I’m not new to web development but I am new to Shopify so if there’s a better way of doing this, let me know.