Before installing the Sort Selector we'll let you know a bit about how the app works.
The Sort Selector was designed before Shopify offered a standard way to sort collections, the way that it works is that it will create duplicate collections in different sort orders, and when your customer changes the sort order, the alternate collection is loaded in.
This will mean that you will have duplicated collections for each sort order and each collection you want to be sortable through the app. This may not be a problem for smaller stores, but for large stores, it can lead to having too many collections, Shopify has a limit of 5000 collections per store.
If you're not happy with having these extra collections we can help to add some additional code to use the default Shopify sorting options, all Shopify themes should have this feature already built-in, some third party themes may not have this option. Feel free to reach out to our support team to find out more, we can take a look at your theme and advise on the best solution for your needs.
Overview
The Sort Selector enables you to offer alternate sort orders of collections for your users. The user will be able to select how they want a collection to be ordered via a simple dropdown menu, or you can customize the selector using any HTML you would like.
Introduction
This feature is enabled by creating a copy of each collection for each additional sort order you wish to show to your customers. Each copy of the collection will be kept up to date as the primary collection is changed, within an hour of the change.
Important Information
Due to the server workload when there are a large number of small or empty collections a collection needs to have at least 5 items in it before the alternate sort orders will be created.
You will need to make some code changes to make this feature work. All the instructions are provided and should be simple to follow if you are comfortable making changes to your theme.
If you are not comfortable making changes to your theme code, please email support and we can arrange to have your theme updated.
Creating the Selector
Using the installer
An installer is available, which works for many popular themes. It may require additional work on the design, which is in your CSS file.
If your theme is not listed then you can use the 'Regular theme h1' or 'Regular theme h2' options.
Please note the installer may not support all themes, if you are unsure about your theme please contact support.
Manual installation instructions
You may wish to install the Sort Selector manually, and full notes can be found here.
Filtering Collections
One issue you may encounter, depending on your theme, is that when you list all the collections there are now a lot of extra duplicates. These are easily filtered out by adding a simple check for each collection.
You may have code like this:
{% for collection in collections %}
{% include 'collection-grid-item' %}
{% endfor %}
You need to add an additional check to make sure this is not an alternative sort order collection, like so:
{% for collection in collections %}
{% unless collection.metafields.sort_primary.first %}
{% include 'collection-grid-item' %}
{% endunless %}
{% endfor %}
Testing
It is recommended that you start with a small test first. You can do this by selecting a single collection and only one or two additional sort orders.
Apply To All Collections
Once you are happy with the configuration you can select all the sort orders that you would like to show, and all the collections that should have the selector available on.
If you want to show the selector for all collections then simply select no collections - which will default to all.
Default Sort Order
If your existing collections use a sort order that you do not select in the Sort Selector admin, that sort order will still be the default sort order.
For example, if you have Collection A, with a sort order of A-Z. If you then set up the Sort Selector but do not choose A-Z as an option, then when you visit Collection A it will default to be A-Z.
To fix this you need to change the sort order of the original collection. The Sort Orders tool can do this for all collections in one step.
Sort Orders
It is also recommended to use the Sort Order feature to enforce a consistent sort order across your site.
Uninstalling
To remove all the sort selectors you need to remove all the items from the Select Sort Options list.
SEO
The app may create additional collections, which are sometimes found by search engines. This can result in duplicate content warnings, which will show up in your webmaster tools.
These warnings are unlikely to have an effect on your rankings, but there is a simple fix to prevent them anyway. Just paste the following code as a replacement for your usual canonical tag, which is usually in your theme.liquid.
Replace:
<link rel="canonical" href="{{ canonical_url }}" />
With this:
{% assign primary_sort_collection = collection %}
{% if collection.metafields.sort_primary.collection_handle %}
{% assign primary_sort_collection = collections[collection.metafields.sort_primary.collection_handle] %}
{% endif %}
{% if template contains "collection" and primary_sort_collection %}
<link rel="canonical" href="{{ shop.url }}{{ primary_sort_collection.url }}{% if current_tags and current_tags.first %}/{{ current_tags.first }}{% endif %}{% if current_tags and current_tags[1] %}+{{ current_tags[1] }}{% endif %}{% if current_page > 1 %}?page={{ current_page }}{% endif %}" />
{% else%}
<link rel="canonical" href="{{ canonical_url }}" />
{% endif %}
This also works well with the Filter Menu, as it prevents many similar collections with different tag filters from being indexed.
If you have any additional questions, please contact support through the live chat in the app, or at support@powertoolsapp.com