Shopify产品列表页增加产品显示排序方式，可以更好的方便用户选择，本文分享产品列表排序的修改代码。
| 1 | <div> |
| 2 | <label for=“sort-by“>Sort by</label> |
| 3 | <select id=“sort-by“> |
| 4 | <option value=“manual“>Featured</option> |
| 5 | <option value=“price-ascending“>Price: Low to High</option> |
| 6 | <option value=“price-descending“>Price: High to Low</option> |
| 7 | <option value=“title-ascending“>A-Z</option> |
| 8 | <option value=“title-descending“>Z-A</option> |
| 9 | <option value=“created-ascending“>Oldest to Newest</option> |
| 10 | <option value=“created-descending“>Newest to Oldest</option> |
| 11 | <option value=“best-selling“>Best Selling</option> |
| 12 | </select> |
| 13 | </div> |
| 14 | <script> |
| 15 | Shopify.queryParams = {}; |
| 16 | if (location.search.length) { |
| 17 | for (var aKeyValue, i = 0, aCouples = location.search.substr(1).split(‘&‘); i < aCouples.length; i++) { |
| 18 | aKeyValue = aCouples[i].split(‘=‘); |
| 19 | if (aKeyValue.length > 1) { |
| 20 | Shopify.queryParams[decodeURIComponent(aKeyValue[0])] = decodeURIComponent(aKeyValue[1]); |
| 21 | } |
| 22 | } |
| 23 | } |
| 24 | jQuery(‘#sort-by‘) |
| 25 | .val(‘{{ collection.sort_by | default: collection.default_sort_by | escape }}‘) |
| 26 | .bind(‘change‘, function() { |
| 27 | Shopify.queryParams.sort_by = jQuery(this).val(); |
| 28 | location.search = jQuery.param(Shopify.queryParams).replace(/\+/g, ‘%20‘); |
| 29 | }); |
| 30 | </script> |