Zo maak je een dashboard voor Home Assistant (2024)

Heb je Home Assistant geïnstalleerd, de nodige apparaten toegevoegd en misschien zelfs enkele automatiseringen, dan wil je natuurlijk dat iedereen er gebruik van gaat maken. Die kans wordt een stuk groter met een praktisch dashboard op een tablet, die je ophangt op een centrale plek in huis. In dit artikel laten we zien hoe je dat voor elkaar krijgt en hoe je er optimaal gebruik van maakt!

Home Assistant is een mooi en veelzijdig pakket voor het automatiseren van je huis, met enorm veel integraties met apparaten en diensten. En het draait uitstekend op een Raspberry Pi. In dit artikel, lees je hoe je het op de singleboardcomputer installeert en hoe je er mee begint. Nadat je het hebt opgezet, wil je natuurlijk ook dat iedereen gebruik maakt van al die handige features die je hebt toegevoegd. Een van de mooiste manieren is een dashboard, weergegeven op een tablet die je op een handige plek in huis ophangt. Dankzij Lovelace biedt Home Assistant alle mogelijkheden voor zo’n eigen dashboard, waarbij je in de vorm van kaarten heel veel details kunt toevoegen. Ook kun je kaarten of thema’s van de online community gebruiken zodat het er precies uit ziet zoals je wenst! In deze masterclass helpen we je op weg.

01 De Lovelace UI

Via het menu in de zijbalk van Home Assistant blader je naar de verschillende onderdelen van de software, met Overzicht als eerste onderdeel. In de vorm van een dashboard zie je hier alle toegevoegde en nieuw ontdekte apparaten en diensten, zoals sensoren, lampen en schakelaars. Daar hoef je niets voor te doen, het wordt automatisch gegenereerd. Het dashboard heeft zelfs een naam: Lovelace (UI). Dit vormt het startpunt voor ons eigen dashboard. Als je net begint is het erg kaal met alleen een weerbericht, terwijl het juist weer erg vol en druk wordt wanneer je veel toegevoegt. Gelukkig kun je het dashboard opdelen in aparte pagina’s met tabbladen, ook wel weergaven of views genoemd. En je kunt sinds kort ook meerdere dashboards maken. Bovendien kun je een dashboard handmatig beheren zodat je precies bepaalt wat er op staat en hoe het er uitziet. Ga je met Lovelace aan de slag, dan zul je snel de kracht inzien van de gebruikersinterface. En als je nog wat verder bent, zul je ook de bijdragen uit de community waarderen, zoals alternatieve kaarten en thema’s.

© PXimport

Apparaten toevoegen aan Home Assistant

© PXimport

02 Dashboard toevoegen

Home Assistant onderhoudt bij de standaard instellingen zelf de indeling van je dashboard en zet nieuw toevoegde apparaten of diensten er direct op. Je kunt het ook zelf beheren zodat je zelf verantwoordelijk bent voor het toevoegen van apparaten. Je kunt dat dan wel precies doen zoals je dat mooi vindt. Gelukkig hoef je niet te kiezen. Je kunt onbeperkt extra dashboards aanmaken die al dan niet automatisch worden gegenereerd. Onder Instellingen / Lovelace-dashboards zie je je dashboards, waar in eerste instantie alleen het standaard dashboard Overzicht staat. Klik op het plusteken om een dashboard te maken. Als voorbeeld maken we een dashboard genaamd Alles. Als je het vinkje bij Toon in de zijbalk hebt laten staan, is het bereikbaar via de zijbalk onder de gekozen naam. Hierop zullen automatisch alle nieuw toegevoegde apparaten verschijnen. Het standaarddashboard Overzicht gaan we in het vervolg van de masterclass handmatig beheren.

© PXimport

03 Beheer overnemen

We gaan naar het standaarddashboard Overzicht. Om het beheer over te nemen klikken we in het menu rechtsboven (de drie puntjes) op Configureer UI. Je ziet een waarschuwingsvenster dat het dashboard daarmee niet meer automatisch wordt bijgewerkt. Je kunt er eventueel voor kiezen om met een lege pagina te beginnen, door een vinkje bij deze optie te zetten. Klik daarna op Neem over. Tenzij je het vinkje hebt gezet, worden de bestaande onderdelen overgenomen in het dashboard waar je nu handmatig het beheer over hebt. Er is een eerste tabblad gemaakt met de naam Home. Via het penceeltje veranderen we de naam naar Thuis. We willen een extra tabblad maken, wat binnen Home Assistant een weergave of view wordt genoemd, voor kantoor. Hiervoor klikken we op het plusteken, voeren de titel Kantoor in en eventueel een pictogram, bijvoorbeeld mdi:briefcase, één van de Material Design-iconen. Deze iconen kun je op veel plaatsen in Home Assistant gebruiken. Hier kun je zien welke iconen er zoal zijn. De overige opties laten we ongemoeid en we kiezen Opslaan.

© PXimport

04 Rij met lampen of schakelaars

We willen wat knoppen voor lampen naast elkaar: in dit voorbeeld een Hue Go-lamp voor achtergrondverlichting, een Yeelight-lamp boven het bureau en bij de leeshoek en een KlikAanKlikUit-schakelaar voor de bergruimteverlichting. Ze zijn allemaal aan Home Assistant toegevoegd. Eerst klikken we op het plusteken rechts om een kaart toe te voegen en kiezen voor Horizontale stapel. Op zo’n kaart kun je andere kaarten stapelen (zie kader ‘Horizontale of verticale stapel’) wat ideaal is om de lampen naast elkaar weer te geven. Als eerste voegen we een kaart genaamd Lamp toe waarbij we onder het kopje Entiteit de gewenste lamp kiezen. Stel eventueel een vervangende naam in, als de naam onduidelijk of te lang is. De twee andere lampen voegen we op vergelijkbare wijze toe via het plusteken. Voor de schakelaar voor de bergruimteverlichting kiezen we de kaart Knop en vullen een passend icoontje in. Je kunt eventueel Material Design-icoontjes kiezen zoals uitgelegd in de vorige stap. Bijvoorbeeld mdi:flashlight voor een zaklampicoontje. Kies Opslaan als je klaar bent. We gebruiken hier steeds de visuele editor, maar je kunt ook code invoeren. Klik daarvoor op Code-editor weergeven. Je kunt daarna ook weer wisselen naar de visuele editor.

© PXimport

Horizontale of verticale stapel

05 Kaart met internetsnelheid

Om in het dashboard de snelheid van je internetverbinding te zien, kun je eenvoudig via Instellingen / Integraties de component Speedtest.net toevoegen. Daarmee wordt elk uur de download- en uploadsnelheid van de internetverbinding getest op de gekozen testserver. Via de sensor kun je de waarde uitlezen. Om de laatste meting weer te geven kun je bijvoorbeeld een Horizontale stapel toevoegen en daarin twee kaarten van het type Meter met als entiteit de sensor voor de download- en uploadsnelheid. Nog mooier is een grafiek met de geschiedenis van je metingen. Standaard houdt Home Assistant gegevens van onder meer sensoren bij in een lokale database, dus je hoeft daar niets voor te doen. Voeg hiervoor een kaart van het type Geschiedenis grafiek toe. Hierin kun je één of meerdere entiteiten opnemen. Wij kiezen weer de twee entiteiten en geven aan dat we de metingen van de laatste 24 uur willen zien, waarna de grafiek automatisch wordt getoond.

© PXimport

06 Kaarten voor een nas

Om gegevens van een Synology-nas op te nemen in je dashboard kun je onder Instellingen / Integraties bij Synology DSM op Configureer klikken. Hierna volstaat het om je gebruikersnaam en wachtwoord op te geven. Handig aan de integratie is dat je bijvoorbeeld zicht kunt houden op de gebruikte opslagruimte en de status van de harde schijven. We voegen daarvoor om te beginnen een kaart Meter toe en selecteren de sensor met het percentage gebruikte opslagruimte. Het is handig enkele drempelwaardes op te geven, door een vinkje bij Ernst definiëren te zetten. Je kunt dan kiezen bij welke waarde de grafiek groen, geel of rood wordt, zodat je het direct ziet als de opslagruimte kritiek wordt. Om de temperatuur of status van de vier harde schijven te monitoren kun je een kaart Oogopslag of Entiteiten toevoegen. Bij deze kaarten kun je meerdere entiteiten toevoegen zoals sensors maar bijvoorbeeld ook lampen en schakelaars. Bij Oogopslag staan ze naast elkaar, Entiteit maakt een verticaal lijstje met de gekozen entiteiten. Beide kaarten zijn geschikt om de temperaturen of de status van de vier harde schijven te laten zien. Hierna zou je bijvoorbeeld ook een kaart van het type Geschiedenis grafiek toe kunnen voegen met de gemeten belasting van de nas.

© PXimport

07 Thermostaat toevoegen

Het toevoegen van een airconditioning van Daikin is eenvoudig als je een model met wifi hebt. In het integratiescherm vind je hem dan meteen terug. Qua gebruik in Home Assistant is er weinig verschil met een slimme thermostaat: ze worden als klimaatregeling gezien. De standaard kaart heet Thermostaat. Het volstaat om hierin de bewuste airconditioning te kiezen en een naam in te voeren. En je hoeft je niet tot standaard kaarten te beperken. In de community zijn veel zogenoemde custom kaarten te vinden. Bijvoorbeeld simple-thermostat met een naar ons idee fijnere temperatuurregeling. Om deze te kunnen gebruiken voegen we een bron toe voor Lovelace (zie kader ‘Bronnen toevoegen voor Lovelace’): het bestand simple-thermostat.js uit de laatste release. Daarna ga je naar je dashboard, klik je op het plusteken en kies je Handmatig. Voor deze kaart is geen visuele editor beschikbaar, maar je hoeft in de code-editor maar een paar regels in te voeren:

type: 'custom:simple-thermostat'
entity: climate.zolder

Heb je de correcte entiteit ingevuld dan zie je rechts een werkend voorbeeld voor de kaart. Klik op Opslaan om deze definitief toe te voegen. Je kunt ook nog wat opties instellen om de weergave te verfijnen, zoals uitgelegd op de bewuste GitHub-pagina.

© PXimport

Bronnen toevoegen voor Lovelace

© PXimport

08 Thema’s gebruiken

Wil je het dashboard een hele andere uitstraling geven? Het standaardthema kent een lichte en donkere modus én je kunt de primaire kleur en accentkleur wijzigen. De opties vind je in je profiel, door linksonder op je naam te klikken. Voor een complete metamorfose kun je ook een thema maken of ophalen in de community. Als voorbeeld nemen we Clear Theme Dark. Ga eerst naar File editor en open configuration.yaml, voeg onderstaande regels toe en bewaar de aanpassingen.

frontend:
themes: !include themes.yaml

Hiermee hebben we een verwijzing naar themes.yaml gemaakt waarin we de opmaakcode van het toe te voegen thema gaan zetten. Maak dit bestand eerst aan in de editor en klik het aan om het te bewerken. Kopieer dan de code die je op de genoemde link vindt. Plak het in je editor en bewaar het bestand. Je kunt nu voor elke kaart die je maakt dit thema kiezen, maar ook in één handeling het thema toepassen via je profiel, door daar het thema (in dit geval dark) te selecteren. Op de bewuste link vind je trouwens ook een achtergrondafbeelding (night.jpg) waar het thema naar verwijst. Die kun je (via de editor) uploaden in de www-map.

© PXimport

Dashboard vast zetten op tablet

Zo maak je een dashboard voor Home Assistant (2024)

FAQs

How do I configure the dashboard in Home Assistant? ›

To start, go to the Home Assistant Overview page, click on the three dots at the top right of the screen and select 'Edit Dashboard'. Then click on the blue '+ Add Card' icon at the bottom right and select a card to add. To try it yourself, check out the demo.

What is the difference between dashboard and view in Home Assistant? ›

A View is a tab inside a dashboard. To display cards on the UI you have to define them in views. You can add a view to your user interface, by clicking the menu (three dots at the top right of the screen) and then Edit Dashboard.

How do I open Home Assistant dashboard? ›

View Home Assistant Dashboard UI on web browser​
  1. Open a web browser on a PC, tablet, smartphone type the following URL. homeassistant.local:8123. ...
  2. Once finished starting up, create an account and follow through the initial set up instuctions. After that you will see your welcome dashboard as follows.
Mar 16, 2023

How do I duplicate my Home Assistant dashboard? ›

It's a bit more work than a simple button click, but you can copy/paste an entire dashboard using the Edit Dashboard > Raw Configuration editor in the menu.

How do I set up a monitoring dashboard? ›

How to Create Dashboards for Monitoring Applications
  1. Acquire prerequisite knowledge.
  2. Determine monitoring requirements.
  3. (Optional) Create a management module.
  4. Create alerts for the metrics to be monitored.
  5. Create a summary alert.
  6. Create a dashboard for the monitored metrics.
  7. Create a dashboard for the summary alert.

Is admin panel and dashboard same? ›

An admin panel is focused on managing and updating a website or application, while a dashboard is focused on presenting data and insights.

What is the best smart screen for Home Assistant? ›

The Google Nest Hub Max is the best smart display for Google Assistant. The Nest Hub Max reigns supreme as the most powerful and feature-filled option for your Google Home ecosystem. The 10-inch device has a 6.5-megapixel camera that automatically pans and adjusts to keep you in the frame.

What is the difference between admin panel and admin dashboard? ›

Normally, an admin dashboard is a single screen that includes all crucial information. In contrast, an admin or control panel allows for certain actions. It enables administrators to conduct efficient management, control the system's performance, and implement the required changes.

What is the IP for Home Assistant dashboard? ›

Just within your home network you might know that your Home Assistant is on an IP like 192.168. 1.4 and listening on port 8123. If you use Home Assistant OS and haven't changed any of the defaults, Home Assistant will also be reachable at http://homeassistant.local:8123.

How do I remove an entity from Home Assistant dashboard? ›

I go to “Development tools” → “Services” and select “Purge Entities” I select the entities I want to remove, sometimes I select the correct entities and the corresponding entites with _2 and/or _3, eg. sensor.

How do I move my dashboard from one app to another? ›

Steps to move your dashboards
  1. Go to Settings > Knowledge > User interface > Views.
  2. Filter the page by using the term, "splunk-dashboard-app" and click the search button.
  3. In the Actions column, click Move.
  4. Select the app you'd like to move your dashboard to from the App context: menu.
Mar 9, 2022

How do I get Home Assistant configuration? ›

Configuration changes can also be tested using the UI by navigating to Developer Tools > YAML and clicking “Check Configuration”. For the button to be visible, you must enable “Advanced Mode” on your User Profile.

How do I set my dashboard as my homepage in service now? ›

Set dashboards as home for all users
  1. Navigate to All > User Administration > User Preferences.
  2. Create a user preference with the name my_home_navigation_page .
  3. Give the preference the description Set all homepages to dashboards .
  4. Select the System check box to create an instance-wide default.
  5. Leave the User field empty.
Jun 7, 2023

Where is configuration in Home Assistant? ›

go to Developer Tools (left menu bar) and there it will show you the path to your config file. Developer Tools, under the Info tab specifically.

Top Articles
Latest Posts
Article information

Author: Stevie Stamm

Last Updated:

Views: 6454

Rating: 5 / 5 (60 voted)

Reviews: 91% of readers found this page helpful

Author information

Name: Stevie Stamm

Birthday: 1996-06-22

Address: Apt. 419 4200 Sipes Estate, East Delmerview, WY 05617

Phone: +342332224300

Job: Future Advertising Analyst

Hobby: Leather crafting, Puzzles, Leather crafting, scrapbook, Urban exploration, Cabaret, Skateboarding

Introduction: My name is Stevie Stamm, I am a colorful, sparkling, splendid, vast, open, hilarious, tender person who loves writing and wants to share my knowledge and understanding with you.