Does '${VAR1}' as a entity works for You?
Does this example of templated entities works?
Looking for some help. I am trying to display a series of security cameras based on the state of my input_select.camera. I have so far been able to get to a card created in lovelace with no Errors, but also no camera image. I am trying to display 4 separated cameras. Can anyone help me see what I am doing wrong?
type: custom:config-template-card
variables:
- states['input_select.camera'].state
entities:
- input_select.camera
card:
type: custom:button-card
entity: input_select.camera
show_live_stream: true
size: 100%
aspect_ratio: 1.8/1
card_size: 1
Hello
Is possible to modify the value of a state-label in a picture-elements with this card?
I have a sensor that display its value in seconds and I want to show it in hours, so I think on use this card an divide it by 3600.
Ok
Thank you for the info
Hello. Is it possible to get the name of currently selected theme?
Hey, I just started with Home Assistant a few days back and Iām loving your template cards. Theyāre working fine for the most part, however, they donāt instantly update on state change. Iāve added a binary sensor entity in nodered which Iām controlling with one of your cards like so:
type: custom:config-template-card
entities:
- switch.heater_override
variables:
- states['switch.heater_override'].state
card:
type: button
tap_action:
action: toggle
entity: switch.heater_override
name: ${vars[0]==='on' ? 'Manuell':'Automatisch'}
icon: ${vars[0]==='on' ? 'mdi:fire':'mdi:home-automation'}
icon_height: 47px
From my understanding of the docs, the value should update on state change since its listed in the entities (i.e. it should be monitored). However, the lovelace view wonāt update until a few minutes later. Looking at the same view on a different device allready shows the new state, though. Adding the exact same logic (without changing name and icon of cource) in a standard entity cards updates instantly. What am I doing wrong?
Regards
Dominic
There is smth wrong with your switch.
Check this test switch:
switch:
- platform: template
switches:
test_switch:
value_template: "{{ is_state('input_boolean.test_boolean', 'on') }}"
turn_on:
- service: input_boolean.turn_on
entity_id: input_boolean.test_boolean
turn_off:
- service: input_boolean.turn_off
entity_id: input_boolean.test_boolean
And the card:
type: custom:config-template-card
entities:
- switch.test_switch
variables:
- states['switch.test_switch'].state
card:
type: button
tap_action:
action: toggle
entity: switch.test_switch
name: ${vars[0]==='on' ? 'Manuell':'Automatisch'}
icon: ${vars[0]==='on' ? 'mdi:fire':'mdi:home-automation'}
icon_height: 47px
1 Like
Well, no idea what was wrong. Iāve deleted and re-created the entity in node red and it works just fine now. Thanks for pointing me to an issue with the switch itself.
btw the same may be achieved by using custom:button-card
1 Like
trying to have auto-entities accept a config-template-card variable in the state: field for a numerical comparison just wont let me do itā¦
- type: custom:config-template-card
entities:
- input_number.power_threshold
variables:
threshold: states['input_number.power_threshold'].state
card:
type: custom:auto-entities
card:
type: grid
title: Test Icon color Buttons
columns: 4
card_param: cards
filter:
include:
- entity_id: sensor.*_actueel
exclude:
- state: "<" '${threshold}' ## <-----
Ive tried about any format I could think of, so please have a look how this could be done?
using the card with
- state: "<20"
works perfectly, and the input_number is also correct and live.
eg
another card using the same number:
- type: custom:config-template-card
entities:
- input_number.power_threshold
variables:
threshold: states['input_number.power_threshold'].state
row:
type: section
label: >
${'Above: ' + threshold
works just fine, so it must be the format of the - state: line
update
wait, I had tried it all except the obvious: - state: '${"<" + threshold}' which does the trickā¦ 
nvm me. sorry for bothering
type: vertical-stack
cards:
- type: entities
entities:
- input_number.test_level_1
- type: custom:config-template-card
entities:
- input_number.test_level_1
variables:
threshold: states['input_number.test_level_1'].state
card:
type: custom:auto-entities
card:
type: entities
filter:
include:
- entity_id: sensor.battery_*
options:
name: '${threshold}'
state: '${"< " + threshold}'
aaaaaaa too late)))
yep, too late thanks anyways!
I added
card:
type: grid
title: "${'Test Icon color Buttons above ' + threshold}"
too just for the fun of it
full card:
- type: custom:config-template-card
entities:
- input_number.power_threshold
variables:
threshold: states['input_number.power_threshold'].state
card:
type: custom:auto-entities
card:
type: grid
title: "${'Test Icon color Buttons above ' + threshold}"
columns: 4
card_param: cards
filter:
include:
- entity_id: sensor.*_actueel
options:
type: custom:button-card
aspect_ratio: 1/1
show_state: true
template: support_custom_ui
exclude:
- state: '${"<" + threshold}'
sort:
method: state
numeric: true
yet unformatted buttons, but thats a matter of injecting another templateā¦
there is still a challenge of not showing the card at all if the list is empty. Think the only way is using a conditional card on a dedicated template
{% set threshold = states('input_number.power_threshold')|float(0) %}
{% set ns = namespace(above_threshold=[]) %}
{% for s in states.sensor
|selectattr('entity_id' 'search','_actueel')
if s.state|float(0) > threshold %}
{% set ns.above_threshold = ns.above_threshold + [s.entity_id] %}
{% endfor %}
{{ns.above_threshold|length > 0}}
Have you tried with āshow_empty: falseā option?
type: vertical-stack
cards:
- type: entities
entities:
- input_number.test_level_1
- type: custom:config-template-card
entities:
- input_number.test_level_1
variables:
threshold: states['input_number.test_level_1'].state
card:
type: custom:auto-entities
card:
type: grid
columns: 4
card_param: cards
show_empty: false
filter:
include:
- entity_id: sensor.battery_*
options:
type: custom:button-card
aspect_ratio: 1/1
show_state: true
state: ${"< " + threshold}
But if the list is empty, there is an extra gap below the card:
empty:
not empty:
ā¦ so sorry bout that. I guess figured the embedding config-template-card needed the conditionā¦ can conform it works as expected with show_empty: false.
And yes, thereās a tiny gap when empty. we had that before with core conditional cards too remember? maybe thereās still some code to improve here too.
btw, (0ff topic here, but also peculiarity with endingsā¦) I did post the issue of clipping of last Childs in fold-entity-row, fixed that by downgrading for now ā¦ just so you know
btw, how do we mod the title of the grid card??
card_mod:
style: |
.card-header {
background-color: var(--background-color-off);
color: var(--text-color-off);
padding-top: 0px;
padding-bottom: 0px;
margin: 0px 0px 16px 0px;
}
wont stick, and the element sure is card-header
I also did try 
type: custom:mod-card
card_mod:
style: |
.card-header {
background-color: var(--background-color-off);
color: var(--text-color-off);
padding-top: 0px;
padding-bottom: 0px;
margin: 0px 0px 16px 0px;
}
card:
type: custom:auto-entities
card:
type: grid
and dont get You did it wrong! in inspector, but still no header change.
moving that to:
card:
type: custom:mod-card
style:
hui-grid-card:
$: |
.card-header {
background-color: var(--background-color-off);
color: var(--text-color-off);
padding-top: 0px;
padding-bottom: 0px;
margin: 0px 0px 16px 0px;
}
does seem to touch the actual grid card header, but it doesnt do what it is supposed to doā¦
so, a bit of an oddity, this grid card modding
this is what that header mod should do (and does system wide):
ok, so it kicked in after all, but didnt see some of the settings I use in my custom-card-mod-theme. this works now:
card:
type: custom:mod-card
style:
hui-grid-card:
$: |
.card-header {
background-color: var(--background-color-off);
color: var(--text-color-off);
font-weight: 300; /* in card-mod-theme but not recognized here */
letter-spacing: 0px; /* in card-mod-theme but not recognized here */
padding-top: 8px;
padding-bottom: 8px;
margin: 0px 0px 8px 0px;
}
Yes, I even wanted to post 2 issues (one, two) regarding this gap but decided not to to it - may be these are not related things.
Yes, I have a subscription to the cards I use, read every issue))). Just have not read your post yet!
As you already noticed, grid card does not have a ha-card element. We have to use mod-card.
type: custom:mod-card
card:
type: grid
title: some title
columns: 4
cards:
- &ref_0
type: button
entity: sun.sun
- *ref_0
card_mod:
style:
hui-grid-card $: |
.card-header {
background-color: yellow;
color: red !important;
padding-top: 0px !important;
padding-bottom: 0px !important;
margin: 0px 0px 16px 0px;
}
Sorry for card-mod off-topic here.
1 Like
To get it back on topic: how do we get this config to auto update based on the states in the embedded auto-entities card? In my config they only update in a refresh of the view.
The identical card (albeit with a fixed threshold ) without the template card auto-updates perfectly.
You have to list ALL included entities in the āentitiesā option.
aww, that would be it. thats too bad really, because it makes the card useless for embedding an auto-entities cardā¦
just fr the sake it I tried to add a glob to the entities
- type: custom:config-template-card
entities:
- input_number.power_threshold
- sensor.*_actueel
because thats the same the auto-entities uses, but that isnt seen by the config-template-card either. Might be a nice FR though
listing all entities wouldnāt be useful, so I might have to resort to template for the auto-entities, and only heave the header of the card use the config-template-card.
like this:
entities:
- type: custom:config-template-card
entities:
- input_number.power_threshold
variables:
threshold: states['input_number.power_threshold'].state
row:
type: section
label: >
${'Above: ' + threshold
- type: custom:slider-entity-row
entity: input_number.power_threshold
- type: custom:auto-entities
card:
type: entities
card_mod: &mod
style: |
ha-card {
box-shadow: none;
margin: -16px -16px 0px -16px;
}
filter:
template: >
{% set threshold = states('input_number.power_threshold')|float(0) %}
{% set ns = namespace(above_threshold=[]) %}
{% for s in states.sensor
|selectattr('entity_id','search','_actueel')
if s.state|float(0) > threshold %}
{% set ns.above_threshold = ns.above_threshold + [s.entity_id] %}
{% endfor %}
{{ns.above_threshold}}
sort:
method: state
numeric: true
but then use buttons in a grid, if possible.
1 Like
Using config-template-card only for the header is a TOO small task for this great card.
You may use a markdown for that.
Well, may be to have a standard caption w/o using card-mod for turning markdown into captionā¦