# Wix Stores：自訂 Studio Two 購物車頁面

Source: https://support.wix.com/zh-hant/article/wix-stores-customizing-the-studio-two-cart-page-zh-hant (updated 2026-11-13)
Related: Wix developer documentation, https://dev.wix.com/docs/llms.txt; Help Center index, https://support.wix.com/en/llms.txt

> **重要：** 為提供最佳體驗，我們正逐步在 Studio Two 編輯器中推出各項功能。因此，部分 Wix Stores 小工具目前尚未完整支援 Studio Two 的所有功能。

購物車頁面就像超市裡的購物車，是顧客放入有興趣購買商品的地方。瀏覽完畢後，顧客即可前往結帳並完成訂單。

---

## 步驟 1｜存取購物車頁面

可從編輯器的「**頁面**」標籤存取購物車頁面。

### 若要存取購物車頁面：

1. [前往編輯器](https://manage.wix.com/account/site-selector/?actionUrl=https%3A%2F%2Fwww.wix.com%2Feditor%2F%7BmetaSiteId%7D%3FeditorSessionId%3D%7Besi%7D%26)。
2. 點擊「**網站結構**」圖示 ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/651c25b0-2d60-43c8-addf-1df2fd575568/2026/07/03/8fee07e0-2941-45dd-a732-3a3cc3343a50/afb13012-daf6-4a51-97bf-6ff135bbd545.png)。
3. 點擊「**頁面**」標籤。
4. 點擊「**購物車與感謝頁面**」下方的「**購物車頁面**」。

---

## 步驟 2｜自訂購物車頁面設定

接著，選擇要在購物車頁面顯示的內容。例如，若不提供優惠券，可隱藏「輸入促銷代碼」連結。

### 若要自訂購物車頁面設定：

1. 點擊編輯器中的購物車元件。
2. 點擊操作列上的「**顯示元件**」圖示 ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6583964-8756-4344-ae8a-f24ce7803d0f/2026/11/03/93a94e66-b006-4570-a7ed-12a8fb564d50/image.png)。
3. 勾選要顯示資訊的核取方塊：  
   * **運費與送貨價格：**顯示與顧客所在地點相關的送貨資訊。  
   * **稅金：**根據顧客所在地點顯示相關的預估稅金。（若[產品價格已含稅](https://support.wix.com/zh-hant/article/including-tax-in-the-product-price)，則不會顯示預估稅金。）  
   * **備註：**允許顧客在訂單中新增備註。
4. 點擊操作列上的「**設定**」圖示 ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6583964-8756-4344-ae8a-f24ce7803d0f/2026/11/03/f4fe423f-4386-4631-8609-bf7d5e2be76b/image.png)。
5. 點擊「**設定**」索引標籤。
6. 勾選或取消勾選「**促銷代碼**」核取方塊，允許顧客輸入[優惠券代碼](https://support.wix.com/zh-hant/article/wix-stores-offering-discounts-and-coupons#coupons)。
7. 自訂「**繼續瀏覽連結**」：  
   1. 點擊「**顯示連結**」切換開關，即可顯示或隱藏連結。  
   2. 點擊「**連結到哪裡？**」下方的按鈕，選擇連結要將顧客導向的位置。
8. 點擊「**快速結帳**」下方的「**顯示按鈕**」切換開關，即可顯示或隱藏快速結帳按鈕。

> **提示：** 購物車空白時，一律會顯示「**繼續瀏覽**」連結。

---

## 步驟 3｜設計購物車頁面

微調設定後，請自訂購物車頁面的設計，使其符合網站的整體外觀和形象。您可全面掌控此頁面的外觀，包括色彩、字型、按鈕等。

### 若要設計購物車頁面：

1. 點擊編輯器中的購物車元件。
2. 點擊操作列上的「**設定**」圖示 ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6583964-8756-4344-ae8a-f24ce7803d0f/2026/11/03/f4fe423f-4386-4631-8609-bf7d5e2be76b/image.png)。
3. 點擊「**設計**」索引標籤。
4. 選擇要自訂的項目：  
   * **背景與框線：**變更頁面背景和分隔線的不透明度與色彩。  
   * **文字字型與色彩：**變更頁面標題、內文和連結的字型與色彩。  
   * **按鈕：**變更購物車頁面中按鈕的樣式、文字、填滿色彩、框線和圓角半徑。  
   * **付款方式：**選擇快速結帳按鈕（例如 PayPal）的按鈕樣式與外觀。
5. （選填）點擊「**重設為原始設計**」，即可恢復預設設計。

> **提示：** 也可在**「設計」**標籤的[檢驗器面板](https://support.wix.com/zh-hant/article/studio-two-editor-working-with-the-inspector-panel)中，調整購物車元件的大小、位置和外觀。

---

## 常見問題

點擊下方問題，深入了解自訂 Studio Two 購物車頁面的相關資訊。

**如何查看有商品的購物車，以便確認設計效果？**

如果購物車是空的，可新增商品，方便設計購物車中有商品時的外觀。

在編輯器中新增商品至購物車：

1. 點擊編輯器右上角的**「預覽」**。
2. 新增商品至購物車。
3. 點擊**「購物車」**圖示，然後點擊進入購物車頁面。
4. 點擊編輯器右上角的**「編輯網站」**，即可退出預覽模式。

**啟用快速結帳後，顧客會看到什麼？**

可連結 [PayPal](https://support.wix.com/zh-hant/article/wix-stores-understanding-customer-checkout-with-paypal)、[Apple Pay 或 Google Pay](https://support.wix.com/zh-hant/article/wix-stores-customer-checkout-with-apple-pay) 作為付款服務供應商。啟用快速結帳後，購物車頁面和結帳頁面會新增一個結帳按鈕。

 如果除了快速付款選項外，還選擇其他付款選項（例如手動付款、Square、Stripe），顧客會看到多個結帳按鈕。

[深入了解快速結帳按鈕。](https://support.wix.com/zh-hant/article/about-express-checkout-buttons)

**如何自訂結帳頁面？**

點擊操作列上的**「設定」**圖示 ![](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/d6583964-8756-4344-ae8a-f24ce7803d0f/2026/11/03/f4fe423f-4386-4631-8609-bf7d5e2be76b/image.png)，然後點擊**「結帳」**標籤。

[深入了解自訂結帳頁面。](https://support.wix.com/zh-hant/article/customizing-the-checkout-page)