【儀表板實作】三頁法則：首頁、房間頁、系統頁三份完整 YAML，貼上去改 ID 就能用

charles

這篇的內容（8 段）

1. 做完這篇你會有什麼
2. 為什麼是三頁
3. 對策一：限制最大欄數
4. 對策三：某些卡片只給自己看
5. 對策四：讓某張卡片佔兩欄
6. 測試一：手機一個螢幕
7. 測試三：壞掉看得出來嗎
8. 每季做一次「刪卡片」

這篇給你三份可以整段貼進去的儀表板設定 —— 首頁、房間頁、系統頁各一份。

「三頁法則」是骨架，重點在那三份 YAML。全部用 HA 原生卡片，不需要裝任何外掛。

每一步都有「你會看到什麼」。做完第三步能自己確認第三步成功了，才走第四步。



做完這篇你會有什麼

• 一個獨立的新儀表板，三個分頁，不會動到你原本的「總覽」
  
• 一個只在真的有問題時才出現的警示區塊
  
• 一張「現在有哪些東西開著」的動態清單（用原生卡片做，不靠外掛）
  
• 一頁可以看出「哪個裝置沒電了、哪個掉線了、資料庫多大」的系統頁
  

為什麼是三頁

• 一頁 → 一定會太擠。真正常用的那三個功能會藏在第二十張卡片的位置
  
• 兩頁 → 系統狀態會混進日常頁面，家人看到一堆看不懂的數字
  
• 三頁 → 剛好對應三種不同的意圖：「現在怎麼樣」「我要控制某個東西」「系統健康嗎」
  
• 四頁以上 → 你自己都會忘記第四頁放了什麼
  

判斷的標準不是美感，是每一頁回答一個不同的問題。分頁分不出不同的問題，就該合併。

---

第一步：建一個新的儀表板（不要改「總覽」）

HA 預設的「總覽」是自動產生的，它會自己把新裝置加進去。一旦你開始編輯它，就會跳出「接管控制」的提示 —— 接管之後它就不再自動更新了。

比較安全的做法是另外開一個：

• 「設定 → 儀表板 → 右下角 + 新增儀表板」
  
• 選 從頭開始的新儀表板
  
• 標題填「我家」，圖示隨意（例如 `mdi:home`），顯示在側邊欄 打開
  
• 建立
  

你會看到什麼：左側選單多出一個「我家」，點進去是一個空白頁面，中間寫著沒有卡片。

接著打開原始設定編輯器（這篇後面所有 YAML 都貼在這裡）：

• 進入那個新儀表板
  
• 右上角鉛筆進入編輯模式
  
• 右上角三個點 → 原始設定編輯器
  

你會看到什麼：一個全螢幕的文字編輯器，裡面大概只有兩三行，像是 `views: - title: Home ...`。

這個文字框就是整個儀表板的完整設定。之後每一步都是在這裡貼東西、按右上角的儲存。

⚠ 看不到「原始設定編輯器」 → 你的帳號沒開進階模式：點左下角你的名字 → 往下捲 → 打開 進階模式，重新整理後再試。

---

第二步：先把你家的實體 ID 撈出來

這是最多人卡住的地方 —— 網路上的範例都寫 `light.living_room`，但你家根本沒有這個實體。

最快的方法：用範本一次全部印出來。

• 左側選單 → 開發者工具 → 範本 分頁
  
• 把左邊文字框全部清空
  
• 貼進下面這段
  

1. 燈（light）：
2. {% for s in states.light %}
3.   {{ s.entity_id }}  ←  {{ s.name }}
4. {%- endfor %}
6. 開關（switch）：
7. {% for s in states.switch %}
8.   {{ s.entity_id }}  ←  {{ s.name }}
9. {%- endfor %}
11. 溫濕度：
12. {% for s in states.sensor
13.    if s.attributes.device_class in ['temperature', 'humidity'] %}
14.   {{ s.entity_id }}  ←  {{ s.name }}
15. {%- endfor %}
17. 門窗／動作偵測：
18. {% for s in states.binary_sensor
19.    if s.attributes.device_class in ['door', 'window', 'motion', 'moisture'] %}
20.   {{ s.entity_id }}  ←  {{ s.name }}
21. {%- endfor %}
23. 電池：
24. {% for s in states.sensor
25.    if s.attributes.device_class == 'battery' %}
26.   {{ s.entity_id }}  ←  {{ s.state }}%
27. {%- endfor %}

複製代碼

你會看到什麼：右邊即時出現分類好的清單，每一行是「實體 ID ← 你在 HA 裡看到的名字」。

把這頁的結果複製到記事本，後面三步都要對著它改 ID。

右邊完全空白 → 左邊貼歪了或有多餘的字元。整個清掉重貼一次。

某一類是空的 → 你家真的沒有那類裝置，或是那些裝置沒有設定 `device_class`。後者可以在「設定 → 裝置與服務 → 實體」裡點進去手動指定。

---

第三步：建三個輔助實體（首頁的警示區要用）

首頁上「只在有問題時才出現」的區塊，需要有個東西告訴它「現在有沒有問題」。HA 沒有內建這個，要自己做一個。

編輯 configuration.yaml（設定目錄最上層），加上這一段。如果你已經有 `template:` 了，就把 `- binary_sensor:` 那段併進去，不要寫第二個 `template:`：

以下還有約 82% 的內容
登入後即可閱讀完整教學

登入繼續閱讀使用 Google 登入