Personalized checkout and custom promotions with Shopify Scripts
Is there a way to sort or filter products by whether they are on sale?
Currently I have 2 different scripts set up;
1. Using Shopify's default sort feature with ascending price, title etc.
<label for="SortBy"> Sort By </label>
<select name="SortBy" id="SortBy">
<option value="all" selected> All </option>
<option value="best-selling"> Popular </option>
<option value="created-ascending"> Latest</option>
<option value="price-ascending" selected> Price - Low to High </option>
<option value="price-descending"> Price - High to Low </option>
</select>
Shopify.queryParams = {};
if (location.search.length) {
for (var aKeyValue, i = 0, aCouples = location.search.substr(1).split('&'); i < aCouples.length; i++) {
aKeyValue = aCouples[i].split('=');
if (aKeyValue.length > 1) {
Shopify.queryParams[decodeURIComponent(aKeyValue[0])] = decodeURIComponent(aKeyValue[1]);
}
}
}
$(function() {
$('#SortBy')
.val('{{ collection.sort_by | default: 'all'}}')
.bind('change', function() {
Shopify.queryParams.sort_by = jQuery(this).val();
location.search = jQuery.param(Shopify.queryParams);
}
);
});
2. Sorting by tags:
<div>
<li class="clearfix filter">
{% assign tags = 'pendant, bracelet' | split: ',' %}
<select class="coll-filter">
<option value=""> Type </option>
{% for t in tags %}
{% assign tag = t | strip %}
{% if current_tags contains tag %}
<option value="{{ tag | handle }}" selected>{{ tag | capitalize }}</option>
{% elsif collection.all_tags contains tag %}
<option value="{{ tag | handle }}">{{ tag | capitalize }}</option>
{% endif %}
{% endfor %}
</select>
</li>
</div>
jQuery('.coll-filter').change(function() {
if (jQuery(this).val()) {
location.href = '/collections/' + jQuery(this).val();
}
else {
location.href = '/collections/all';
}
});
var collFilters = jQuery('.coll-filter');
collFilters.change(function() {
delete Shopify.queryParams.page;
var newTags = [];
collFilters.each(function() {
if (jQuery(this).val()) {
newTags.push(jQuery(this).val());
}
});
{% if collection.handle %}
var newURL = '/collections/{{ collection.handle }}';
if (newTags.length) {
newURL += '/' + newTags.join('+');
}
var search = jQuery.param(Shopify.queryParams);
if (search.length) {
newURL += '?' + search;
}
location.href = newURL;
{% else %}
if (newTags.length) {
Shopify.queryParams.constraint = newTags.join('+');
}
else {
delete Shopify.queryParams.constraint;
}
location.search = jQuery.param(Shopify.queryParams);
{% endif %}
});
I am thinking to either manually add 'SALE' tags to each individual discounted product, or filter by collection instead of tags, which gets messy because I can't do cross-filtering; ie. If product contains Tag A + Tag B.
User | RANK |
---|---|
4 | |
2 | |
2 | |
2 | |
2 |
Make the shift from discounts to donations, and witness your business not only thrive fina...
By Holly Dec 4, 2023On our Shopify Expert Marketplace, you can find many trusted third party developers and fr...
By Arno Nov 27, 2023You've downloaded the Search & Discovery app from the Shopify App store, and as you're ...
By Skye Nov 8, 2023