Add a sort order menu to collections

If you have large collections, you might want to let your customers change the order in which collection contents are displayed. You can do this by adding a sort order drop-down menu to your collection pages.

Sort order drop down


You can view a demo of this customization at

To create the sort order drop-down menu, you will need to add code to your collection.liquid template.

  1. From your Shopify admin, click Online Store, and then click Themes (or press G W T).

  2. Find the theme you want to edit, click the ... button, and then click Edit HTML/CSS.

  3. Under the Templates heading, click collection.liquid to open your collection template in the online code editor.

    Did you know?

    If you're using the Brooklyn theme, click collection-template.liquid instead.

  4. In a new browser tab, go to this gist file.

  5. Copy the contents of this gist file.

  6. Back in your admin, paste the code where you would like the sort order drop-down menu to appear on your collection page.

    Did you know?

    For Brooklyn, paste the code directly above the {% if settings.collection_tags_enable %} code in collection-template.liquid.

  7. Save your changes.

Want to discuss this page?

Visit the Shopify Community