BASE · 大地
溫暖 · 傳統 · 莊重
深土褐為主體，暖米白為底，稻穗金點亮。最沉穩、最安全的方向，適合需要傳承感的品牌。
正文字體：Noto Sans TC
Noto Serif TC
Noto Sans TC
Part 3
維護功能 · 部落格與商品上架
網站上線後，日常維護需求：最簡潔的部落格上稿系統，以及與 Shopify／蝦皮對接的商品展示
部落格上稿系統
單人編輯 · 不破壞設計單人編輯模式，不上多作者權限。編輯只需要寫文字、放照片——排版完全由系統自動完成。
「文繞圖」效果內建：照片上傳後自動尋找段落銜接處嵌入，保持網站原有的字體、行寬、色條風格。
最簡方案
Markdown + Git
在本地寫 .md 檔案，圖片丟進 assets 資料夾，push 後自動 build 上線。零維護成本。
開發成本：極低
推薦方案
Decap CMS
網頁版編輯器，所見即所得。上傳照片後系統自動處理 Responsive 與 WebP 格式。
開發成本：低
進階方案
Sanity 結構化
雲端 CMS，可設定自訂欄位。適合未來擴展為多人編輯或多語版本。
開發成本：中（月費 $15）
上稿流程示意
寫文章
Google Docs 或本地 .md → 上傳照片
拖曳或選取 → 系統自動排版
文字 + 圖片 = 上線
Google Docs 或本地 .md → 上傳照片
拖曳或選取 → 系統自動排版
文字 + 圖片 = 上線
- 單人編輯，無作者權限管理
- 照片上傳自動產生文繞圖
- 自動套用網站字體、色票、行寬
- 支援 Responsive 圖片 + WebP
- 不需要排版知識
- 上稿 = 寫字 + 放照片
商品上架與結帳系統
三種路線 · 由簡到完整三種方案，隨著預算與業務成長彈性升級。從零開發成本的導流，到完整的自營賣場，可階段性導入。
方案 A · 零開發
蝦皮賣場串接
網站上只有「前往蝦皮購買」按鈕，結帳與金流完全由蝦皮處理。現有賣場即可。
最快、零成本。
開發成本：$0
方案 B · 輕量整合
Shopify Buy Button
內嵌 Shopify 的商品購買按鈕在網站上。使用者不跳頁即可加入購物車，結帳由 Shopify 處理。
視覺上仍保留在 Basak 網站內。
開發成本：低（需 Shopify 帳號）
方案 C · 完整自營
自訂賣場 + Shopify 後端
完全用 Basak 的視覺設計建置商品頁、購物車與結帳流程。後端金流與庫存仍然走 Shopify。
最優雅的方案，但開發成本最高。
開發成本：中高
架構對照
Basak 網站
↓ 連結
蝦皮賣場
A · 零開發
Basak 網站
⬇Buy Button⬇
Shopify 後端
B · 輕量整合
Basak 自訂賣場
⇄ API
Shopify 後端
C · 完整自營
- 不破壞網站設計 — 商品頁遵循色票與字體
- 方案 A 最快（隔天可上線）
- 方案 B 視覺統一（Buy Button 可自訂 CSS）
- 方案 C 完全控制（購物車、結帳流程都可設計）
- 三種方案可階段升級
- 後端金流標準（信用卡／ATM／超商）