How do i delete one of the options on the SortBy dropdown menu?

fucsun
Tourist
6 0 0

I want to get rid of the alphabetical options and the date options but can't find the code to do so.  Can anyone help me out?

 

Thank you in advance!

 

Screen Shot 2019-04-28 at 10.37.30 PM.png

Replies 79 (79)

Jasoliya
Shopify Expert
4820 625 1224

Hi,

I think its Boundless theme if so then follow bellow:

1. Go to Online Store->Theme->Edit code
2. Section->collection-template.liquid->find  id="SortBy" and remove option from here and save.

Note:If not then send me your store URL and theme name.

Let me know if you want help.

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
fucsun
Tourist
6 0 0

That would be only if I wanted to delete the entire thing but I only want to delete a few options. 

Website URL: Fucsun.com

theme: Boundless

Jasoliya
Shopify Expert
4820 625 1224

Yes, from this instruction you can remove any option from select box.

You can see like this on page:

 <select name="SortBy" id="SortBy" data-value="{{ collection.sort_by | default: collection.default_sort_by | escape }}">
          <option value="manual">{{ 'collections.sorting.featured' | t }}</option>
          <option value="best-selling">{{ 'collections.sorting.best_selling' | t }}</option>
          <option value="title-ascending">{{ 'collections.sorting.az' | t }}</option>
          <option value="title-descending">{{ 'collections.sorting.za' | t }}</option>
          <option value="price-ascending">{{ 'collections.sorting.price_ascending' | t }}</option>
          <option value="price-descending">{{ 'collections.sorting.price_descending' | t }}</option>
          <option value="created-descending">{{ 'collections.sorting.date_descending' | t }}</option>
          <option value="created-ascending">{{ 'collections.sorting.date_ascending' | t }}</option>
   </select>

Remove bellow line from above code 

<option value="title-ascending">{{ 'collections.sorting.az' | t }}</option>
<option value="title-descending">{{ 'collections.sorting.za' | t }}</option>

Let me know if you need help.

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
fucsun
Tourist
6 0 0

I'm not given that option mine says this

 

 

Screen Shot 2019-05-10 at 11.22.10 AM.png

Jasoliya
Shopify Expert
4820 625 1224

Change like this:

 

{% for option in collection.sort_options %}
    {% unless option.value contains 'title-ascending' or option.value contains 'title-descending'  %}
        <option value="{{ option.value }}" {% if sort_by == option.value %} selected="selected" {% endif %}>{{ option.name }} </option>
    {% endunless%}
{% endfor%}

Note: just add unless and endunless condition 

 

Let me know if need help.

 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
arpitbanati
Visitor
2 0 0

Thanks, your answer was of great help to me.

I am new to Shopify and don't know much about it, so my first approach was to edit 'sort_options' object from which the for loop is extracting all the options but I couldn't find where all the data is defined. It would be very helpful if you could tell me where is this 'collection'/'sort_options' object stored or from where this theme is pulling all its data.

 

Thanks in advance.

Jasoliya
Shopify Expert
4820 625 1224

Hi @arpitbanati 

You can find this code in 

1. Go to Online Store->Theme->Edit code
2. Section->collection-template.liquid->find  id="SortBy" 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
sierramoon
Visitor
1 0 0

Hi! This was very helpful in addition to removing the alphabetical option can you advise how to remove the 'date, old to new' date, new to old'

Thank you! 

Johanna14
New Member
4 0 0

How can I change the possibilities, when I have this code:

<label for="SortBy" class="hidden-label">{{ 'collections.sorting.title' | t }}</label>
<select name="SortBy" id="SortBy">
<option value="title-ascending"{% if sort_by == collection.default_sort_by %} selected="selected"{% endif %}>{{ 'collections.sorting.title' | t }}</option>
{% for option in collection.sort_options %}
<option value="{{ option.value }}" {% unless default_sorted %}{% if option.value == sort_by %}selected="selected"{% endif %}{% endunless %}>{{ option.name }}</option>
{% endfor %}
</select>
</div>

 

The problem is: When i put your code in, I get this:

Translation missing en.collections.sortings.az

Jasoliya
Shopify Expert
4820 625 1224

Try this

<select name="SortBy" id="SortBy" data-value="{{ collection.sort_by | default: collection.default_sort_by | escape }}">
          <option value="manual">manual</option>
          <option value="best-selling">best selling</option>
          <option value="title-ascending">title ascending</option>
          <option value="title-descending">title descending</option>
          <option value="price-ascending">price ascending</option>
          <option value="price-descending">price descending</option>
          <option value="created-descending">reated descending</option>
          <option value="created-ascending">created ascending</option>
   </select>
Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
Johanna14
New Member
4 0 0

Cool, that worked! 😄 Thanks a lot!! 😄

Jasoliya
Shopify Expert
4820 625 1224

Which theme you have? because all code diffident for theme wise ..send store url 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
Satinski
Tourist
20 0 2

Hi there, I have Impulse theme and I use "Product filter & search by boost commerce" if that means something.

Here is my URL: www.satinski.com

Thank you for your advice!

Jasoliya
Shopify Expert
4820 625 1224

This box generating by filter app, so you can do simple this css 

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file

.boost-pfs-filter-top-sorting-select [value="created-descending"],.boost-pfs-filter-top-sorting-select [value="created-ascending"]{display:none;}

 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
Satinski
Tourist
20 0 2

Hi there, that worked, thank you! However, I would love to dismiss also the alphabetical order (both A-->Z Z-->A). What should the code look like in this case? Thanks a lot in advance!

Jasoliya
Shopify Expert
4820 625 1224

@Satinski  add this:

.boost-pfs-filter-top-sorting-select [value="title-ascending"],.boost-pfs-filter-top-sorting-select [value="title-descending"]{display:none;}

 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
Satinski
Tourist
20 0 2

Thanks a lot once again. I think I misspoke myself: I would like to dismiss both filters: Date and Alphabetical (4 items in total). By adding your last code I dismissed the alphabetical one but the date stayed there. The same happened when I pasted both codes together. Thanks for your help!

Jasoliya
Shopify Expert
4820 625 1224

add this line too:

.boost-pfs-filter-top-sorting-select [value="title-ascending"],.boost-pfs-filter-top-sorting-select [value="title-descending"]{display:none;}
Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
Satinski
Tourist
20 0 2

Thanks a lot!

The trick was in adding both of the codes:

.boost-pfs-filter-top-sorting-select [value="title-ascending"],.boost-pfs-filter-top-sorting-select [value="title-descending"]{display:none;}
.boost-pfs-filter-top-sorting-select [value="created-ascending"],.boost-pfs-filter-top-sorting-select [value="created-descending"]{display:none;}

Thank you! 🙂

flybypinay
Visitor
3 0 0

Hi, would you be able to help me with removing a few sorty by options? I only want price low to high and best seller. I tried to follow what you have said here but I am having difficulty. We have empire theme. I don't see where I can change in the language editor. Thanks! 

Jasoliya
Shopify Expert
4820 625 1224

Hi @flybypinay 

Send your store url

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
flybypinay
Visitor
3 0 0

Hi Thanks for responding. The store id is: stoner-wishlist.shopify.com

Jasoliya
Shopify Expert
4820 625 1224

Add this  css in Asset->theme.scss file at bottom:

#product_grid_sort [value="manual"],#product_grid_sort [value="best-selling"],#product_grid_sort [value="title-ascending"],#product_grid_sort [value="title-descending"],#product_grid_sort [value="price-descending"],#product_grid_sort [value="created-ascending"],#product_grid_sort [value="created-descending"]{display:none;}
Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
flybypinay
Visitor
3 0 0

Thank you for your response! Unfortunately, it didn't work. 

Jasoliya
Shopify Expert
4820 625 1224

Follow this 

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss Or theme.css-> paste bellow code in bottom of file

#SortBy  [value="title-ascending"],#SortBy  [value="title-descending"],#SortBy  [value="best-selling"]{display: none;}

 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
Mark118
Excursionist
55 0 4

Fantastic - spot on. Really appreciate this!

On a side note, do you know if it's possible to change the order? Ideally, I'd have:-

  • Featured
  • Date, new to old
  • Price, low to high
  • Price, high to low
  • Alphabetically, A-Z

Untitled1.png

Jasoliya
Shopify Expert
4820 625 1224

I have checked and its work fine, but if you are checking on IOS safari then it will not work as for IOS safari not support this, so for that must need custom Js code or liquid code manage. 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
RetroMarche
Tourist
7 0 1

Hi, i am using debut theme and i have been following your steps and options gone, but there's old options below sorting box

my shop is retromarche.pl/collections/all

   <select name="SortBy" id="SortBy" data-value="{{ collection.sort_by | default: collection.default_sort_by | escape }}">
          <option value="manual">manual</option>
          <option value="price-ascending">price ascending</option>
          <option value="price-descending">price descending</option>
   </select>

 Zrzut ekranu 2020-10-24 o 18.26.05.png 

and is it possible to show for example price ascending while i choose price ascending? because it always shows manual when i choose different sorting option

 

thanks in advance

Jasoliya
Shopify Expert
4820 625 1224

You have already price low and price height option. what you want to do now? 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
Lusso
Tourist
3 0 1

Hello, I have the same problem "is it possible to show for example price ascending while i choose price ascending? because it always shows manual when i choose different sorting option"? 

I used this code:

<select name="SortBy" id="SortBy" data-value="{{ collection.sort_by | default: collection.default_sort_by | escape }}">
<option value="manual">Recomandat</option>
<!--<option value="title-ascending">title ascending</option>-->
<!--<option value="title-descending">title descending</option>-->
<option value="price-ascending">Pret, de la mic la mare</option>
<option value="price-descending">Pret, de la mare la mic</option>
<option value="best-selling">Cele mai vandute</option>
<!--<option value="created-descending">reated descending</option>-->
<!--<option value="created-ascending">created ascending</option>-->
</select>

 

Could you help me? Thank you and have a nice day!

JulieWipeout
Excursionist
11 1 2

store www.wipeoutstore.com

 

Theme is Debut

 

I'd like to just remove the option to sort by Featured collection, price and date low to high. I'd like to keep bestsellers and A-Z, Z-A.

 

Thanks in advance, Julie

Jasoliya
Shopify Expert
4820 625 1224

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file

#SortBy [value="manual"],#SortBy [value="price-ascending"],#SortBy [value="price-descending"],#SortBy [value="created-ascending"],#SortBy [value="created-descending"]{display:none;}

 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
JulieWipeout
Excursionist
11 1 2

thank you! It worked 

Marie_C
Visitor
2 0 0

Hello !

I need help for theme Supply

i have this code in Snippets  -> collection-sorting.liquid

 

 

<div class="form-horizontal">
{% assign sort_by = collection.sort_by | default: collection.default_sort_by %}
<label for="sortBy" class="small--hide">{{ 'collections.sorting.title' | t }}</label>
<select name="sort_by" aria-describedby="a11y-refresh-page-message" id="sortBy">
{% for option in collection.sort_options %}
<option value="{{ option.value }}"{% if sort_by == option.value %} selected="selected"{% endif %}>{{ option.name }}</option>
{% endfor %}
</select>
</div>

<script>
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')
// select the current sort order
.val('{{ collection.sort_by | default: collection.default_sort_by | escape }}')
.bind('change', function() {
Shopify.queryParams.sort_by = jQuery(this).val();
location.search = jQuery.param(Shopify.queryParams).replace(/\+/g, '%20');
}
);
});
</script>

 

How can i remove some options i dont need ?

 

Jasoliya
Shopify Expert
4820 625 1224

Send me your store url and option that and hat want to remove.

 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
JulieWipeout
Excursionist
11 1 2

Hi there, your code has worked for www.wipeoutstore.com when viewed on a brower, but doesn't seem to have worked when viewed on a mobile? Can you fix that also? Julie

Jasoliya
Shopify Expert
4820 625 1224

i can see its working fine. send me image where you see its not working on mobile. 

 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
JulieWipeout
Excursionist
11 1 2

Screenshot mobile menu.jpeg

Jasoliya
Shopify Expert
4820 625 1224

Ohh i see, that because of hide proper not work on IOS safari on drop down.

for that need to make custom Js code or by liquid code to manage it cant we do by css. you can follow previous post if that help you for that you need code knowledge 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
winewarehouse
Tourist
14 0 1

Hi I am trying to remove these options below from the sort by drop down and I am not sure how to from my code. I have the debut theme. 

Alphabetical, A-Z

Alphabetical, Z-A

Date, old to new

Date, new to old

 

Can someone please assist?

 

Thanks,

Alana 

Jasoliya
Shopify Expert
4820 625 1224

Send me store url will help

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
Mark118
Excursionist
55 0 4

Hi @Jasoliya

Would it be possible to help.... 

I have the Impulse theme (frontiers-woman.com) - hoping to remove:-

  • Alphabetical, Z-A
  • Best selling
  • Old to new

Many thanks in advance.

Best, 

Mark

winewarehouse
Tourist
14 0 1

Can you help me add back in ?

Date, old to new

Date, new to old

JulieWipeout
Excursionist
11 1 2

Is it possible for you to put the instructions for how to remove the Sort By options: Featured, Old to New and New to Old.

 

Theme Debut.

 

Thank you!

Pupxury
Visitor
1 0 0

Hello Jasoliya,

I used your code edits to remove “ascending” and “descending” from the theme boundless I am using. It worked for me, so thank you. I did have a question regarding this same drop down menu, is there any way to have the new selected option be “best-selling”? I cannot seem to figure it out on my own.

Thanks in advance to anyone who can assist me with this!

Jasoliya
Shopify Expert
4820 625 1224

yes for best selling option you can add below html as option

<option value="best-selling" >Best selling</option>

 

Best regard 

Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
Jasoliya
Shopify Expert
4820 625 1224

Add this code in theme.css at bottom

#sort-list li [data-name="Featured"],#sort-list li [data-name="Alphabetically, A-Z"],#sort-list li [data-name="Alphabetically, Z-A"],#sort-list li [data-name="Date, old to new"],#sort-list li [data-name="Date, new to old"]{display: none;}
Want custom changes? hire me.
3 months of Shopify for $1/month. Look here.
Email us Or WhatsApp, Try our Free app for product bundles and Codify Order Cancel or Order edit
Want to get Free review and advice for sale on store ?? just text me here
Fsafari
New Member
5 0 0

Thank you so much. But some pages are still showing featured as the default. Not all have been fixed 

SociallyUnique
Visitor
3 0 0

Hi there,

 

I wanted to remove "Featured" from my drop down menu. I followed your instructions, but I can't seem to find this line item in the code.

 

Would you be able to help me? Let me know what you need from me.

 

Thanks!