變更商品系列的順序

注意

Shopify Theme Store 不提供舊版佈景主題。這些主題不含 Shopify Online Store 2.0 佈景主題的功能，且 Shopify 免費的舊版佈景主題只能接收安全性修復的相關更新。

備註

如果您用的是 Shopify 的免費佈景主題，則可以聯絡 Shopify 支援服務協助您瞭解此教學課程。需要 15 分鐘的設計時間。深入瞭解 Shopify 設計政策。

備註

此自訂內容僅適用於舊版 Shopify 佈景主題，且不適用於 Online Store 2.0 佈景主題。

• 瞭解您佈景主題的架構版本
• 探索 Online Store 2.0 佈景主題的自訂內容

您的商店在 your-store.com/collections 網址中包含了商品系列清單頁面，按照字母順序顯示所有商品系列。此自訂內容會顯示如何指定要包含哪些商品系列，以及如何在頁面上變更其順序。

檢查佈景主題設定

所有免費 Shopify 佈景主題的最新版本皆包含這些設定，讓您從佈景主題編輯器變更商品系列清單頁面的版面配置。

步驟：

電腦版

1. 在 Shopify 管理介面 中，前往「線上商店」>「佈景主題」。
2. 尋找要編輯的佈景主題，然後點擊「自訂」。
3. 在頁面最上方的下拉式選單或行動版的「範本」選單中，選取「商品系列清單」。
4. 點擊「商品系列清單頁面」，以檢視和變更設定。
5. 點擊「儲存」。

iPhone

1. 在 Shopify 應用程式中，點選「…」按鈕。
2. 在銷售管道畫面上，點一下「線上商店」。
3. 點選「管理所有佈景主題」。
4. 尋找要編輯的佈景主題，然後點選「自訂」。
5. 點一下「編輯」。
6. 在頁面最上方的下拉式選單或行動版的「範本」選單中，選取「商品系列清單」。
7. 點擊「商品系列清單頁面」，以檢視和變更設定。
8. 點擊「儲存」。

Android

1. 在 Shopify 應用程式中，點選「…」按鈕。
2. 在銷售管道畫面上，點一下「線上商店」。
3. 點選「管理所有佈景主題」。
4. 尋找要編輯的佈景主題，然後點選「自訂」。
5. 點一下「編輯」。
6. 在頁面最上方的下拉式選單或行動版的「範本」選單中，選取「商品系列清單」。
7. 點擊「商品系列清單頁面」，以檢視和變更設定。
8. 點擊「儲存」。

如果您的佈景主題未包含修改商品系列清單頁面的設定，則需要建立選單，並編輯佈景主題程式碼。

建立一個選單以控制您的商品系列清單頁面

您可以建立一個選單，以指定欲包含於商品系列清單頁面中的商品系列。

步驟：

電腦版

1. 從 Shopify 管理介面 中，前往「線上商店 > 導覽」。
2. 按一下「新增選單」。
3. 將選單命名為 All collections。請勿變更此名稱，因為佈景主題會使用此名稱來決定要顯示於商品系列清單頁面上的商品系列及其順序。此選單名稱不會顯示於您的網路商店。
4. 點擊「新增選單項目」。
5. 在「新增選單項目」視窗中，輸入欲顯示於商品系列清單頁面上的商品系列名稱。點擊「連結」欄位並選取「商品系列」，然後點擊該商品系列的名稱。若要將一個選單項目移至新位置，請點擊並拖曳該選單項目目左側的圓點。
6. 點擊「儲存」。

iPhone

1. 在 Shopify 應用程式中，點選「…」按鈕。
2. 在銷售管道畫面上，點一下「線上商店」。
3. 點一下「導覽」。
4. 按一下「新增選單」。
5. 將選單命名為 All collections。請勿變更此名稱，因為佈景主題會使用此名稱來決定要顯示於商品系列清單頁面上的商品系列及其順序。此選單名稱不會顯示於您的網路商店。
6. 點擊「新增選單項目」。
7. 在「新增選單項目」視窗中，輸入欲顯示於商品系列清單頁面上的商品系列名稱。點擊「連結」欄位並選取「商品系列」，然後點擊該商品系列的名稱。若要將一個選單項目移至新位置，請點擊並拖曳該選單項目目左側的圓點。
8. 點擊「儲存」。

Android

1. 在 Shopify 應用程式中，點選「…」按鈕。
2. 在銷售管道畫面上，點一下「線上商店」。
3. 點一下「導覽」。
4. 按一下「新增選單」。
5. 將選單命名為 All collections。請勿變更此名稱，因為佈景主題會使用此名稱來決定要顯示於商品系列清單頁面上的商品系列及其順序。此選單名稱不會顯示於您的網路商店。
6. 點擊「新增選單項目」。
7. 在「新增選單項目」視窗中，輸入欲顯示於商品系列清單頁面上的商品系列名稱。點擊「連結」欄位並選取「商品系列」，然後點擊該商品系列的名稱。若要將一個選單項目移至新位置，請點擊並拖曳該選單項目目左側的圓點。
8. 點擊「儲存」。

針對部分佈景主題 (例如 Supply)，您就只需要建立「All collections」選單。若要檢查是否完成任何變更，請前往網路商店中的商品系列清單頁面 (your-store.com/collections)。如果您未看到任何變更，則需要編輯佈景主題程式碼。

自訂 list-collections.liquid 範本

您可以編輯商品系列清單頁面的程式碼，讓頁面僅顯示您包含在 All collections 選單中的商品系列。

步驟：

電腦版

1. 在 Shopify 管理介面 中，前往「線上商店」>「佈景主題」。
2. 找到要編輯的佈景主題，按一下「...」按鈕以開啟動作選單，然後點擊「編輯程式碼」。
3. 在「區段」目錄中，點擊「list-collections-template.liquid。
4. 找到下列程式碼出現的所有地方：

{% for collection in collections %}

部分佈景主題則包含下列程式碼：

{% for collection in list_collections %}

請將上述程式碼出現的所有地方替換為：

{% for link in linklists.all-collections.links %}
{% assign collection = link.object %}

1. 點擊「儲存」。

iPhone

1. 在 Shopify 應用程式中，點選「…」按鈕。
2. 在銷售管道畫面上，點一下「線上商店」。
3. 點一下「管理佈景主題」。
4. 找到要編輯的佈景主題，按一下「...」按鈕以開啟動作選單，然後點擊「編輯程式碼」。
5. 在「區段」目錄中，點擊「list-collections-template.liquid。
6. 找到下列程式碼出現的所有地方：

{% for collection in collections %}

部分佈景主題則包含下列程式碼：

{% for collection in list_collections %}

請將上述程式碼出現的所有地方替換為：

{% for link in linklists.all-collections.links %}
{% assign collection = link.object %}

1. 點擊「儲存」。

Android

1. 在 Shopify 應用程式中，點選「…」按鈕。
2. 在銷售管道畫面上，點一下「線上商店」。
3. 點一下「管理佈景主題」。
4. 找到要編輯的佈景主題，按一下「...」按鈕以開啟動作選單，然後點擊「編輯程式碼」。
5. 在「區段」目錄中，點擊「list-collections-template.liquid。
6. 找到下列程式碼出現的所有地方：

{% for collection in collections %}

部分佈景主題則包含下列程式碼：

{% for collection in list_collections %}

請將上述程式碼出現的所有地方替換為：

{% for link in linklists.all-collections.links %}
{% assign collection = link.object %}

1. 點擊「儲存」。