> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://support.easystore.co/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# 【官網設計】商品價格顯示為「從 $XXXX 起」

![](https://storage.crisp.chat/users/helpdesk/website/-/b/3/4/7/b34797d9594d3000/6ygp55so5ywo6yoo5pa55qgi_7bg72p.png)

| 此文章教學僅針對新版主題（Aroma 或其後發佈之佈景主題）

若商品有設定不同的規格價格，部分主題會以價格區間顯示，此文章將教導你如何設定商品價格顯示為「從 $XXXX 起」。

---

###  商品價格顯示為「價格區間」請參考：[教學文章](https://support.easystore.co/zh-tw/article/44cq5a6y57ay6kit6kii44cr5zwg5zob5yo55qc86agv56s654k644cm5yo55qc85y2a6zat44cn-u6fy7m/)
---

###### 設定前：

![](https://storage.crisp.chat/users/helpdesk/website/-/b/3/4/7/b34797d9594d3000/image_13iaukg.png)

###### 設定後：


![](https://storage.crisp.chat/users/helpdesk/website/-/b/3/4/7/b34797d9594d3000/image_1mfhxtv.png)
---

1. 前往 EasyStore 後台 → 品牌官網 → 佈景主題 → 編輯原始碼 → price.liquid 文件 → <div class="price__regular"> 處 搜尋 以下代碼

```
{% if product.price_varies and product_template == null %}
            {{ price }} {% if product.price != product.price_max %}- {{ product.price_max | money: shop.money_format }}{% endif %}
          {% else %}
            {{ price }}
          {% endif %}
```

![](https://storage.crisp.chat/users/helpdesk/website/-/b/3/4/7/b34797d9594d3000/image_1q63820.png)

2. 複製以下代碼並覆蓋上一點的代碼

```
{% if product.price_varies and product_template == null %}{{ 'products.general.from_html' | t: price }}{% else %}{{ price }}{% endif %}
```


![](https://storage.crisp.chat/users/helpdesk/website/-/b/3/4/7/b34797d9594d3000/image_16gi7sr.png)

3. 點擊儲存，完成！