Hide "gender" filter from certain collections on mobile

Solved

Hide "gender" filter from certain collections on mobile

PetitFox
Excursionist
19 0 6

Hello, I was looking for a way to hide a specific filter (gender) from certain collection pages (menino-2-6-anos, menina-2-6-anos, rapaz-7-12-anos and rapariga-7-12-anos).

 

I managed to get it to work on the desktop version by applying the code below in the theme.liquid just before the </head> tag, but it seems it's not working on the mobile version - I can still see the gender filter on those collections on mobile.

 

Can anyone help me adapt the code so it also works on mobile? I'm using the Dawn theme, and my website is petitfoxportugal.myshopify.com.

 

{% assign full_url = request.host | append: request.path %}
{% if full_url contains 'menino-2-6-anos' or full_url contains 'menina-2-6-anos' or  full_url contains 'rapaz-7-12-anos' or full_url contains 'rapariga-7-12-anos' %}
<style>
.disclosure-has-popup:has([aria-label="Género (0 selecionada)"]) {
    display: none!important;
}
</style>
{% endif %}

Captura de ecrã 2024-08-11, às 22.37.47.pngCaptura de ecrã 2024-08-11, às 22.38.02.png

Accepted Solution (1)

Made4uo-Ribe
Shopify Partner
7846 1896 2324

This is an accepted solution.

Hi @PetitFox 

Replace on this one. 

 

{% assign full_url = request.host | append: request.path %}
{% if full_url contains 'menino-2-6-anos' or full_url contains 'menina-2-6-anos' or  full_url contains 'rapaz-7-12-anos' or full_url contains 'rapariga-7-12-anos' %}
<style>
.disclosure-has-popup:has([aria-label="Género (0 selecionada)"]) {
    display: none!important;
}
.mobile-facets__details.js-filter:has([aria-controls="FacetMobile-1-template--23273162080605__product-grid"]) {
    display: none !important;
}
</style>
{% endif %}

 

And Save. 

Result:

Made4uoRibe_0-1723414906442.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Need THEME UPDATES but has custom codes? No worries, contact us for affordable price.

View solution in original post

Replies 2 (2)

Made4uo-Ribe
Shopify Partner
7846 1896 2324

This is an accepted solution.

Hi @PetitFox 

Replace on this one. 

 

{% assign full_url = request.host | append: request.path %}
{% if full_url contains 'menino-2-6-anos' or full_url contains 'menina-2-6-anos' or  full_url contains 'rapaz-7-12-anos' or full_url contains 'rapariga-7-12-anos' %}
<style>
.disclosure-has-popup:has([aria-label="Género (0 selecionada)"]) {
    display: none!important;
}
.mobile-facets__details.js-filter:has([aria-controls="FacetMobile-1-template--23273162080605__product-grid"]) {
    display: none !important;
}
</style>
{% endif %}

 

And Save. 

Result:

Made4uoRibe_0-1723414906442.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Need THEME UPDATES but has custom codes? No worries, contact us for affordable price.
PetitFox
Excursionist
19 0 6

It worked! Many thanks for this