Schoettli HomeLab

Wissensdatenbank

Verstecke Header und Sidebar für saubere Dashboards

Was ist Kiosk-Mode?

Kiosk-Mode ist ein Custom Plugin für Home Assistant, das Header (obere Leiste) und/oder Sidebar (Seitenmenü) ausblendet. Perfekt für:

  • Wandtablets – Saubere Ansicht ohne störende Bedienelemente
  • Kiosk-Displays – Vollbild-Darstellung ohne Navigation
  • Touch-Panels – Minimale UI für einfache Bedienung
  • Personalisierte Ansichten – Verschiedene Nutzer sehen unterschiedliche Elemente

Installation

Via HACS (empfohlen)

  1. HACS öffnen → nach „Kiosk Mode“ suchen
  2. „Download“ klicken
  3. Home Assistant neu starten
  4. Fertig!

Manuell

  1. kiosk-mode.js herunterladen
  2. In /config/www/ speichern
  3. Ressource hinzufügen in Einstellungen → Dashboards → Ressourcen
  4. URL: /local/kiosk-mode.js

Wichtige Konfiguration

Die Konfiguration wird pro Dashboard in der Root-Ebene der Lovelace-Config eingetragen:

kiosk_mode:
  hide_header: true
  hide_sidebar: true
views:
  - title: Start
    # deine Views

Wichtig: kiosk_mode: steht auf Root-Ebene, nicht eingerückt!

Hauptoptionen

Basis-Optionen

kiosk_mode:
  kiosk: true              # Versteckt Header UND Sidebar
  hide_header: true        # Nur Header verstecken
  hide_sidebar: true       # Nur Sidebar verstecken
  hide_menubutton: true    # Nur Menü-Button verstecken

Detaillierte Header-Optionen

kiosk_mode:
  hide_notifications: true      # Benachrichtigungs-Icon
  hide_account: true            # Benutzer-Icon
  hide_search: true             # Such-Icon
  hide_assistant: true          # Assistenten-Icon
  hide_overflow: true           # Drei-Punkte-Menü rechts oben
  hide_edit_dashboard: true     # "Dashboard bearbeiten" im Menü

Dialog-Optionen (More-Info-Fenster)

kiosk_mode:
  hide_dialog_header_history: true     # "Verlauf"-Icon im Dialog
  hide_dialog_header_settings: true    # "Einstellungen"-Icon im Dialog
  hide_dialog_history: true            # Verlaufs-Bereich
  hide_dialog_logbook: true            # Logbuch-Bereich
  hide_dialog_attributes: true         # Attribute-Bereich

Erweiterte Optionen

kiosk_mode:
  block_mouse: true           # Maus komplett blockieren
  block_overflow: true        # Menü-Klicks blockieren
  block_context_menu: true    # Rechtsklick-Menü blockieren

Bedingte Konfiguration

Admin vs. Normale Nutzer

kiosk_mode:
  admin_settings:
    hide_sidebar: false    # Admins sehen Sidebar
  non_admin_settings:
    hide_sidebar: true     # Normale Nutzer sehen keine Sidebar

Spezifische Nutzer

kiosk_mode:
  user_settings:
    - users:
        - "Benutzer"
        - "Familie"
      kiosk: true          # Vollbild für diese Nutzer
    - users:
        - "Gast"
      hide_header: true
      hide_sidebar: true

Mobile Geräte

kiosk_mode:
  mobile_settings:
    hide_header: true
    custom_width: 768      # Breakpoint in Pixel (Standard: 812)

Templates für dynamische Steuerung

Input Boolean Helper erstellen

JavaScript-Templates

kiosk_mode:
  hide_sidebar: '[[[ user_name === "Gast" ]]]'
  hide_header: '[[[ is_state("input_boolean.fullscreen", "on") ]]]'

Jinja-Templates

kiosk_mode:
  hide_sidebar: '{{ user_name == "Gast" }}'
  hide_header: '{{ is_state("input_boolean.fullscreen", "on") }}'

Praktisches Beispiel – Steuerung per Input Boolean:

kiosk_mode:
  hide_header: '{{ is_state("input_boolean.fullscreen", "on") }}'
  hide_sidebar: '{{ is_state("input_boolean.fullscreen", "on") }}'
```

Dann kannst du per Automation oder Button die Ansicht ändern!

## URL-Query-Strings

Kiosk-Mode auch per URL aktivieren:
```
https://homeassistant.local:8123/lovelace/default_view?kiosk
```

**Verfügbare Parameter:**

- `?kiosk` - Alles verstecken
- `?hide_header` - Nur Header
- `?hide_sidebar` - Nur Sidebar
- `?hide_menubutton` - Nur Menü-Button
- `?disable_km` - Kiosk-Mode temporär deaktivieren
- `?clear_km_cache` - Cache löschen

**Mehrere Parameter kombinieren:**
```
?hide_header&hide_notifications&hide_account
```

### Cache-Funktion

Parameter dauerhaft speichern mit `cache`:
```
?hide_header&cache

Dann gilt die Einstellung auf allen Dashboards und Views!

Praktische Anwendungsfälle

Wandtablet im Wohnzimmer

kiosk_mode:
  kiosk: true
  block_context_menu: true

Komplett sauber, kein Rechtsklick-Menü.

Tablet für Familienmitglieder

kiosk_mode:
  hide_header: true
  hide_sidebar: true
  hide_dialog_header_settings: true
  hide_dialog_attributes: true

Einfache Ansicht ohne technische Details.

Gäste-Dashboard

kiosk_mode:
  user_settings:
    - users:
        - "Gast"
      kiosk: true
      block_overflow: true

Gäste sehen nur das Dashboard, keine Einstellungen.

Admin-Vollzugriff, Nutzer eingeschränkt

kiosk_mode:
  admin_settings:
    hide_header: false
    hide_sidebar: false
  non_admin_settings:
    hide_header: true
    hide_sidebar: true
    hide_overflow: true

Wichtige Hinweise

Dashboard-Typ beachten:

  • Funktioniert NUR in selbst erstellten Dashboards
  • „Standard-Dashboard“ von Home Assistant wird ignoriert
  • Erstelle „Neues Dashboard“ für Kiosk-Mode

Mehrere Dashboards:

  • Config muss in jedem Dashboard wiederholt werden
  • Oder: URL-Parameter mit cache nutzen

Sidebar-Zugriff:

  • Ab Home Assistant 2023.4 wurde Swipe-Geste entfernt
  • Wenn Header/Menubutton versteckt: Kein Sidebar-Zugriff mehr!
  • Plane Ausstieg über URL-Parameter ?disable_km

Deaktivierung:

  • ?disable_km in URL anhängen für temporäre Deaktivierung
  • Funktioniert nicht wenn ignore_disable_km: true in Config