Filtering options not available on mobile

Topic summary

Mobile product filtering on a Shopify collection page was not appearing on mobile while working on desktop. The store owner requested a fix and shared the store URL.

A solution was provided via Theme Settings > Custom CSS, adding a mobile-specific CSS rule:

  • Use an @media query for max-width: 768px.
  • Target .facets-container.scroll-trigger and its children (*) to adjust styling.
  • Code: @media screen and (max-width: 768px){ .facets-container.scroll-trigger * { color: #637ED9 !important; } }

This change likely addressed visibility/contrast of the filter UI on mobile, making the options readable/accessible. The user confirmed the fix worked.

Key terms:

  • Custom CSS: A theme setting in Shopify to add style overrides without editing theme files.
  • @media query (max-width: 768px): Applies styles to smaller screens, typical for mobile.
  • facets-container: The filter UI container on collection pages; “scroll-trigger” indicates styles applied when the page scrolls.

Attachments: A code snippet was central; screenshot links were provided to illustrate settings and results.

Outcome: Issue resolved; no further actions requested. Discussion closed.

Summarized with AI on December 15. AI used: gpt-5.

Hi,

The filtering options for viewing products on desktop is working fine, but for mobile it does not come up. Is someone able to please fix this for me?

1 Like

Thank you! What do you need?

Hi @megwirges

Could you please share with me your store URL?

Best,

Daisy

mwrentalsbendigo.myshopify.com

1 Like

Hi @megwirges

To complete your requests, please follow these steps:

  1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
  2. Paste the code provided into the Custom CSS section.
@media screen and (max-width: 768px){
.facets-container.scroll-trigger * {
    color: #637ED9 !important;
}
}

Here is the result: https://prnt.sc/NmSgiz2YgNJu

I hope this helps

Best,

Daisy

Thank you so much! That worked.