Solved

Remove Filter-by on collections page | Modular Theme

nickoreed
New Member
4 0 0

Hi, 

I want to remove the series of drop down filters on my collection pages. See attached screenshot.

Using Modular theme

Screen Shot 2020-10-01 at 16.26.44.png

Accepted Solution (1)
oscprofessional
Shopify Partner
15833 2369 3072

This is an accepted solution.

Add this css

.collectionGrid-nav.collectionGrid-row.row.inline.row-lg .collectionGrid-clearall.block.search-button {
    display: none;
}
Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing

View solution in original post

Replies 7 (7)

oscprofessional
Shopify Partner
15833 2369 3072

Hello nickoreed,
Please share your site url.
So that i can check and let you know the exact solution here.

Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
nickoreed
New Member
4 0 0
oscprofessional
Shopify Partner
15833 2369 3072

Hello nickoreed,
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->styles.scss.liquid

.collectionGrid-nav.collectionGrid-row.row.inline.row-lg .collectionGrid-filter.block {
    visibility: hidden;
}
@media screen and (max-width: 767px){
.collectionGrid-nav.collectionGrid-row.row.inline.row-lg .collectionGrid-filter.block {
    display: none!important;
}
}
Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
nickoreed
New Member
4 0 0

This has almost worked perfectly. Unfortunately the search and clear buttons are still visible.

 

Screen Shot 2020-10-01 at 17.00.05.png

oscprofessional
Shopify Partner
15833 2369 3072

This is an accepted solution.

Add this css

.collectionGrid-nav.collectionGrid-row.row.inline.row-lg .collectionGrid-clearall.block.search-button {
    display: none;
}
Get pass your Store Core Web Vital Free Speed Optimization Audit, Chat on WhatsApp | Skype : oscprofessionals-87 | Email: pallavi@oscprofessionals.com | Custom Pricing Wholesale App : Free | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify Private App | Shopify SEO | Digital Marketing
nickoreed
New Member
4 0 0

Thanks a lot!

joolswilliams
Visitor
1 0 0

Hi There .. I'm trying to do the same in terms of removing the filters on modular theme from the collection pages .. but I don't have the 'styles.scss.liquid' under assets ? .. URL is www.sciencetoskin.com ... any ideas ?