Shopify themes, liquid, logos, and UX
I couldn't find this anywhere. Any advice would be very helpful! :).
As in this sort filter box are generate by liquid code so you ahve not any option to change code. but instead of we have one way like you can add custom select box.
Go to Snippet->collection-sorting.liquid and fine below code:
<select name="sort_by" id="SortBy" class="btn--tertiary" aria-describedby="a11y-refresh-page-message">
{% for option in collection.sort_options %}
<option value="{{ option.value }}"{% if sort_by == option.value %} selected="selected"{% endif %}>{{ option.name }}</option>
{% endfor %}
</select>
Now you can remove this and add this custom box and change whatever you want but dont change value of option
<select name="sort_by" id="SortBy" class="btn--tertiary" aria-describedby="a11y-refresh-page-message">
<option value="manual">Featured</option>
<option value="best-selling">Best selling</option>
<option value="title-ascending">Alphabetically, A-Z</option>
<option value="title-descending">Alphabetically, Z-A</option>
<option value="price-ascending">Price, low to high</option>
<option value="price-descending">Price, high to low</option>
<option value="created-ascending">Date, old to new</option>
<option value="created-descending">Date, new to old</option>
</select>
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024