Add number of picture cards in a loop

Configuration Frontend
,
1

I have a Synology NAS and it has 3 hard drives. I want to create 3 picture cards of hard drive and display tempertature below them. I am using a button-card to build this out. Instead of hard coding 3 images in my yml (that works), I want to use a jinja template to add as many cards in a loop. My code is like

type: custom:button-card
show_state: true
tap_action:
  action: none
custom_fields:
  {% for n in range(3) %}
    hdd_image{{ n }}:
    card:
      type: picture
      image: local/hdd.png
      card_mod:
        style: |
          ha-card {
            background-color: transparent;
            border: none;
            width: 100px;
            height: 100px;
            left: {{ i }}*10px;
          }    
  {% endfor %}

However it doesn’t display anything. Can I get some help and point me in the right direction.

2

I may be wrong, but I was under the impression Button-card doesn’t use Jinja as template language, it’s Javascript.

1 Like
3

Button card supports JS for templating options - but it is possible only for SOME options which is described in docs. Surely it is not possible to generate a dictionary like OP tried.

1 Like
4

You might find this easier.