調整商品頁的版面:排列區塊、加常見問題、換版型
在編輯器打開任一件商品的頁面,用「頁面結構」排列與隱藏商品頁的區塊、加入常見問題或圖文,用「換版型」改照片與購買區的排法、決定往下捲時哪一欄跟著走;也可以讓某一塊由每件商品各自填,例如尺寸表。
完成後你會得到
你知道哪些改動會套用到所有商品頁、哪些只屬於一件商品,以及什麼時候要按發佈。
開始前準備
- 你是網站擁有者或共同管理者,網站已經啟用網路商店,而且至少有一件商品。
- 這篇調整的是所有商品頁共用的版面;要改某一件商品的名稱、照片或售價,請看「上架第一項可販售商品」。
操作步驟
第 1 步,共 6 步:在編輯器打開任一件商品的頁面
在編輯器打開「全部商品」頁,點畫面上任一件商品。畫布換成那件商品的頁面,上方工具列出現「頁面結構」與「換版型」,右側是這件商品的「商品快速編輯」面板。
「頁面結構」與「換版型」改的是所有商品頁共用的版面,用哪一件商品打開都一樣;「商品快速編輯」只改眼前這一件。
第 2 步,共 6 步:排列或隱藏商品頁的區塊
按「頁面結構」。清單依畫面由上到下列出商品頁的每一塊:商品主區、資訊分頁、規格與標示、顧客評價、使用案例、其他商品,以及你加進來的區塊。
拖曳左側的握把或按上下箭頭排順序,按眼睛圖示隱藏或顯示。點清單裡的一塊,會開那一塊自己的設定。
商品主區是放相簿、名稱、售價與購買按鈕的地方,不能隱藏、也不能移除。
第 3 步,共 6 步:加常見問題、圖文或影片
在「頁面結構」按「加區塊」,選要加的類型與版型,例如常見問題、圖文介紹、影片、評價見證、數字或圖庫。新區塊會加在清單裡,你可以再拖到想要的位置。
點新加的區塊就能編輯文字與圖片。預設是全店共用:寫一次,每一件商品頁都會出現同一份內容,適合運送說明、保固或常見問題。
表單、預約、商品清單這類區塊不能加進商品頁:它們會把客人從購買帶走,或與商品頁原本的「顧客評價」「其他商品」重複。
第 4 步,共 6 步:讓某一塊由每件商品各自填(例如尺寸表)
在「頁面結構」裡,加進來的區塊下方有「改成每件各自填」。按下去之後,這一塊的內容改由每件商品自己填;沒填的商品頁不會出現這一塊。
在「商品快速編輯」面板往下捲,會看到「這件商品專屬的區塊」。展開那一塊、填好內容,按「儲存這一塊」。按「下一件」換到下一件商品,再填它自己的那一份。
要讓某件商品不顯示這一塊,展開後按「這件商品不顯示」。想改回大家共用同一份內容,在「頁面結構」按「改成全店共用」。
第 5 步,共 6 步:換商品頁的版型
按「換版型」,選商品頁的骨架,再調照片怎麼排、比例、購買區的排法、規格選項的樣式、評價的呈現方式等。畫布會即時顯示結果。
在「頁面骨架」下方的「往下捲時跟著走的欄位(桌機)」選一欄:選「照片欄」,客人往下選規格、打加字時,照片會一直留在畫面上,直到捲完這一區;選「購買欄」則是看照片時購買按鈕留在眼前;選「都不跟」兩欄一起捲走。有成品示意(挑圖、加字會即時印在商品上)的商品建議選照片欄。手機上照片排在購買區上面,不會跟著走。
這些設定同樣套用到所有商品頁。商品卡、活動標籤與列表頁的外觀不在這裡,面板下方有連結可以過去。
第 6 步,共 6 步:按發佈,讓正式網站換上新版面
「頁面結構」與「換版型」的改動先存成草稿,你在編輯器裡看得到,客人看到的仍是原本的版面。確認好之後按右上角的「發佈」。
發佈後打開正式網站的任一件商品頁,確認區塊順序、新加的內容與版型都對。
常見問題
- 我在商品面板填了內容,正式網站卻看不到
- 那一塊多半還沒發佈。打開「頁面結構」確認那一塊在清單裡、沒有被隱藏,然後按「發佈」。也確認你填的是那一件商品,而不是另一件。
- 我只想改一件商品,結果每一件都變了
- 「頁面結構」與「換版型」改的是所有商品頁共用的版面。只屬於一件商品的內容,請把那一塊改成「每件各自填」,再到那件商品的「這件商品專屬的區塊」填。
- 把區塊從頁面結構移除後,商品上填過的內容不見了
- 內容還在商品上,只是那一塊不在版面裡所以不顯示。在同一個編輯階段按復原,區塊與內容會一起回來。
- 加區塊時找不到表單或預約
- 這些區塊不能放進商品頁。想讓客人詢問,有兩個做法:一是開啟浮動聯絡按鈕,它是全站的,固定在畫面角落、每一頁都會出現,不只商品頁;二是把這件商品改成詢價商品:在商品編輯頁把「實際售價/結帳金額」留空或填 0,購買按鈕就會換成詢問按鈕(預設文字「詢問此商品」,可在「商店設定 › 店面與銷售 › 詢價內容」改按鈕文字與連結)。
- 選了照片欄,照片還是跟著頁面捲走
- 跟著走只在桌機寬度生效,手機上照片在購買區上面、不會跟著走。也確認版型不是「情境敘事」(它沒有左右兩欄),而且改動已經按「發佈」。照片欄比螢幕還高時,會先捲到照片底部貼齊視窗下緣才停住,這樣最下面的縮圖才看得到。
這篇如何保持正確
- 負責人
- Growth Team · Module Enablement
- 複驗節奏
- 最後複驗 2026-10-24;下次應於 2026-11-23 前完成
- 驗證依據與邊界
- 本文依 7 個程式或介面來源重播核對。內容說明安庭產品當下可操作流程;第三方平台、法規與價格請回到各自最新官方頁,本文不取代帳務、法律或資安專業判斷。
發現介面或步驟不同?請從關於安庭與聯絡方式回報,我們會重新驗證。
