テーマをカスタマイズしてTOPページに全商品リストを表示させたのですが、テーマに実装されているソート機能がTOPページでは機能しません。
コレクションページでは問題なく動作しますので、下記の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>
ソート機能の読み込み側のソースは以下のようになっており、TOPページ、collectionページともに違いはありません。
{% if collection.description != blank %}
<header class="section-header">
<h1 class="section-header--title h1">{{ collection.title }}</h1>
<div class="rte rte--header">
{{ collection.description }}
</div>
</header>
<hr{% if has_sidebar %} class="hr--offset-left"{% endif %}>
<div class="section-header">
<div class="section-header--right">
{% include 'collection-sorting' %}
{% include 'toggle-filters' %}
</div>
</div>
{% else %}
<header class="section-header">
<h1 class="section-header--title section-header--left h1">{{ collection.title }}</h1>
<div class="section-header--right">
{% include 'collection-sorting' %}
{% include 'toggle-filters' %}
</div>
</header>
{% endif %}
