佈景主題編輯器功能總覽

您可以使用佈景主題編輯器自訂佈景主題的各個區域，例如顏色，並透過區段與區塊管理佈景主題中的內容。

存取佈景主題編輯器

您可以在 Shopify 管理介面中存取佈景主題編輯器。

1. 在 Shopify 管理介面中，前往 線上商店 > 佈景主題。

2. 在要編輯的佈景主題旁按一下 編輯佈景主題。

佈景主題編輯器的版面配置區域

佈景主題編輯器包含下列區域：

• 選單列左側包含可在區段、佈景主題設定及 app 嵌入區塊間切換的導覽按鈕；中間顯示佈景主題名稱、市場及範本選單；右側則有自訂控制項。
• 側邊欄以樹狀檢視顯示您目前正在瀏覽之範本的所有內容。您可以從側邊欄管理區段和區塊、app 嵌入區塊及設定。側邊欄可收合。
• 預覽視窗會顯示您的佈景主題，並在您進行變更時自動更新。您可以啟用行動裝置預覽，或使用預覽檢查器來管理預覽視窗中的佈景主題範本內容。

選單列

選單列會顯示導覽、佈景主題資訊及自訂佈景主題的控制項。

側邊欄導覽

在選單列左側，您可以在側邊欄中的下列檢視之間進行切換：

• 以管理目前範本上的區段和區塊。
• 以管理佈景主題的全域設定 (例如顏色、字體排版及版面配置)。
• 以管理嵌入在佈景主題中的 app。

若要隱藏側邊欄並以全寬預覽佈景主題，請再次點擊有效按鈕來取消選取。若兩個面板皆為顯示狀態，點擊有效按鈕就會同時將兩者收合。

佈景主題詳情、市場及範本選單

在選單列中間，您可以找到下列項目：

• 該 佈景主題名稱 及其狀態。已發布的佈景主題會顯示「 上線 」狀態標籤。未發布的佈景主題會顯示「 草稿 」狀態標籤。按一下該佈景主題名稱即可存取下列選項：
  • 使用 編輯程式碼 開啟 code editor。
  • 使用 編輯預設佈景主題內容 以 edit the default wording in your theme。
  • 使用 即可開啟佈景主題的預覽畫面。
  • 使用 檢視說明文件 開啟佈景主題的 documentation。
  • 使用 檢視佈景主題編輯器可用的所有 keyboard shortcuts。
  • 使用 取得支援 以 get support。
• 市場選單可讓您預覽並針對不同市場自訂佈景主題。
• 範本選單可讓您在佈景主題中的不同頁面範本之間進行導覽。

自訂捷徑

您可以使用選單列中的下列控制項來自訂佈景主題並管理變更：

• 啟用或停用 Sidekick，以 assist you with theme customizations。
• 啟用或停用 preview inspector。
• 切換 預覽按鈕，即可在行動裝置螢幕上預覽您的佈景主題。
• 使用 undo and redo controls 管理目前的自訂工作階段。
• 使用「儲存」按鈕儲存變更。

若沒有可復原或可重做的未儲存自訂變更，對應的按鈕會停用。

側邊欄

側邊欄會顯示您目前正在檢視之範本的所有內容樹狀檢視。您可以從側邊欄管理區段和區塊，以及佈景主題設定。若要收合側邊欄，請再次點擊選單列中啟用的導覽按鈕，將其切換為關閉。

您的佈景主題可能有條件式設定，會根據目前啟用的其他設定而顯示於側邊欄中。舉例而言，若您的佈景主題包含的某個區塊具有新增影片或圖片的設定，那麼圖片選擇器或影片連結可能就是條件式設定，僅在您選取圖片作為多媒體檔案類型後才會顯示。

側邊欄模式

佈景主題編輯器有兩種模式，可充分運用螢幕上的可用空間。

雙側邊欄模式適用於較寬的瀏覽器視窗和較大的螢幕，而單側邊欄模式則適用於較窄的瀏覽器視窗和較小的螢幕。側邊欄模式會決定設定面板在編輯器中顯示的位置。

雙側邊欄模式

若您的瀏覽器視窗寬度至少為 1600 像素，則會顯示兩個面板。左側面板包含含有區段和區塊的頁面結構，右側面板則包含所選區段或區塊的設定。您可以透過取消選取區段來收合右側面板。

若要在大型螢幕上以單側邊欄模式檢視佈景主題編輯器，請將瀏覽器視窗變窄，直到編輯器切換為堆疊式版面配置。

單側邊欄模式

在較窄的螢幕上，編輯器會使用堆疊式版面配置。當您點擊區段或區塊時，設定面板會從螢幕底部向上滑動，而不會覆蓋您的頁面結構。您可以拖曳分隔線以調整頁面結構和設定之間的分割比例，讓兩者皆保持可見狀態。

預覽您的佈景主題

您可以點擊選單列中的 按鈕來預覽佈景主題的行動版版面配置。若要返回電腦版預覽，請再次點擊行動裝置按鈕。

若要以全寬預覽佈景主題，請點擊有效的側邊欄導覽按鈕以收合側邊欄。若兩個面板皆為顯示狀態，這項操作會同時收合兩個面板，讓您以全寬預覽您的線上店面。

復原與重做未儲存的變更

您可以使用 與 按鈕，復原或重做尚未儲存的自訂內容。儲存變更後，便無法再復原或重做。

在佈景主題編輯器中使用鍵盤快速鍵

您可以使用鍵盤快速鍵在佈景主題編輯器中導覽並執行各項操作。