Variables in layout-card

Configuration Frontend
1

Hi,

I want to create a combination of cards who alltogether work like a climate-object, but more compact. The entitty shall be stored in a variable which is send to a script. But I receive: “Template rendered invalid entity IDs: {{ heizregler }}”. What am I missing?

      - type: custom:layout-card
        variables:
          heizregler: climate.heizregler_bad
        layout_type: custom:grid-layout
        layout:
          grid-template-columns: 20% 60% 20%
          grid-template-areas: |
            "tool1 tool2 tool3"
            "main main main"
        cards:
          - type: custom:button-card
            icon: mdi:minus-box
            tap_action:
              action: call-service
              service: script.heizung_0_5_erniedrigen
              data:
                Heizung: '{{ heizregler }}'
          - type: custom:timer-bar-card
          - type: custom:button-card
          - type: markdown
            content: text
            view_layout:
              grid-area: main
2

There is no such option - “variables”. You probably took it from some other card (like button-card). Try moving it into the button-card.

3

Thank you, I was hoping to get something like global variables, but the more I search and read about that topic the more I get confused. I surrender and will fill in the values manually.

4

That is a purpose of declaring a “global” variable on the layout-card’s level?
First, it is not “global” since you declared for this particular layout-card.
Assume that you need to use this variable in many cards inside the same layout-card - but these variables are only supported inside a custom button-card. And you got only ONE button-card inside this layout-card.
So, the initial purpose of declaring this variable on the layout-card’s level is unclear.
If this variable is only used in that particular button-card - then declare it in this card; and as I said variables are only supported by custom button-cards….

5

ok, thanks again. So I took a step back and tried to use a variable in the button-card.

          - type: custom:button-card
            variables:
              heizregler: climate.heizregler_bad
            icon: mdi:minus-box
            tap_action:
              action: call-service
              service: script.heizung_0_5_erniedrigen
              data:
                Heizung:
                  {{ heizregler }}

Now I get “Template rendered invalid entity IDs: {‘[object Object]’: None}”

6

looks like the decluttering card GitHub - custom-cards/decluttering-card: 🧹 Declutter your lovelace configuration with the help of this card could do what I want. I will try that.

7

Because you are using a variable inside button-card in a wrong way. Read docs for this card - it has a dedicated chapter for variables.
If some option of button-card supports templates - it should be like:

type: custom:button-card
…
some_option: >-
  [[[ return variables.my_variable; ]]]
1 Like
8

In your particular case the whole layout card will be a decluttering template, and an input variable will be used inside that button-card.
Yes, a working way as well - if you need SEVERAL same layout-cards with different entities inside the inner button-card.

9

awesome, that’s what I was looking for! the cornered brackets mean that it’s javascript?

10

what’s the difference between

{% set variableName = "variableValue" %}

and

variables:
  variableName:  variableValue

and on top I would like to get the “last_reported”-value of a climate-entity like this

{{ states.climate.heizregler_bad.last_reported }} #works fine!

but with a variable

{% set heizung = "climate.heizregler_bad" %}
{{ states(heizung).last_reported }} #'str object' has no attribute 'last_reported'
11

button-card only supports JS for templates.

12

First can be used inside jinja. Button-card does not support jinja.
Second is a native feature of button-card.

13

This is not valid.
Use the previous statement in jinja.
But in button-card you need to use JS to access this attribute and convert to “xxx minutes ago”. The easiest way - use a native option of button-card (find it in Docs).

14

thanks to Ildar_Gabdullin I learned the following things:

  • Variables can be used in different ways in some cards, in some not.
  • In my case, there was one way to use variables in the button-cards :
 - type: custom:button-card
            variables:
              heizregler: climate.heizregler_bad
            tap_action:
              action: call-service
              service: script.heizung_0_5_erniedrigen
              data:
                Heizung: [[[ return variables.heizregler; ]]]
  • and another way in the html-template-card:
  - type: custom:html-template-card
    content: >-
      {% set raum = "Wohnzimmer" %}
      {% set heizregler =  "climate.heizregler_wohnzimmer" %}
      <div >Temperatur im {{ raum }} ist {{ state_attr(heizregler,
      'current_temperature') }}°</div>
  • so far I did not found an easy way to declare a variable in a layout card and reuse it in the included button-cards.