コレクションページに表示される商品の数を変更する

このページはSep 17, 2024に印刷されています。最新のバージョンについては、https://help.shopify.com/ja/manual/online-store/themes/themes-by-shopify/vintage-themes/customizing-vintage-themes/show-more-productsをご覧ください。

テーマエディタでテーマ設定を変更するか、テーマのコードを編集して、コレクションページに表示される商品数を変更できます。Shopifyの1ページあたりの商品上限数である50個を超えない限り、希望する数の商品を表示できます。

目次

テーマ設定を確認する

  1. テーマコードを変更するには、テーマエディタに移動します。
  2. ページ上部のドロップダウンメニュー、またはモバイルの [テンプレート] メニューから、[コレクションページ] を選択します。
  3. [コレクションページ] または [コレクション] をクリックします。
  4. テーマに、コレクションページで表示される商品数を変更できる設定がある場合、ニーズに合わせて設定を調整します。
  5. [保存] をクリックします。

テーマに、ページごとに表示される商品数を変更する設定がない場合、または設定はあるものの変更する際の制限が多すぎる場合は、次の手順に従ってテーマのコードを編集します。

collection-template.liquidファイルを更新する

  1. 管理画面から [オンラインストア] > [テーマ] に移動します。
  2. 編集するテーマを見つけて、[...] ボタンをクリックしてアクションメニューを開き、[コードを編集する] をクリックします。
  3. セクションディレクトリで、[collection-template.liquid] をクリックします。
  4. コードエディタで、次のコードを探します。 
 {% paginate collection.products by 9 %}
  1. コード内の数字を、コレクションページに表示する商品の数に変更し、[保存] をクリックします。
  1. Shopifyアプリで [...] ボタンをタップします。
  2. 販売チャネルセクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. 編集するテーマを見つけて、[...] ボタンをクリックしてアクションメニューを開き、[コードを編集する] をクリックします。
  5. セクションディレクトリで、[collection-template.liquid] をクリックします。
  6. コードエディタで、次のコードを探します。 
 {% paginate collection.products by 9 %}
  1. コード内の数字を、コレクションページに表示する商品の数に変更し、[保存] をクリックします。
  1. Shopifyアプリで [...] ボタンをタップします。
  2. 販売チャネルセクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. 編集するテーマを見つけて、[...] ボタンをクリックしてアクションメニューを開き、[コードを編集する] をクリックします。
  5. セクションディレクトリで、[collection-template.liquid] をクリックします。
  6. コードエディタで、次のコードを探します。 
 {% paginate collection.products by 9 %}
  1. コード内の数字を、コレクションページに表示する商品の数に変更し、[保存] をクリックします。

上記の例では、1ページあたりの商品のデフォルト数が9個です。この数字はテーマによって異なります。この数をコレクションページに表示する商品の数に変更できます。ページあたりの商品の最大数は50です。

一部のテーマでは、数字の代わりにlimitと呼ばれる変数を使用して、ページごとに表示される商品数を決定します。テーマでlimit変数を使用している場合、コードは次のように表示されます。

 {% paginate collection.products by limit %}

テーマでlimit変数を使用している場合、limitを数字と置き換える必要があります。前述のとおり、この数字は各コレクションページに表示される商品数で、50以下である必要があります。limit変数を数字に置き換えると、テーマエディタでコレクションページやページネーション設定を変更する機能が削除されることに留意してください。テーマエディタでページあたりの希望する商品数が得られない限り、テーマコードは編集しないことをおすすめします。

collection.liquidファイルを更新する

  1. 管理画面から [オンラインストア] > [テーマ] に移動します。
  2. 編集するテーマを見つけて、[...] ボタンをクリックしてアクションメニューを開き、[コードを編集する] をクリックします。
  3. テンプレートディレクトリーで、collection.liquidをクリックします。
  4. コードエディタで、次のコードを探します。 
{% paginate collection.products by 9 %}
  1. コード内の数字を、コレクションページに表示する商品の数に変更し、[保存] をクリックします。
  1. Shopifyアプリで [...] ボタンをタップします。
  2. 販売チャネルセクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. 編集するテーマを見つけて、[...] ボタンをクリックしてアクションメニューを開き、[コードを編集する] をクリックします。
  5. テンプレートディレクトリーで、collection.liquidをクリックします。
  6. コードエディタで、次のコードを探します。 
{% paginate collection.products by 9 %}
  1. コード内の数字を、コレクションページに表示する商品の数に変更し、[保存] をクリックします。
  1. Shopifyアプリで [...] ボタンをタップします。
  2. 販売チャネルセクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. 編集するテーマを見つけて、[...] ボタンをクリックしてアクションメニューを開き、[コードを編集する] をクリックします。
  5. テンプレートディレクトリーで、collection.liquidをクリックします。
  6. コードエディタで、次のコードを探します。 
{% paginate collection.products by 9 %}
  1. コード内の数字を、コレクションページに表示する商品の数に変更し、[保存] をクリックします。

上記の例では、1ページあたりの商品のデフォルト数が9個です。この数字はテーマによって異なります。この数をコレクションページに表示する商品の数に変更できます。ページあたりの商品の最大数は50です。

一部のテーマでは、数字の代わりにlimitと呼ばれる変数を使用して、ページごとに表示される商品数を決定します。テーマでlimit変数を使用している場合、コードは次のように表示されます。

{% paginate collection.products by limit %}

テーマでlimit変数を使用している場合、limitを数字と置き換える必要があります。前述のとおり、この番号は各コレクションページに表示される商品数で、50以下である必要があります。limit変数を数字と置き換えると、テーマエディタからコレクションページやページネーション設定に変更を加える機能が削除されることに留意してください。テーマエディタからページあたりの希望する商品数が得られない限り、テーマコードは編集しないことをおすすめします。

Shopifyで販売を開始する準備はできていますか?

無料体験を試す