Skip to content
  • Home
  • Recent
  • Tags
  • 0 Unread 0
  • Categories
  • Unreplied
  • Popular
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. ioBroker Allgemein
  4. Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation

NEWS

  • Monatsrückblick Januar/Februar 2026 ist online!
    BluefoxB
    Bluefox
    17
    1
    502

  • Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨
    BluefoxB
    Bluefox
    17
    1
    5.2k

  • Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄
    BluefoxB
    Bluefox
    13
    1
    1.4k

Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation

Scheduled Pinned Locked Moved ioBroker Allgemein
lovelacedokumentationleitfadenhilfeanleitung
194 Posts 30 Posters 57.5k Views 37 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • U Ulfhednir

    Nachdem sich jetzt langsam die ioBroker-Visu-App macht, ist Lovelace jetzt wieder für mich ein spannend geworden. Also habe ich mich jetzt auch mal rangemacht und habe mir mal 2-3 Übersichten zusammengeklickert. Was mich jetzt in der App jedoch etwas stört, ist die fehlende Möglichkeit per Swipe zu navigieren. Es soll für HASS eine Erweiterung geben:
    https://github.com/zanna-37/hass-swipe-navigation

    Scheinbar funktioniert der angepriesene Weg nicht mehr.
    swipe.png

    Hat jemand eine Idee, wie man die Swipe-Navigation trotzdem einbauen kann?

    David G.D Online
    David G.D Online
    David G.
    wrote on last edited by
    #152

    @ulfhednir
    Ich hatte lange diese Karte in Verwendung
    https://github.com/bramkragten/swipe-card

    Zeigt eure Lovelace-Visualisierung klick
    (Auch ideal um sich Anregungen zu holen)

    Meine Tabellen für eure Visualisierung klick

    1 Reply Last reply
    0
    • U Ulfhednir

      Nachdem sich jetzt langsam die ioBroker-Visu-App macht, ist Lovelace jetzt wieder für mich ein spannend geworden. Also habe ich mich jetzt auch mal rangemacht und habe mir mal 2-3 Übersichten zusammengeklickert. Was mich jetzt in der App jedoch etwas stört, ist die fehlende Möglichkeit per Swipe zu navigieren. Es soll für HASS eine Erweiterung geben:
      https://github.com/zanna-37/hass-swipe-navigation

      Scheinbar funktioniert der angepriesene Weg nicht mehr.
      swipe.png

      Hat jemand eine Idee, wie man die Swipe-Navigation trotzdem einbauen kann?

      GarfonsoG Offline
      GarfonsoG Offline
      Garfonso
      Developer
      wrote on last edited by
      #153

      @ulfhednir

      Der Fehler, den du da siehst, ist aber egal. Trag die Karte da nicht ein (grundsätzlich da keine Karten mehr eintragen). Einfach zu den custom cards ziehen, adapter neustarten, Frontend neuladen, dann sollte sie gehen. Falls nicht in Browserkonsole nach Fehlern gucken und gucken, ob es für neuere HASS Versionen vielleicht nen fork gibt oder so.

      Ultimativer Lovelace Leitfaden: https://forum.iobroker.net/topic/35937/der-ultimative-iobroker-lovelace-leitfaden-dokumentation

      Lovelace UI Beispiele: https://forum.iobroker.net/topic/35950/zeigt-her-eure-lovelace-visualisierung

      U 1 Reply Last reply
      0
      • GarfonsoG Garfonso

        @ulfhednir

        Der Fehler, den du da siehst, ist aber egal. Trag die Karte da nicht ein (grundsätzlich da keine Karten mehr eintragen). Einfach zu den custom cards ziehen, adapter neustarten, Frontend neuladen, dann sollte sie gehen. Falls nicht in Browserkonsole nach Fehlern gucken und gucken, ob es für neuere HASS Versionen vielleicht nen fork gibt oder so.

        U Offline
        U Offline
        Ulfhednir
        wrote on last edited by
        #154

        @garfonso Danke, ich bin eine Erkenntnis reicher. Die swipe-navigation funktioniert jetzt.

        1 Reply Last reply
        0
        • T Offline
          T Offline
          tomwarrent1
          wrote on last edited by tomwarrent1
          #155

          Gibt es eine Möglichkeit Teile einer View in einer anderen View wiederzuverwenden?
          Hintergrund: Es sollen mehrere nahezu identische Views erstellt werden mit leicht unterschiedlichen Anpassungen oder anderen Themes.

          David G.D SwisslizardS GarfonsoG 3 Replies Last reply
          0
          • T tomwarrent1

            Gibt es eine Möglichkeit Teile einer View in einer anderen View wiederzuverwenden?
            Hintergrund: Es sollen mehrere nahezu identische Views erstellt werden mit leicht unterschiedlichen Anpassungen oder anderen Themes.

            David G.D Online
            David G.D Online
            David G.
            wrote on last edited by
            #156

            @tomwarrent1

            So wie du es möchtest leider nicht.
            Ich Pflege auch 2 views für meine Frau und mich.

            Man könnte höchstens Seiten von view A und view B integrieren. Da ist aber dann nichts mit eigenem Theme oder Anpassungen.

            Zeigt eure Lovelace-Visualisierung klick
            (Auch ideal um sich Anregungen zu holen)

            Meine Tabellen für eure Visualisierung klick

            1 Reply Last reply
            0
            • T tomwarrent1

              Gibt es eine Möglichkeit Teile einer View in einer anderen View wiederzuverwenden?
              Hintergrund: Es sollen mehrere nahezu identische Views erstellt werden mit leicht unterschiedlichen Anpassungen oder anderen Themes.

              SwisslizardS Offline
              SwisslizardS Offline
              Swisslizard
              wrote on last edited by
              #157

              @tomwarrent1
              Ich mogle mich mit Javascript um das Problem rum resp. ich erzeuge die ähnlichen Views per Script. Unter lovelace.0.configuration sind die ganzen Views abruf- und auch änderbar (per getObject und setObject).

              1 Reply Last reply
              1
              • T tomwarrent1

                Gibt es eine Möglichkeit Teile einer View in einer anderen View wiederzuverwenden?
                Hintergrund: Es sollen mehrere nahezu identische Views erstellt werden mit leicht unterschiedlichen Anpassungen oder anderen Themes.

                GarfonsoG Offline
                GarfonsoG Offline
                Garfonso
                Developer
                wrote on last edited by
                #158

                @tomwarrent1
                Es gibt irgendwie so template gedöns... da hab ich mich aber noch nie mit auseinander gesetzt und weiß nicht, wie viel davon in iobroker läuft bzw. was fehlen würde. Kann gerne mal jemand machen. :-)

                Ultimativer Lovelace Leitfaden: https://forum.iobroker.net/topic/35937/der-ultimative-iobroker-lovelace-leitfaden-dokumentation

                Lovelace UI Beispiele: https://forum.iobroker.net/topic/35950/zeigt-her-eure-lovelace-visualisierung

                D 1 Reply Last reply
                0
                • GarfonsoG Garfonso

                  @tomwarrent1
                  Es gibt irgendwie so template gedöns... da hab ich mich aber noch nie mit auseinander gesetzt und weiß nicht, wie viel davon in iobroker läuft bzw. was fehlen würde. Kann gerne mal jemand machen. :-)

                  D Offline
                  D Offline
                  dan11hh
                  wrote on last edited by
                  #159

                  Hallo @garfonso ,

                  ich versuche ein Grafana Dashboard als iFrame einzubinden. Leider meldet Lovelace immer Verbindung abgelehnt. ioBroker und Grafana laufen im Docker und können an sich auch miteinander sprechen. Im normalen Browser funktioniert er auch.

                  Danke für die Hilfe!

                  David G.D 1 Reply Last reply
                  0
                  • D dan11hh

                    Hallo @garfonso ,

                    ich versuche ein Grafana Dashboard als iFrame einzubinden. Leider meldet Lovelace immer Verbindung abgelehnt. ioBroker und Grafana laufen im Docker und können an sich auch miteinander sprechen. Im normalen Browser funktioniert er auch.

                    Danke für die Hilfe!

                    David G.D Online
                    David G.D Online
                    David G.
                    wrote on last edited by
                    #160

                    @dan11hh

                    Https in http eingebunden?

                    Zeigt eure Lovelace-Visualisierung klick
                    (Auch ideal um sich Anregungen zu holen)

                    Meine Tabellen für eure Visualisierung klick

                    1 Reply Last reply
                    1
                    • J Offline
                      J Offline
                      JohnDenver0815
                      wrote on last edited by JohnDenver0815
                      #161

                      Gibts aktuell eine Möglichkeit, die iFrame-Kachel (Webseite heissts glaube ich in der Übersicht) zu zwingen, die Themeeinstellungen zu nutzen? Ich binde darüber aktuell die erzeugte Webseite vom Adapter "Energiefluss-erweitert" ein (die Hintergrundeinstellungen stehen auf volle Transparenz), der Inhalt der iFrame-Kachel wird aber leider nicht transparent, sondern weiß (so wird die Page auch bei Direktaufruf angezeigt, da der Browser ja "irgendwas" anzeigen muss). Der Adapterentwickler vermutet die Ursache des Anzeigeproblems in der iFrame-Kachel.

                      David G.D J 2 Replies Last reply
                      -1
                      • J JohnDenver0815

                        Gibts aktuell eine Möglichkeit, die iFrame-Kachel (Webseite heissts glaube ich in der Übersicht) zu zwingen, die Themeeinstellungen zu nutzen? Ich binde darüber aktuell die erzeugte Webseite vom Adapter "Energiefluss-erweitert" ein (die Hintergrundeinstellungen stehen auf volle Transparenz), der Inhalt der iFrame-Kachel wird aber leider nicht transparent, sondern weiß (so wird die Page auch bei Direktaufruf angezeigt, da der Browser ja "irgendwas" anzeigen muss). Der Adapterentwickler vermutet die Ursache des Anzeigeproblems in der iFrame-Kachel.

                        David G.D Online
                        David G.D Online
                        David G.
                        wrote on last edited by David G.
                        #162

                        @johndenver0815

                        Leider nein.
                        Das muss der dev vom Energiefluss-erweitert anpassen. Da muss er was in seiner html anpassen.
                        Kannst ja ein Issue auf git zu erstellen.

                        Ich erinnere mich, dass das Anfang auch bei echarts war. Dann hatte ich da ein Issue zu aufgemacht und es wurde eine Option für einen transparenten Hintergrund hinzugefügt.

                        Evtl. Kann der dev ja von hier ab was ableiten
                        https://github.com/ioBroker/ioBroker.echarts/issues/8
                        Evtl kann das mit ins Issue
                        https://github.com/ioBroker/ioBroker.echarts/commit/d89142ec1d932a9c75b65ffb92b4cde86d24a697

                        Das waren die Änderungen in der Version wo das mit dem Hintergrund gekommen ist

                        Zeigt eure Lovelace-Visualisierung klick
                        (Auch ideal um sich Anregungen zu holen)

                        Meine Tabellen für eure Visualisierung klick

                        1 Reply Last reply
                        1
                        • J JohnDenver0815

                          Gibts aktuell eine Möglichkeit, die iFrame-Kachel (Webseite heissts glaube ich in der Übersicht) zu zwingen, die Themeeinstellungen zu nutzen? Ich binde darüber aktuell die erzeugte Webseite vom Adapter "Energiefluss-erweitert" ein (die Hintergrundeinstellungen stehen auf volle Transparenz), der Inhalt der iFrame-Kachel wird aber leider nicht transparent, sondern weiß (so wird die Page auch bei Direktaufruf angezeigt, da der Browser ja "irgendwas" anzeigen muss). Der Adapterentwickler vermutet die Ursache des Anzeigeproblems in der iFrame-Kachel.

                          J Offline
                          J Offline
                          JohnDenver0815
                          wrote on last edited by
                          #163

                          @SKB Möchtest du da vorher noch drüber schauen, ob es tatsächlich deine Baustelle ist oder soll ich das Issue ohne vorherige Prüfung einkippen?

                          @johndenver0815 sagte in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:

                          Gibts aktuell eine Möglichkeit, die iFrame-Kachel (Webseite heissts glaube ich in der Übersicht) zu zwingen, die Themeeinstellungen zu nutzen? Ich binde darüber aktuell die erzeugte Webseite vom Adapter "Energiefluss-erweitert" ein (die Hintergrundeinstellungen stehen auf volle Transparenz), der Inhalt der iFrame-Kachel wird aber leider nicht transparent, sondern weiß (so wird die Page auch bei Direktaufruf angezeigt, da der Browser ja "irgendwas" anzeigen muss). Der Adapterentwickler vermutet die Ursache des Anzeigeproblems in der iFrame-Kachel.

                          @david-g sagte in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:

                          @johndenver0815

                          Leider nein.
                          Das muss der dev vom Energiefluss-erweitert anpassen. Da muss er was in seiner html anpassen.
                          Kannst ja ein Issue auf git zu erstellen.

                          Ich erinnere mich, dass das Anfang auch bei echarts war. Dann hatte ich da ein Issue zu aufgemacht und es wurde eine Option für einen transparenten Hintergrund hinzugefügt.

                          Evtl. Kann der dev ja von hier ab was ableiten
                          https://github.com/ioBroker/ioBroker.echarts/issues/8
                          Evtl kann das mit ins Issue
                          https://github.com/ioBroker/ioBroker.echarts/commit/d89142ec1d932a9c75b65ffb92b4cde86d24a697

                          Das waren die Änderungen in der Version wo das mit dem Hintergrund gekommen ist

                          SKBS 1 Reply Last reply
                          0
                          • J JohnDenver0815

                            @SKB Möchtest du da vorher noch drüber schauen, ob es tatsächlich deine Baustelle ist oder soll ich das Issue ohne vorherige Prüfung einkippen?

                            @johndenver0815 sagte in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:

                            Gibts aktuell eine Möglichkeit, die iFrame-Kachel (Webseite heissts glaube ich in der Übersicht) zu zwingen, die Themeeinstellungen zu nutzen? Ich binde darüber aktuell die erzeugte Webseite vom Adapter "Energiefluss-erweitert" ein (die Hintergrundeinstellungen stehen auf volle Transparenz), der Inhalt der iFrame-Kachel wird aber leider nicht transparent, sondern weiß (so wird die Page auch bei Direktaufruf angezeigt, da der Browser ja "irgendwas" anzeigen muss). Der Adapterentwickler vermutet die Ursache des Anzeigeproblems in der iFrame-Kachel.

                            @david-g sagte in Der "ultimative" ioBroker Lovelace Leitfaden/Dokumentation:

                            @johndenver0815

                            Leider nein.
                            Das muss der dev vom Energiefluss-erweitert anpassen. Da muss er was in seiner html anpassen.
                            Kannst ja ein Issue auf git zu erstellen.

                            Ich erinnere mich, dass das Anfang auch bei echarts war. Dann hatte ich da ein Issue zu aufgemacht und es wurde eine Option für einen transparenten Hintergrund hinzugefügt.

                            Evtl. Kann der dev ja von hier ab was ableiten
                            https://github.com/ioBroker/ioBroker.echarts/issues/8
                            Evtl kann das mit ins Issue
                            https://github.com/ioBroker/ioBroker.echarts/commit/d89142ec1d932a9c75b65ffb92b4cde86d24a697

                            Das waren die Änderungen in der Version wo das mit dem Hintergrund gekommen ist

                            SKBS Offline
                            SKBS Offline
                            SKB
                            Developer Most Active
                            wrote on last edited by
                            #164

                            @johndenver0815 Nach meinem Urlaub kann ich bei mir mal den Lovelace Adapter installieren und schauen, ob das Problem zu diesem oder zum EF gehört.

                            ... wer nicht mit der Zeit geht, geht mit der Zeit ...

                            Aktuelle Entwicklung: Energiefluss - erweitert (https://forum.iobroker.net/topic/64734)

                            David G.D 1 Reply Last reply
                            2
                            • SKBS SKB

                              @johndenver0815 Nach meinem Urlaub kann ich bei mir mal den Lovelace Adapter installieren und schauen, ob das Problem zu diesem oder zum EF gehört.

                              David G.D Online
                              David G.D Online
                              David G.
                              wrote on last edited by
                              #165

                              @skb

                              Hab es grad mal in Lovelace getestet mit einer einfachen HTML

                              <!DOCTYPE html>
                              <html lang="de">
                              <head>
                                  <title>Transparenter Hintergrund</title>
                                  <style>
                                      body {
                                          background-color: rgba(0, 0, 0, 0);
                                          color: white;
                                      }
                                  </style>
                              </head>
                              <body>
                                  <h1>Hallo, transparenter Hintergrund!</h1>
                              </body>
                              </html>
                              

                              Ergebnis
                              Screenshot_20250126_173707_Fully Kiosk Browser.jpg

                              Zeigt eure Lovelace-Visualisierung klick
                              (Auch ideal um sich Anregungen zu holen)

                              Meine Tabellen für eure Visualisierung klick

                              SKBS 1 Reply Last reply
                              0
                              • David G.D David G.

                                @skb

                                Hab es grad mal in Lovelace getestet mit einer einfachen HTML

                                <!DOCTYPE html>
                                <html lang="de">
                                <head>
                                    <title>Transparenter Hintergrund</title>
                                    <style>
                                        body {
                                            background-color: rgba(0, 0, 0, 0);
                                            color: white;
                                        }
                                    </style>
                                </head>
                                <body>
                                    <h1>Hallo, transparenter Hintergrund!</h1>
                                </body>
                                </html>
                                

                                Ergebnis
                                Screenshot_20250126_173707_Fully Kiosk Browser.jpg

                                SKBS Offline
                                SKBS Offline
                                SKB
                                Developer Most Active
                                wrote on last edited by
                                #166

                                @david-g Das hat der User ja als Hintergrund auch beim EF eingestellt.

                                Funktioniert dies auch bei Apple?

                                ... wer nicht mit der Zeit geht, geht mit der Zeit ...

                                Aktuelle Entwicklung: Energiefluss - erweitert (https://forum.iobroker.net/topic/64734)

                                David G.D 1 Reply Last reply
                                0
                                • SKBS SKB

                                  @david-g Das hat der User ja als Hintergrund auch beim EF eingestellt.

                                  Funktioniert dies auch bei Apple?

                                  David G.D Online
                                  David G.D Online
                                  David G.
                                  wrote on last edited by
                                  #167

                                  @skb
                                  Leider nur Android im Haus. Den Energieflussadapter ist auch nicht vorhanden zum testen.

                                  Zeigt eure Lovelace-Visualisierung klick
                                  (Auch ideal um sich Anregungen zu holen)

                                  Meine Tabellen für eure Visualisierung klick

                                  SKBS 1 Reply Last reply
                                  0
                                  • David G.D David G.

                                    @skb
                                    Leider nur Android im Haus. Den Energieflussadapter ist auch nicht vorhanden zum testen.

                                    SKBS Offline
                                    SKBS Offline
                                    SKB
                                    Developer Most Active
                                    wrote on last edited by
                                    #168

                                    @david-g Danke für den Hinweis. Schaue ich mir dann nächste Woche mal an - am Lovelace scheint es ja dann nicht zu liegen.

                                    Ich teste mal durch und melde mich zurück.

                                    ... wer nicht mit der Zeit geht, geht mit der Zeit ...

                                    Aktuelle Entwicklung: Energiefluss - erweitert (https://forum.iobroker.net/topic/64734)

                                    David G.D 1 Reply Last reply
                                    0
                                    • SKBS SKB

                                      @david-g Danke für den Hinweis. Schaue ich mir dann nächste Woche mal an - am Lovelace scheint es ja dann nicht zu liegen.

                                      Ich teste mal durch und melde mich zurück.

                                      David G.D Online
                                      David G.D Online
                                      David G.
                                      wrote on last edited by David G.
                                      #169

                                      @skb

                                      Wo stelle ich es denn im Adapter ein?
                                      Hier?
                                      Screenshot_20250126_181540_Chrome.jpg

                                      Eigentlich müsste das hier mal ein Modul abtrennen oder?

                                      Zeigt eure Lovelace-Visualisierung klick
                                      (Auch ideal um sich Anregungen zu holen)

                                      Meine Tabellen für eure Visualisierung klick

                                      SKBS 1 Reply Last reply
                                      0
                                      • David G.D David G.

                                        @skb

                                        Wo stelle ich es denn im Adapter ein?
                                        Hier?
                                        Screenshot_20250126_181540_Chrome.jpg

                                        Eigentlich müsste das hier mal ein Modul abtrennen oder?

                                        SKBS Offline
                                        SKBS Offline
                                        SKB
                                        Developer Most Active
                                        wrote on last edited by
                                        #170

                                        @david-g Bei Einstellungen kannst du die Hintergrundfarbe einstellen.

                                        ... wer nicht mit der Zeit geht, geht mit der Zeit ...

                                        Aktuelle Entwicklung: Energiefluss - erweitert (https://forum.iobroker.net/topic/64734)

                                        David G.D 1 Reply Last reply
                                        0
                                        • SKBS SKB

                                          @david-g Bei Einstellungen kannst du die Hintergrundfarbe einstellen.

                                          David G.D Online
                                          David G.D Online
                                          David G.
                                          wrote on last edited by David G.
                                          #171

                                          @skb
                                          @JohnDenver0815

                                          Screenshot_20250126_195839_Fully Kiosk Browser.jpg

                                          Screenshot_20250126_200153_Chrome.jpg

                                          Zeigt eure Lovelace-Visualisierung klick
                                          (Auch ideal um sich Anregungen zu holen)

                                          Meine Tabellen für eure Visualisierung klick

                                          SKBS XBiTX 2 Replies Last reply
                                          1
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate
                                          FAQ Cloud / IOT
                                          HowTo: Node.js-Update
                                          HowTo: Backup/Restore
                                          Downloads
                                          BLOG

                                          620

                                          Online

                                          32.7k

                                          Users

                                          82.5k

                                          Topics

                                          1.3m

                                          Posts
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Login

                                          • Don't have an account? Register

                                          • Login or register to search.
                                          • First post
                                            Last post
                                          0
                                          • Home
                                          • Recent
                                          • Tags
                                          • Unread 0
                                          • Categories
                                          • Unreplied
                                          • Popular
                                          • GitHub
                                          • Docu
                                          • Hilfe