Closing some filters on collection page

LucieGuilbault
Tourist
8 1 0

Theme : Chromium 4.0

Store URL : https://ciklet-cc.myshopify.com/

 

Hi, 

I'm using Chromium Theme on my Shopify Store. I would like the following filters to be hidden by default on the collection page, and when clicked, they open :

- Taille du Cycliste

- Marque

- Prix

How is that possible please? Here is the collection page URL :  https://ciklet-cc.myshopify.com/collections/all

 

Thanks in advance

Replies 2 (2)

Jasoliya
Shopify Expert
4807 621 1213

Hi @LucieGuilbault 

add below code in layout/theme.liqud file just before </body>

var mob_tab = document.querySelectorAll(".sb-title")
mob_tab.forEach(function(tab_click) {
    tab_click.addEventListener("click", (e) => {
        tab_click.closest('.filter-group').querySelector('.tags-list').classList.toggle("ac");
    });
})

 

Add this css in Asset/_20_filter-collections.scss at bottom

.tags-list{0 !important}
ul.tags-list.ac { max-height: 200px !important; }
Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel
Want to get Free review and advice for sale on store ?? just text me here
LucieGuilbault
Tourist
8 1 0

Hi, 

 

I tried the code but I couldn't find the "_20_filter-collections.scss" (it doesn't exist in my theme code). 

Screen Shot 2023-12-29 at 10.07.27 am.png

 

Thanks