Photos + indication

kumi57 · Octobre 31, 2025, 4:36

Bonjour,

J’aimerais pouvoir ajouter une photo de mes plantes dans l’icone actuelle qui ressemble à une feuille. Pourriez-vous m’indiquer comment faire, s’il vous plaît ? Je suis également preneur de toute suggestion pour améliorer l’aspect visuel

J’aimerais aussi afficher la date du dernier arrosage. Pourriez-vous m’aider à mettre cela en place ?

Je vous remercie par avance

Voici mon code actuel :

type: grid
columns: 1
square: false
cards:
  - type: custom:bubble-card
    card_type: button
    button_type: state
    entity: sensor.ficus_benjamina_soil_moisture
    name: Ficus Benjamina
    show_last_changed: true
    icon: mdi:leaf
    force_icon: true
    button_action: {}
    styles:
      icon:
        - width: 100px
        - height: 100px
        - border-radius: 50%
        - object-fit: cover
      card:
        - padding: 10px
        - background-color: rgba(255,255,255,0.8)
    sub_button:
      - show_state: true
        entity: sensor.ficus_benjamina_temperature
  - type: custom:bubble-card
    card_type: button
    button_type: state
    entity: sensor.monstera_deliciosa_soil_moisture
    name: Monstera Deliciosa
    show_last_changed: true
    icon: mdi:leaf
    force_icon: true
    button_action: {}
    styles:
      icon:
        - width: 100px
        - height: 100px
        - border-radius: 50%
        - object-fit: cover
      card:
        - padding: 10px
        - background-color: rgba(255,255,255,0.8)
    sub_button:
      - show_state: true
        entity: sensor.monstera_deliciosa_temperature
  - type: custom:bubble-card
    card_type: button
    button_type: state
    entity: sensor.dracaena_marginata_soil_moisture
    name: Dracaena Marginata
    show_last_changed: true
    icon: mdi:leaf
    force_icon: true
    button_action: {}
    styles:
      icon:
        - width: 100px
        - height: 100px
        - border-radius: 50%
        - object-fit: cover
      card:
        - padding: 10px
        - background-color: rgba(255,255,255,0.8)
    sub_button:
      - show_state: true
        entity: sensor.dracaena_marginata_temperature

Ma configuration

System Information

version	core-2025.10.4
installation_type	Home Assistant OS
dev	false
hassio	true
docker	true
container_arch	aarch64
user	root
virtualenv	false
python_version	3.13.7
os_name	Linux
os_version	6.12.34-haos-raspi
arch	aarch64
timezone	Europe/Paris
config_dir	/config

Home Assistant Community Store

GitHub API	ok
GitHub Content	ok
GitHub Web	ok
HACS Data	ok
GitHub API Calls Remaining	4993
Installed Version	2.0.5
Stage	running
Available Repositories	2347
Downloaded Repositories	76

Solcast Solar

can_reach_server	ok

Home Assistant Cloud

logged_in	false
can_reach_cert_server	ok
can_reach_cloud_auth	ok
can_reach_cloud	ok

Home Assistant Supervisor

host_os	Home Assistant OS 16.2
update_channel	stable
supervisor_version	supervisor-2025.10.0
agent_version	1.7.2
docker_version	28.3.3
disk_total	57.9 GB
disk_used	12.2 GB
nameservers	192.168.1.254, 2001:861:2c30:920:46d4:54ff:fe8b:60b5
healthy	true
supported	true
host_connectivity	true
supervisor_connectivity	true
ntp_synchronized	true
virtualization
board	rpi5-64
supervisor_api	ok
version_api	ok
installed_addons	Tailscale (0.26.1), Advanced SSH & Web Terminal (21.0.4), Samba share (12.5.4), Mosquitto broker (6.5.2), Zigbee2MQTT (2.6.2-1), Studio Code Server (5.19.3), Linky (1.6.1), Piper (1.6.4), Speech-to-Phrase (1.4.1), Matter Server (8.1.1)

Dashboards

dashboards	5
resources	64
views	6
mode	storage

Network Configuration

adapters	lo (disabled), end0 (enabled, default, auto), docker0 (disabled), hassio (disabled), veth1c8f90d (disabled), veth7d81f40 (disabled), vethb5e1092 (disabled), veth90fdaa2 (disabled), veth6f24d62 (disabled), vethdf96d21 (disabled), vethc602eb4 (disabled), vetha7d0fc6 (disabled), vetha489e0d (disabled), vethfb8e6a3 (disabled), veth061b8e9 (disabled), vethc42c9a7 (disabled)
ipv4_addresses	lo (127.0.0.1/8), end0 (192.168.1.83/24), docker0 (172.30.232.1/23), hassio (172.30.32.1/23), veth1c8f90d (), veth7d81f40 (), vethb5e1092 (), veth90fdaa2 (), veth6f24d62 (), vethdf96d21 (), vethc602eb4 (), vetha7d0fc6 (), vetha489e0d (), vethfb8e6a3 (), veth061b8e9 (), vethc42c9a7 ()
ipv6_addresses	lo (::1/128), end0 (2001:861:2c30:920:8743:81eb:6ac2:aec9/64, fe80::a089:eef5:6ae6:aa4c/64), docker0 (fe80::acec:5ff:fefe:39cd/64), hassio (fe80::40fc:b2ff:fe04:550e/64), veth1c8f90d (fe80::944a:6eff:fe22:67e/64), veth7d81f40 (fe80::f47a:50ff:fe3e:d457/64), vethb5e1092 (fe80::a496:f3ff:fe5c:81fc/64), veth90fdaa2 (fe80::c4ac:74ff:fe8d:ab49/64), veth6f24d62 (fe80::984d:68ff:fe32:4d0d/64), vethdf96d21 (fe80::6c8b:f6ff:feb2:5fa6/64), vethc602eb4 (fe80::f0c8:a6ff:fefa:91f5/64), vetha7d0fc6 (fe80::1846:25ff:fe26:1d89/64), vetha489e0d (fe80::8882:dcff:fea8:330f/64), vethfb8e6a3 (fe80::4024:76ff:fe6e:d1c7/64), veth061b8e9 (fe80::f0b3:aff:fedd:341d/64), vethc42c9a7 (fe80::b859:1ff:fe85:19e2/64)
announce_addresses	192.168.1.83, 2001:861:2c30:920:8743:81eb:6ac2:aec9, fe80::a089:eef5:6ae6:aa4c

Recorder

oldest_recorder_run	19 octobre 2025 à 20:56
current_recorder_run	31 octobre 2025 à 17:16
estimated_db_size	648.46 MiB
database_engine	sqlite
database_version	3.49.2

___

xTG · Novembre 1, 2025, 7:33

Bonjour.

Dans la doc de cette carte on trouve cela pour un sub-button :

sub_button:
  - icon: none
styles: |-
  .bubble-sub-button-1 {
    background-image: url("/local/pictures/your_picture.jpg");
    background-size: cover;
  }

https://github.com/Clooos/bubble-card?tab=readme-ov-file#examples-8

Doubledom · Novembre 1, 2025, 9:03

Slt.

Regarde du côté de la carte Mushroom Template, configuration par UI

Tu peux mettre photo et icone

kumi57 · Novembre 2, 2025, 5:53

Merci pour ton retour, maintenant je vois la photo du ficus mais pas les deux autres une idée stp?

type: grid
columns: 1
square: false
cards:
  - type: custom:bubble-card
    card_type: button
    button_type: state
    entity: sensor.ficus_benjamina_soil_moisture
    name: Ficus Benjamina
    show_last_changed: true
    icon: mdi:blank
    force_icon: false
    button_action: {}
    card_mod:
      style: |
        ha-card .icon {
          background-image: url("/local/images/ficus.jpg");
          background-size: cover;
          background-position: center;
          width: 50px;
          height: 50px;
          border-radius: 50%;
          object-fit: cover;
        }
    styles:
      card:
        - padding: 10px
        - background-color: rgba(255,255,255,0.8)
    sub_button:
      - show_state: true
        entity: sensor.ficus_benjamina_temperature

  - type: custom:bubble-card
    card_type: button
    button_type: state
    entity: sensor.monstera_deliciosa_soil_moisture
    name: Monstera Deliciosa
    show_last_changed: true
    icon: mdi:blank
    force_icon: false
    button_action: {}
    card_mod:
      style: |
        ha-card .icon {
          background-image: url("/local/images/monstera.jpg");
          background-size: cover;
          background-position: center;
          width: 50px;
          height: 50px;
          border-radius: 50%;
          object-fit: cover;
        }
    styles:
      card:
        - padding: 10px
        - background-color: rgba(255,255,255,0.8)
    sub_button:
      - show_state: true
        entity: sensor.monstera_deliciosa_temperature

  - type: custom:bubble-card
    card_type: button
    button_type: state
    entity: sensor.dracaena_marginata_soil_moisture
    name: Dracaena Marginata
    show_last_changed: true
    icon: mdi:blank
    force_icon: false
    button_action: {}
    card_mod:
      style: |
        ha-card .icon {
          background-image: url("/local/images/dracaena.jpg");
          background-size: cover;
          background-position: center;
          width: 50px;
          height: 50px;
          border-radius: 50%;
          object-fit: cover;
        }
    styles:
      card:
        - padding: 10px
        - background-color: rgba(255,255,255,0.8)
    sub_button:
      - show_state: true
        entity: sensor.dracaena_marginata_temperature

Doubledom · Novembre 2, 2025, 6:07

Salut..

Regarde si tu vois par media, ou autre dans HA

Ou fait test sur une carte simple pas la grid …

xTG · Novembre 2, 2025, 6:15

Vérifies bien l’extension.
jpg, jpeg

kumi57 · Novembre 2, 2025, 10:39

Toutes mes phtos sont dans le format JPG🙂

xTG · Novembre 3, 2025, 5:47

Format et extension de fichier sont deux choses différentes.

Je rejoins l’avis plus haut, regardes dans média que tu vois bien tes images.

WarC0zes · Novembre 3, 2025, 5:55

Bonjour,
vide le cache de ton navigateur ou cas ou.

Après, comme le mentionne @xTG :

xTG:

Dans la doc de cette carte on trouve cela pour un sub-button :
sub_button:
  - icon: none
styles: |-
  .bubble-sub-button-1 {
    background-image: url("/local/pictures/your_picture.jpg");
    background-size: cover;
  }
GitHub - Clooos/Bubble-Card: Bubble Card is a minimalist card collection for Home Assistant with a nice pop-up touch.

Pas besoin de card_mod, bubble-card inclus sa propre modification de CSS avec styles.