Shopify themes, liquid, logos, and UX
How to make all the filter section and sort section completely transform to uppercase and sticky
Hello @Sivadarshan
Go to online store ----> themes ----> actions ----> edit code ---->base.css
add this code at the end of the file and save.
span.mobile-facets__open-label.button-label.small-hide {
text-transform: uppercase;
}
.facet-filters__sort {
text-transform: uppercase;
}
.facet-filters__field {
text-transform: uppercase;
}
h2.product-count__text.text-body {
text-transform: uppercase;
}
result
If this was helpful, hit the like button and accept the solution.
Thanks
Hello @Sivadarshan
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:
.mobile-facets__open-label {
text-transform: uppercase;
}
.facet-filters__field {
text-transform: uppercase;
}
.facet-filters__field .select__select, .mobile-facets__sort .select__select {
text-transform: uppercase;
}
span#ProductCount {
text-transform: uppercase;
}
Hello @Sivadarshan , Try this
span.mobile-facets__open-label.button-label.small-hide,
.facet-filters__sort,
.facet-filters__field,
h2.product-count__text.text-body {
text-transform: uppercase;
}
It's working thanks, but when I tried to change the font size, the sort section alone not changing the size.
Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025Discover opportunities to improve SEO with new guidance available from Shopify’s growth...
By Jacqui May 1, 2025