Wer sein Dashboard aufhübschen möchte, dem kann ich übrigens …
Magst du mal die Konfiguration die du so darin gemacht hast zeigen, das ist ja schon eine sehr flexible Card
Wer sein Dashboard aufhübschen möchte, dem kann ich übrigens …
Magst du mal die Konfiguration die du so darin gemacht hast zeigen, das ist ja schon eine sehr flexible Card
Magst du mal die Konfiguration die du so darin gemacht hast zeigen, das ist ja schon eine sehr flexible Card
Klar ![]()
Header
type: heading
icon: mdi:car
heading: "Smart #3"
heading_style: title
badges:
  - type: entity
    show_state: true
    show_icon: true
    entity: sensor.smart_kilometerstand
    color: accent
  - type: entity
    show_state: true
    show_icon: true
    entity: sensor.smart_range_at_full_charge
    icon: mdi:cash-100
    color: primary
	
			Alles anzeigen
	type: custom:vehicle-status-card
button_card:
  - button:
      icon: mdi:car-tire-alert
      primary: Reifendrücke
      secondary:
        state_template: ""
    button_type: default
    card_type: tire
    custom_card: []
    default_card:
      - collapsed_items: false
        items:
          - entity: sun.sun
          - entity: ensor.sun_next_dawn
          - entity: sensor.sun_next_midnight
          - entity: sensor.sun_next_noon
        title: Default Card
    hide_button: false
    button_action:
      entity: ""
      tap_action:
        action: more-info
      hold_action:
        action: none
      double_tap_action:
        action: none
    tire_card:
      front_right:
        entity: sensor.smart_tire_pressure_passenger_front
        name: ""
      front_left:
        entity: sensor.smart_tire_pressure_driver_front
      rear_left:
        entity: sensor.smart_tire_pressure_driver_rear
      rear_right:
        entity: sensor.smart_tire_pressure_passenger_rear
  - button:
      icon: mdi:wrench-clock
      primary: Service
      secondary:
        state_template: ""
    button_type: default
    card_type: custom
    custom_card:
      - entities:
          - entity: sensor.smart_kilometer_bis_service
          - entity: sensor.smart_tage_bis_service
        type: entities
        show_header_toggle: true
        title: Service
    default_card: []
    hide_button: false
    button_action: {}
layout_config:
  button_grid:
    rows: 2
    columns: 2
    swipe: true
  hide:
    button_notify: false
    buttons: false
    images: false
    indicators: false
    mini_map: false
    range_info: false
    map_address: true
  theme_config:
    mode: auto
    theme: default
  section_order:
    - header_info
    - images
    - mini_map
    - buttons
  images_swipe:
    max_height: 150
    max_width: 450
    autoplay: false
name: ""
mini_map:
  enable_popup: true
  map_height: 150
  theme_mode: auto
  default_zoom: 10
  device_tracker: device_tracker.smart_none
indicators:
  single:
    - entity: sensor.smart_charging_power
      icon: mdi:lightning-bolt
      action_config:
        entity: sensor.smart_charging_power
        tap_action:
          action: more-info
        hold_action:
          action: none
        double_tap_action:
          action: none
      icon_template: ""
      state_template: ""
      color: |-
        {% if states('sensor.smart_central_locking_status_2') == '2' %}
          green
        {% else %}
          red
        {% endif %}
    - entity: sensor.smart_charging_time_remaining
      icon: ""
      attribute: ""
      action_config:
        entity: ""
        tap_action:
          action: more-info
        hold_action:
          action: none
        double_tap_action:
          action: none
      state_template: ""
      icon_template: ""
      color: |-
        {% if states('sensor.smart_electric_park_brake_status_2') == '0' %}
          red
        {% else %}
          green
        {% endif %}
    - entity: sensor.smart_12v_batterie_ladestand
      icon: ""
      attribute: ""
      action_config:
        entity: sensor.smart_12v_batterie_ladestand
        tap_action:
          action: more-info
        hold_action:
          action: none
        double_tap_action:
          action: none
      color: |-
        {% if states('sensor.smart_12v_batterie_ladestand12v') > '80' %}
          green
        {% else %}
          yellow
        {% endif %}
  group: []
range_info:
  - energy_level:
      entity: sensor.smart_battery
    range_level:
      entity: sensor.smart_range
    progress_color: "#68baa7"
    charging_entity: sensor.smart_charging_status
images:
  - url: /api/image/serve/e503db07d0ab6c9178c3d4437583c073/original
    title: SMART_1.PNG
	
			Alles anzeigen
	Ich hab gestern mal bisschen mit der Karte "rumgespielt". Tatsächlich sehr "flexibel" und mit vollständiger UI-Unterstützung. Allerdings leider auch nicht ganz intuitiv. Es brauchte einen Moment, zu verstehen, wie sie funktioniert. Also die Usability könnte etwas besser sein. Schwerwiegender finde ich, dass es zwar schön ist, dass Templates so zahlreich unterstützt werden, aber die Umsetzung ist zuweilen ziemlich "buggy". Ein Template, welches im Template-Editor einwandfrei funktioniert (und ich habe schon einige Templates geschrieben), funktioniert in der Karte leider nicht. Oder es funktioniert nur, wenn das Template "true" zurück gibt, bei "false" wird der Quellcode ausgegeben. Ich hab dann irgendwann aufgehört, aber war schon ziemlich weit gekommen:
Bildschirmfoto 2025-03-02 um 10.44.38.pngBildschirmfoto 2025-03-02 um 10.45.40.pngBildschirmfoto 2025-03-02 um 10.45.53.pngBildschirmfoto 2025-03-02 um 10.46.02.png
type: custom:vehicle-status-card
button_card:
  - button:
      primary: Reifendruck
      notify: >
        {% set vl = states('sensor.smart_reifendruck_fahrerseite_vorne') |
        float(0) %}
        {% set vr = states('sensor.smart_reifendruck_beifahrerseite_vorne') |
        float(0) %}
        {% set hl = states('sensor.smart_reifendruck_fahrerseite_hinten') |
        float(0) %}
        {% set hr = states('sensor.smart_reifendruck_beifahrerseite_hinten') |
        float(0) %}
        {{ vl > 2.4 && vr > 2.4 && hl > 2.4 && hr > 2.4 }}
      secondary:
        state_template: >-
          {% set vl = states('sensor.smart_reifendruck_fahrerseite_vorne') |
          float(0) %}
          {{ vl > 2.4 }}
      icon: mdi:car-tire-alert
    custom_card: []
    default_card:
      - collapsed_items: false
        items:
          - entity: sun.sun
          - entity: ensor.sun_next_dawn
          - entity: sensor.sun_next_midnight
          - entity: sensor.sun_next_noon
        title: Default Card
      - collapsed_items: true
        items:
          - entity: sun.sun
          - entity: ensor.sun_next_dawn
          - entity: sensor.sun_next_midnight
          - entity: sensor.sun_next_noon
        title: Collapsed Card
    hide_button: false
    button_action:
      entity: ""
      tap_action:
        action: more-info
      hold_action:
        action: none
      double_tap_action:
        action: none
    tire_card:
      title: Reifendruck
      front_left:
        entity: sensor.smart_reifendruck_fahrerseite_vorne
        name: " "
      front_right:
        entity: sensor.smart_reifendruck_beifahrerseite_vorne
        name: " "
      rear_left:
        entity: sensor.smart_reifendruck_fahrerseite_hinten
        name: " "
      rear_right:
        entity: sensor.smart_reifendruck_beifahrerseite_hinten
        name: " "
      horizontal: false
      background: /api/image/serve/c043d63ce8f3bbf5703c132e0b521456/original
      image_size: 100
      value_size: 80
    card_type: tire
    button_type: default
  - button:
      primary: Klimatisieren
      secondary:
        state_template: Innenraum heizen / kühlen
      icon: mdi:air-conditioner
    button_type: default
    card_type: custom
    custom_card:
      - type: thermostat
        entity: climate.smart_vin_conditioning
        features:
          - style: dropdown
            type: climate-hvac-modes
            hvac_modes:
              - heat_cool
              - "off"
        name: Klimatisierung
      - type: tile
        entity: select.smart_vin_conditioning_driver_seat
        vertical: true
        hide_state: true
        name: Fahrersitz
        features:
          - type: select-options
      - type: tile
        entity: select.smart_vin_conditioning_passenger_seat
        vertical: true
        hide_state: true
        name: Beifahrersitz
        features:
          - type: select-options
      - type: tile
        entity: select.smart_vin_conditioning_steering_wheel
        vertical: true
        hide_state: true
        name: Lenkradheizung
        features:
          - type: select-options
    default_card: []
    hide_button: false
    button_action: {}
    entity: climate.smart_vin_conditioning
    features:
      - style: dropdown
        type: climate-hvac-modes
        hvac_modes:
          - heat_cool
          - "off"
    name: Klimatisierung
  - button:
      icon: mdi:car-door
      primary: Türen
      secondary:
        state_template: This is a new button
    button_type: default
    card_type: default
    custom_card: []
    default_card:
      - collapsed_items: false
        items:
          - entity: sensor.smart_door_open_status_driver
            name: Fahrerseite vorn
            state_template: "{{ 'geschlossen' if states(config.entity) == '0' else 'offen' }}"
            icon: mdi:car-door
          - entity: sensor.smart_door_open_status_driver_rear
            name: Fahrerseite hinten
            state_template: "{{ 'geschlossen' if states(config.entity) == '0' else 'offen' }}"
          - entity: sensor.smart_door_open_status_passenger
            name: Beifahrerseite vorn
            state_template: "{{ 'geschlossen' if states(config.entity) == '0' else 'offen' }}"
          - entity: sensor.smart_door_open_status_passenger_rear
            name: Beifahrerseite hinten
            state_template: "{{ 'geschlossen' if states(config.entity) == '0' else 'offen' }}"
        title: Türen
    hide_button: false
    button_action: {}
  - button:
      icon: mdi:new-box
      primary: New Button
      secondary:
        state_template: This is a new button
    button_type: default
    card_type: custom
    custom_card:
      - entities:
          - sensor.sun_next_dawn
          - sensor.sun_next_midnight
          - sensor.sun_next_noon
        title: Custom Card
        type: entities
    default_card: []
    hide_button: false
    button_action: {}
  - button:
      icon: mdi:new-box
      primary: New Button
      secondary:
        state_template: This is a new button
    button_type: default
    card_type: default
    custom_card: []
    default_card:
      - collapsed_items: false
        items:
          - entity: sun.sun
          - entity: ensor.sun_next_dawn
          - entity: sensor.sun_next_midnight
          - entity: sensor.sun_next_noon
        title: Default Card
    hide_button: false
  - button:
      icon: mdi:new-box
      primary: New Button
      secondary:
        state_template: This is a new button
    card_type: custom
    custom_card:
      - entities:
          - sensor.sun_next_dawn
          - sensor.sun_next_midnight
          - sensor.sun_next_noon
        title: Custom Card
        type: entities
    default_card: []
    hide_button: false
layout_config:
  button_grid:
    rows: 2
    columns: 2
    swipe: true
  hide:
    button_notify: false
    buttons: false
    images: false
    indicators: false
    mini_map: false
    range_info: false
    map_address: false
    card_name: false
  theme_config:
    mode: dark
    theme: default
  section_order:
    - header_info
    - images
    - mini_map
    - buttons
  images_swipe:
    max_height: 260
    autoplay: false
    loop: false
name: "Smart #3"
mini_map:
  device_tracker: device_tracker.smart_none
  enable_popup: false
  map_height: 190
  us_format: false
  hours_to_show: 2
  default_zoom: 17
  theme_mode: auto
images:
  - url: /api/image/serve/c0fef7ea16a6d294328853e0694689ec/original
    title: SMART3.PNG
indicators:
  single:
    - entity: sensor.smart_12v_batterie_ladestand
      icon: ""
      attribute: ""
      action_config:
        entity: sensor.smart_12v_batterie_ladestand
        tap_action:
          action: more-info
        hold_action:
          action: none
        double_tap_action:
          action: none
    - entity: sensor.smart_kilometerstand
      icon: ""
      action_config:
        entity: sensor.smart_kilometerstand
        tap_action:
          action: more-info
        hold_action:
          action: none
        double_tap_action:
          action: none
      visibility: ""
    - entity: sensor.i3s_120_charging_end_time
      icon: mdi:battery-clock
      attribute: ""
      action_config:
        entity: sensor.i3s_120_charging_end_time
        tap_action:
          action: more-info
        hold_action:
          action: none
        double_tap_action:
          action: none
      visibility: "{{ is_state('sensor.smart_ladezustand', 'charging') }}"
    - entity: sensor.smart_letztes_daten_update
      icon: ""
      action_config:
        entity: ""
        tap_action:
          action: more-info
        hold_action:
          action: none
        double_tap_action:
          action: none
      state_template: >-
        vor {{
        relative_time(states['sensor.smart_letztes_daten_update'].last_changed |
        default('unbekannt'))
          |replace("hours","Stunden") |replace("hour","Stunde")
          |replace("minutes","Minuten") |replace("minute","Minute")
          |replace("seconds","Sekunden") |replace("second","Sekunde")
          |replace("days","Tagen") |replace("day","Tag") }}
  group: []
range_info:
  - energy_level:
      entity: sensor.smart_batterie
      attribute: ""
      icon: mdi:battery
    range_level:
      entity: sensor.smart_reichweite
      attribute: ""
    progress_color: "#db0045"
    charging_entity: sensor.smart_ladegerat_angeschlossen
card_mod:
  style:
    vehicle-buttons-grid$:
      vsc-button-single$: |
        .grid-item { 
          background: transparent !important;
        }
    .: |
      ha-card {
        background: transparent !important; 
      }
	
			Alles anzeigen
	cmdrfletcher Kanecaine das sieht super aus wo habt ihr den die Bilder von eurem Smart abgelegt bei mir zeigt er immer nur ein ? auf blauem Untergrund an!
Die Bilder kannst du direkt in der Karte hochladen.
Hab gerade festgestellt, dass es gestern doch schon bisschen spät war: die Templates funktionieren, sind allerdings etwas eigensinnig: er erkennt bspw. nur "True" aber nicht "true". Und man sollte die Templates besser im yaml schreiben, nicht in der UI. Mich hat jetzt der Ehrgeiz gepackt und ich mache nun doch mal die Karte "fertig". Ich poste dann den neuen Code.
Ich habe meine Card auch mal etwas begonnen:
type: custom:vehicle-status-card
button_card:
  - button:
      primary: Klimatisieren
      secondary:
        state_template: Innenraum heizen / kühlen
      icon: mdi:air-conditioner
    button_type: default
    card_type: custom
    custom_card:
      - type: thermostat
        entity: climate.smart_hVIN_conditioning
        features:
          - style: dropdown
            type: climate-hvac-modes
            hvac_modes:
              - heat_cool
              - "off"
        name: Klimatisierung
      - type: tile
        entity: select.smart_VIN_conditioning_driver_seat
        vertical: true
        hide_state: true
        name: Fahrersitz
        features:
          - type: select-options
      - type: tile
        entity: select.smart_VIN_conditioning_passenger_seat
        vertical: true
        hide_state: true
        name: Beifahrersitz
        features:
          - type: select-options
      - type: tile
        entity: select.smart_VIN_conditioning_steering_wheel
        vertical: true
        hide_state: true
        name: Lenkradheizung
        features:
          - type: select-options
    default_card: []
    hide_button: false
    button_action: {}
    entity: climate.smart_VIN_conditioning
    features:
      - style: dropdown
        type: climate-hvac-modes
        hvac_modes:
          - heat_cool
          - "off"
    name: Klimatisierung
  - button:
      primary: Reifendruck
      notify: >
        {% set vl = states('sensor.smart_tire_pressure_driver_front') | float(0)
        %}
        {% set vr = states('sensor.smart_tire_pressure_passenger_front') |
        float(0) %}
        {% set hl = states('sensor.smart_tire_pressure_driver_rear') | float(0)
        %}
        {% set hr = states('sensor.smart_tire_pressure_passenger_rear') |
        float(0) %}
        {{ vl > 2.4 && vr > 2.4 && hl > 2.4 && hr > 2.4 }}
      secondary:
        state_template: >-
          {% set vl = states('sensor.smart_tire_pressure_driver_front') |
          float(0) %}
          {{ vl > 2.4 }}
      icon: mdi:car-tire-alert
    custom_card: []
    default_card:
      - collapsed_items: false
        items: []
        title: Default Card
      - collapsed_items: true
        items:
          - entity: sun.sun
          - entity: ensor.sun_next_dawn
          - entity: sensor.sun_next_midnight
          - entity: sensor.sun_next_noon
        title: Collapsed Card
    hide_button: false
    button_action:
      entity: ""
      tap_action:
        action: more-info
      hold_action:
        action: none
      double_tap_action:
        action: none
    tire_card:
      title: Reifendruck
      front_left:
        entity: sensor.smart_tire_pressure_driver_front
        name: vorne links
      front_right:
        entity: sensor.smart_tire_pressure_passenger_front
        name: vorne rechts
      rear_left:
        entity: sensor.smart_tire_pressure_driver_rear
        name: hinten links
      rear_right:
        entity: sensor.smart_tire_pressure_passenger_rear
        name: hinten rechts
      horizontal: false
      background: /api/image/serve/ce86fac668f01988b25abd9892f831ae/original
      image_size: 99
      value_size: 75
      left: 73
      top: 45
    card_type: tire
    button_type: default
  - button:
      icon: mdi:new-box
      primary: New Button
      secondary:
        state_template: This is a new button
    button_type: default
    card_type: custom
    custom_card:
      - entities:
          - sensor.sun_next_dawn
          - sensor.sun_next_midnight
          - sensor.sun_next_noon
        title: Custom Card
        type: entities
    default_card: []
    hide_button: false
layout_config:
  button_grid:
    rows: 2
    columns: 2
    swipe: true
  hide:
    button_notify: false
    buttons: false
    images: false
    indicators: false
    mini_map: false
    range_info: false
    map_address: false
    card_name: true
  theme_config:
    mode: auto
    theme: default
  section_order:
    - header_info
    - images
    - mini_map
    - buttons
  images_swipe:
    max_height: 400
    max_width: 500
    delay: 5000
    autoplay: true
    effect: fade
    speed: 100
    loop: true
name: Smart#1 Status Card
mini_map:
  device_tracker: device_tracker.smart_none
  maptiler_api_key: ""
  enable_popup: true
  map_height: 250
  us_format: false
  theme_mode: auto
indicators:
  single:
    - entity: sensor.smart_odometer
      icon: ""
      attribute: ""
      action_config:
        entity: ""
        tap_action:
          action: more-info
        hold_action:
          action: none
        double_tap_action:
          action: none
  group:
    - name: Temperaturen
      visibility: ""
      items:
        - entity: sensor.smart_exterior_temperature
          name: Außentemperatur
          icon: mdi:temperature-celsius
          attribute: ""
          action_config:
            entity: ""
            tap_action:
              action: more-info
            hold_action:
              action: none
            double_tap_action:
              action: none
        - entity: sensor.smart_interior_temperature_2
          name: Innentemperatur
          icon: ""
          attribute: ""
          action_config:
            entity: ""
            tap_action:
              action: more-info
            hold_action:
              action: none
            double_tap_action:
              action: none
      icon: mdi:thermometer
    - name: Charging
      icon: mdi:car-battery
      visibility: ""
      items:
        - entity: sensor.smart_battery
          name: Batteriekapazität
          attribute: ""
          action_config:
            entity: ""
            tap_action:
              action: more-info
            hold_action:
              action: none
            double_tap_action:
              action: none
          icon: mdi:percent
        - entity: sensor.smart_charging_power
          name: Ladeleistung
          icon: ""
          attribute: ""
          action_config:
            entity: ""
            tap_action:
              action: more-info
            hold_action:
              action: none
            double_tap_action:
              action: none
        - entity: sensor.smart_charging_current
          name: Ladespannung
          icon: ""
          attribute: ""
          action_config:
            entity: ""
            tap_action:
              action: more-info
            hold_action:
              action: none
            double_tap_action:
              action: none
        - entity: sensor.smart_charging_time_remaining
          name: verbleibende Ladezeit
          icon: ""
          attribute: ""
          action_config:
            entity: ""
            tap_action:
              action: more-info
            hold_action:
              action: none
            double_tap_action:
              action: none
        - entity: ""
          name: ""
          icon: ""
          attribute: ""
          action_config:
            entity: ""
            tap_action:
              action: more-info
            hold_action:
              action: none
            double_tap_action:
              action: none
        - entity: sensor.smart_charger_connected
          name: Ladekabel angeschlossen
          icon: mdi:power-plug-battery
          attribute: ""
          action_config:
            entity: ""
            tap_action:
              action: more-info
            hold_action:
              action: none
            double_tap_action:
              action: none
images:
  - url: /api/image/serve/e8117f71e0b9f69e40725eaac9daebeb/original
    title: SMART1_1FRONTAL.PNG
  - url: /api/image/serve/6569514ba96e23f13f5cbaf169c46f57/original
    title: SMART1_2VORNELINKS.PNG
  - url: /api/image/serve/6d40c181368b1dc1b80988e0461c5f6b/original
    title: SMART1_3LINKS.PNG
  - url: /api/image/serve/2782feb452019cb2f87c6a67075089f7/original
    title: SMART1_4HINTENLINKS.PNG
  - url: /api/image/serve/d45887fb2a17367d2bb4a2850641387b/original
    title: SMART1_5HINTEN.PNG
range_info:
  - energy_level:
      entity: sensor.smart_battery
      icon: ""
    range_level:
      entity: sensor.smart_range
    progress_color: "#ff3300"
    charging_entity: sensor.smart_charging_status
	
			Alles anzeigen
	Ihr müsst mal gucken das ihr die VIN aus dem Code entfernt
Ihr müsst mal gucken das ihr die VIN aus dem Code entfernt
Danke für den Hinweis. Hier nun meine fertige Karte. Funktioniert sicher nicht copy&paste bei jedem, aber vielleicht sind ein paar Anregungen dabei.
Features:
So bin ich mit der Karte erstmal zufrieden. Verbessern könnte man im Detail sicherlich noch das ein oder andere. Aber so gefällt es mir jetzt erstmal und sieht tatsächlich besser aus, als meine bisherige Übersicht zum Auto, in die ich auch schon viel Zeit investiert hatte. Daher: Danke cmdrfletcher für den Tipp!!
Hier ein paar Screenshots, sowie der Code:
Bildschirmfoto 2025-03-02 um 17.34.15.pngBildschirmfoto 2025-03-02 um 17.36.29.pngBildschirmfoto 2025-03-02 um 17.36.16.pngBildschirmfoto 2025-03-02 um 17.35.15.pngBildschirmfoto 2025-03-02 um 17.35.02.pngBildschirmfoto 2025-03-02 um 17.47.19.pngBildschirmfoto 2025-03-02 um 17.38.05.png
edit: Code als ZIP-Datei angehangen, da zu lang für einen Post ![]()
**edit: hier noch der Template-Sensor - Notwendigkeit erübrigt sich, sobald die Integration korrekt binary_sensoren gemäß meines letzten Vorschlags bereit stellt.
Einfach einen Template-Helfer vom Typ binary_sensor erstellen. Das Template macht nichts weiter, als den String "charging" in einen Boolean (True, False) zu übersetzen. Einen solchen erwartet die Karte nämlich, damit das animierte Icon angezeigt wird beim Laden.
Nach dem super Tipp von cmdrfletcher und der genialen Vorarbeit von Kanecaine habe ich dann meine Card für unseren Smart#1 heute auf Basis der Integration von DasBasti komplett neu gemacht:
Vielen Dank an cmdrfletcher & Kanecaine & DasBasti
Hallo, ich suche ein PNG-Bild vom Smart #3 Brabus Weiß in der Draufsicht. Weiß jemand Rat?
Smartphone App, Reiter Reifendruck, Screenshot machen und freistellen. So hab ich es gemacht.