網站設定
「網站設定」管理您官網的品牌資訊、視覺模板、SEO 追蹤碼、業務資訊(NAP)、社群連結。
進入路徑:網站經營 → 網站設定,或直接造訪 /dashboard/site/settings。
六大區塊
設定頁分六個 Card 區塊,每個區塊獨立填寫,最後按頁面右上 / 右下「儲存設定」按鈕統一落地。
1. 品牌資訊
| 欄位 | 用途 |
|---|---|
| 品牌名稱必填 | 顯示在網站頂端 nav 與 footer,以及 <title> 預設值 |
| 品牌 Logo | 上傳 PNG / JPG,建議 200x200 透明背景 PNG |
| 主題色 | 16 進位色碼(如 #4f46e5),用於按鈕 / 連結 / 強調色 |
主題色 vs 模板色衝突:主題色會覆寫模板預設色。例如選了「美業優雅」模板(預設粉色)但主題色填了藍色,CTA 按鈕會是藍色。留白不要動 = 用模板預設。
2. 網站模板
5 套模板(依行業氛圍預設視覺風格):
| 模板 | 預設主色 | 字體 | 適合行業 |
|---|---|---|---|
| 通用商務 (general) | 靛紫 #4f46e5 | 系統黑體 | 各行各業(保險) |
| 美業優雅 (beauty) | 粉紅 #db2777 | 襯線體 (Noto Serif TC) | 美甲 / 美容 / 美髮 |
| 餐飲溫暖 (restaurant) | 暖橘 #ea580c | 襯線體 + 手寫感 | 餐廳 / 咖啡 / 飲料 |
| B2B 專業 (b2b) | 深藍 #1e3a8a | 系統黑體 | 製造業 / 顧問 / SaaS |
| 精品紫金 (luxe) | 紫 #5b2a86 + 金點綴 #c69749 | 襯線體 (Noto Serif TC) | 創業賦能 / 顧問 / 精品企業 |
切換模板的流程
- 點任一模板縮圖 → 跳 confirm 對話框
- 確認後系統把
template_id+primary_color同步更新(主題色變模板預設色) - 此時還沒落地,要按頁面「儲存設定」才入庫
- 切換前可點「先預覽 →」開新分頁套用
?preview_template=xxx看效果(不影響線上版)
內容不會跑掉:切模板只變視覺(顏色 / 字體 / 圓角 / 間距),您建好的頁面 block 與文章內容完全保留。可以放心試。
3. SEO 追蹤碼
| 欄位 | 格式 | 適用 |
|---|---|---|
| GA4 Measurement ID | G-XXXXXXXXXX | 訪客行為追蹤(前端 gtag.js) |
| GTM Container ID | GTM-XXXXXXX | 進階多 tag 管理(選填) |
| GSC Property | sc-domain:yourbrand.com 或 https://yourbrand.com/ | 內容版 SEO Dashboard 必填 |
| GA4 Property ID | 純 9 位數字(如 123456789) | 內容版 SEO Dashboard 必填 |
GA4 Measurement ID vs Property ID 是兩個不同東西:
- Measurement ID = G-XXX,前端 gtag.js 用,從 GA4「資料串流 → Web」拿
- Property ID = 9 位數字,後端 Analytics Data API 用,從「Admin → Property Settings」拿
兩個都要填。若拿錯打 API 會 400 Invalid。GA4 / GTM 填好後,系統自動在每頁 <head> 注入對應 script。SPA 切頁(next/link)系統會自動補打 page_view 事件,您看 GA4 即時報告就有資料。
4. 網站域名
顯示目前對外網址(一條到底):
- 未綁自訂域:顯示預設子網域 + 「升級自訂域 →」按鈕(連到自訂域 wizard)
- 已綁自訂域:顯示自訂域 + 「管理自訂域 →」按鈕
詳見 自訂域名。
5. 業務資訊(NAP)
NAP = Name / Address / Phone,是 Local SEO 核心三要素:
| 欄位 | 用途 |
|---|---|
| 公司 / 店家名稱 | LocalBusiness schema 的 name |
| 地址 | LocalBusiness schema 的 address |
| 電話 | LocalBusiness schema 的 telephone |
| 營業時間 | 自由文字(如「週一至週六 10:00-21:00 / 週日公休」) |
填齊後系統自動在首頁 <head> 注入 LocalBusiness JSON-LD 結構化資料,提升 Google Knowledge Panel 收錄機會。
多店租戶 NAP 怎麼填:建議這裡填「總店」或「公司總部」資訊,個別分店的詳細 NAP 走分店頁面裝載。
6. 社群連結
官網頁首「加 LINE 好友」按鈕,以及給 Google 認品牌用的其他社群連結,共 5 格:
| 欄位 | 用途 |
|---|---|
| LINE 官方帳號 ID | 官網頁首「加 LINE 好友」按鈕實際會連到的帳號。只填 @ 後面那段英數字(例如基本 ID 是 @295dfrss,這裡只填 295dfrss);貼整條網址或帶 @ 進來系統會自動幫您拆掉,並在欄位下方印出「官網按鈕會連到:⋯」讓您核對。留空則官網不顯示加好友按鈕 |
| LINE 加好友連結 | 完整網址(如 https://line.me/R/ti/p/@295dfrss),給搜尋引擎辨識品牌官方帳號用,不影響上面那顆按鈕 |
| Facebook 粉絲專頁 | 完整網址,選填 |
| 完整網址,選填 | |
| YouTube | 完整網址,選填 |
LINE 官方帳號 ID 怎麼找:到 LINE Official Account Manager →「設定 → 帳號設定」,看「基本 ID」那一欄。
這五格跟後台的 LINE 官方帳號串接設定是兩回事:這裡只影響官網外觀(加好友按鈕連去哪)與搜尋引擎品牌辨識,不會改到後台 LINE 訊息、webhook 等串接設定。若您換過 LINE@,記得除了後台串接設定,這裡的「LINE 官方帳號 ID」也要一起更新,不然官網上的加好友按鈕會連到舊帳號。
儲存設定
頁面右上 + 右下都有「儲存設定」按鈕(兩顆同功能)。按下後:
- 系統 PUT
/api/site/settings寫入 DB - 成功 → 右上角綠色 toast「已儲存」
- 失敗 → 紅色 toast 顯示具體錯誤
品牌名稱是必填:留白按儲存會擋下並提示「請填寫品牌名稱」。
切換模板實際生效時機
| 動作 | 是否寫入 DB | 對外是否變更 |
|---|---|---|
| 點模板縮圖(confirm) | 否 | 否 |
| 點「先預覽 →」 | 否 | 否(只您看到) |
| 按「儲存設定」 | 是 | 5-10 秒內生效 |
常見問題
Q1 主題色我填空白會怎樣?
不能空白。系統預設 #4f46e5(靛紫)。建議跟您 Logo 主色一致。
Q2 我可以同時用多個模板(不同頁面不同模板)嗎?
不行。模板是整站套用。若需頁面間視覺差異,請用個別 block 設定(color picker)覆寫。
Q3 GA4 填了之後看不到資料?
排查順序:
- 確認 GA4 Measurement ID 拼對(
G-XXX開頭) - 確認對外網址能訪問
- 用瀏覽器無痕視窗訪問官網一次
- GA4「即時報告」5 分鐘內應該看到 1 個使用者
- 若仍無 → 檢查瀏覽器 console 是否有 gtag 載入錯誤
Q4 模板切換後對外網址什麼時候變?
按「儲存設定」後 5-10 秒內生效(Next.js ISR 重驗)。若您手機看還是舊樣式,請強制重整(手機建議清快取或換瀏覽器測)。
Q5 Logo 上傳後會壓縮嗎?
會自動轉成 WebP 並按情境輸出多解析度(手機 200w / 桌機 400w)。原檔保留以防您未來想換回。
Q6 可以全站套深色模式嗎?
目前 5 套模板都是淺色背景。深色模式規劃中(內容版未來推出)。
第一次設定建議順序
1. 品牌名稱 + Logo(必填)
2. 挑模板(依您行業)
3. GA4 ID(之後想看流量必填)
4. NAP(地址電話)
5. 儲存設定
6. 對外網址訪問驗證樣式
5 分鐘搞定基本設定。
備註
若遇本說明未涵蓋的問題,請透過後台右下角 LINE 客服 @ugomk 聯繫真人專員協助處理。