在佈景主題編輯器中自動產生佈景主題區塊
透過 Shopify Magic,您可以使用人工智慧 (AI),根據您提供的詳情,在您的 佈景主題編輯器 中產生新的 佈景主題區塊。
產生佈景主題區塊的注意事項
請先閱讀下列產生佈景主題區塊時的注意事項:
- AI 產生的程式碼不見得完美,可能出現錯誤、非預期結果,或不完全符合無障礙功能或成效的最佳做法。您有責任檢視、測試,並確保產生的區塊符合您的標準且能正確運作。
- 請在佈景主題編輯器的預覽畫面中,分別以電腦版與行動版檢視預覽區塊的外觀。
- 如果您的區塊包含自訂設定,新增後請測試這些設定,確認能如預期運作。
- 產生佈景主題區塊後,該區塊的新 Liquid 檔案會新增至您佈景主題程式碼中的 blocks 資料夾。
- 佈景主題區塊由 Liquid(Shopify 的範本語言) 組成。區塊檔案也包含 HTML、CSS、JSON 與 JavaScript。產生佈景主題區塊後,該區塊的新 Liquid 檔案會新增至 blocks 您佈景主題的程式碼中的資料夾。

- 若要透過修改程式碼來編輯已產生的佈景主題區塊,您可以編輯您的 theme code。僅在您熟悉 HTML 與 CSS,並具備基本的 Liquid 概念時,才建議編輯佈景主題程式碼。
- Shopify Magic 產生的 Liquid 檔案是自成一體的。佈景主題商店發佈新版本時,您仍可 update your theme。
- 佈景主題區塊由 Liquid(Shopify 的範本語言) 組成。區塊檔案也包含 HTML、CSS、JSON 與 JavaScript。產生佈景主題區塊後,該區塊的新 Liquid 檔案會新增至 blocks 您佈景主題的程式碼中的資料夾。
產生佈景主題區塊的資格條件
請先閱讀下列產生佈景主題區塊的需求。
定價方案需求
您的商店必須使用下列其中一種 pricing plans:
- 免費試用
- Basic
- Growth
- Advanced
- Plus
Starter 方案不提供此功能,該方案使用的是 Spotlight 佈景主題,且不支援新增自訂的佈景主題區段或區塊。
佈景主題相容性
Shopify 佈景主題商店上的所有佈景主題皆可使用佈景主題區塊產生功能。若您使用的是相容的第三方佈景主題,則必須先購買該佈景主題才能產生佈景主題區塊,因為免費試用版不支援此功能。
舊版佈景主題不提供此功能。深入瞭解不同佈景主題架構版本的功能。
使用者權限需求
下列使用者可以在佈景主題中產生區塊:
- store owner and organization owner。
- 擁有 Administrator or Organization administrator roles 的使用者。
- 擁有 Store role,且具備 Edit Code permission 的使用者。
撰寫有效佈景主題區塊提示的秘訣
產生的區塊品質通常取決於提示的品質。請遵循以下最佳做法:
- 具體且具描述性:提示長度應至少為五個字。包含較多細節的較長提示較可能帶來更準確的結果。例如,請輸入建立一個左側為圖片,右側為標題、段落文字和「立即購買」按鈕的區塊,並在行動裝置上採用堆疊顯示,而不要只輸入新增圖片和文字。
- 提及內容元素:列出區塊所需的內容類型,例如標題、段落、圖片、按鈕、表單和圖示。
- 建議版面配置:描述區塊中元素的排列方式,例如並排、網格、置中或交錯的列。
- 包含自訂設定:如果您希望區塊在佈景主題編輯器中具備特定的可編輯設定 (例如變更圖片、文字或按鈕連結的選項),請將這些設定包含在提示中。例如,若要在包含影片的區塊中加入控制動畫速度的設定,請輸入包含控制動畫速度的設定。
- 利用後續指示反覆調整:如果第一次的結果未盡理想,請使用更多細節或不同的措辭來調整提示,然後再次產生。
請參考以下符合最佳做法的提示範例:
- 顧客評價區塊,包含顧客照片、引文文字、顧客名稱與 5 星評等顯示。
- 左右並排的功能區塊:左側有圖示與標題,右側為說明文字。
- 全寬橫幅:含背景圖片、置中的大標題,下方為較小的副標題文字,並包含行動號召按鈕。
產生佈景主題區塊
產生區塊並決定保留後,系統會將新區塊加入區塊選擇器。您可以將此區塊加入支援佈景主題區塊的相容區段。
步驟:
在 Shopify 管理介面中,前往 線上商店 > 佈景主題。
找到要編輯的佈景主題,然後按一下 編輯佈景主題。
自訂首頁,或點選 首頁 下拉式選單,接著選取您要新增區段的範本。
按一下您要在其中產生區塊的區段。
按一下 新增區塊。
按一下 產生。
輸入您想產生的區塊說明。
按一下 產生。Shopify Magic 會處理您的要求並產生程式碼。
直接在佈景主題編輯器中預覽已產生的區塊。若也有產生自訂設定,您即可自訂區塊。
如果您對產生的區塊滿意,按一下 保留。否則,您可以捨棄該區塊,或提供進一步指示。
從佈景主題中刪除產生的佈景主題區塊
產生佈景主題區塊後,系統會將該區塊的新 Liquid 檔案新增到您佈景主題程式碼中的 blocks 資料夾。如果產生的佈景主題區塊在商店造成問題,您可以在佈景主題程式碼中刪除對應的 Liquid 檔案來移除它。
步驟:
在 Shopify 管理介面中,前往 線上商店 > 佈景主題。
在要編輯的佈景主題旁,按一下 編輯佈景主題。
自訂首頁,或點選 首頁 下拉式選單,接著選取您要新增區段的範本。
按一下包含您要刪除區塊的區段。若您先前已將該區塊全部移除,請按一下 新增區塊,從區塊選擇器重新加入該區塊。
在該區塊的設定中,按一下
>
編輯程式碼。
在側邊欄選單中,按一下 blocks 資料夾以展開,然後找到您目前檢視的區塊檔案。該檔案名稱會與目前開啟的區塊名稱相同,並以
.liquid結尾。
在側邊欄選單中,按一下該區塊檔案旁的
圖示。
在對話方塊中,按一下 刪除檔案 以確認。