Support Center

You are looking at the old Shopify support page. Please visit our new support site instead for most up to date information.

How do I make my collections sortable on my store front?

Last Updated: Jun 18, 2012 03:26PM EDT

Collections can only be sorted in your shop back-end.

Look for the “Reorder” drop-down on your collection page:

There, you can re-order your collection...

  • Alphabetically: A-Z
  • Alphabetically: Z-A
  • By Created Date: Newest to Oldest
  • By Created Date: Oldest to Newest
  • By Price: Highest to Lowest
  • By Price: Lowest to Highest
  • Manually

One hack used in the wild for making collections sortable on the storefront consists in creating as many sister collections for your shop's collections as you need sorting orders.

For example, for a Books collection, which you'd want sortable by price and alphabetically on your store front, you'd create 4 collections, all of them called Books, but each having a different handle and sorting order on your back-end:

  • Books at /collections/books-alpha-asc which you'd order Alphabetically from A to Z
  • Books at /collections/books-alpha-desc which you'd order Alphabetically from Z to A
  • Books at /collections/books-price-desc which you'd order by Price: highest to lowest
  • Books at /collections/books-price-asc which you'd order by Price: lowest to highest

You would then customize the collection template in your Shopify Theme to point back and forth between those sister collections on your storefront when your Shopper picks a sorting order. Effectively, the Shopper would see a different collection when he requests a Price High to Low sorting order, then when he requests a Price Low to High one.

You can see this in action here. Look at the URL in your browser as you pick a different sorting order.

The code used for this has been added to a gist.

The above hack relies on a naming convention for your collection handles.

To edit the Handle of a collection, go to that collection page in your shop admin, and click on the Edit link at the top of your screen. Then, below the “Collection title” text field, click on the “Modify title tag and url” link. Modify the “URL & Handle” and click on the “Apply changes” button below.

The solution described here is a hack. If you have many collections in your shop, it is not practical to make each one sortable in that matter. It will quickly get out of hand as you need to create, by hand, several copies of each of your collections — as many copies as you need sorting orders.

A more reasonable approach would consist in making only one collection sortable, the one at /collections/all, so that you end up with all those collections:

  • /collections/all-alpha-asc
  • /collections/all-alpha-desc
  • /collections/all-best-selling
  • /collections/all-price-asc
  • /collections/all-price-desc
  • /collections/all-created-asc
  • /collections/all-created-desc

Shopify cannot assist you with customizing your Shopify Theme for this.

Contact Us

  • North America:
    1 888 746 7439
    United Kingdom:
    0800 808 5233
    Australia:
    03 8400 4750
    New Zealand:
    07 788 6026