+1 for that, been fiddling with that all day, hoping it wouldn’t be necessary shortly… co cool this is going to be! thx!
So… what I would do is build a template switch that cycles through low, medium, high, and off speeds. I can help you with that if you need it.
I actually thought of doing that but ended up not going down that route since its use might require cycling through all of the speeds to arrive at the intended setting. For me, that would work well but the WAF would take a hit. 
Why not just create a script which takes an entity and a speed as inputs and call this script from 3 buttons with 3 different speeds, the script would turn_on and set the speed at the same time. The last one being off just call the fan.turn_off service? cc: @petro
Also each speed button would light up based on a state template which checks the current speed of the fan
1 Like
Ok, how about this… an entities card with a vertical-in-stack-card, made to look like a button. The vertical stack will contain 1 icon button card, icon only. 1 markdown card with the label. 1 horizontal stack with 4 square buttons, off, low medium high. I’d envision it looking like this:
yet another challenge and a bit of a search, cause the button shows a text I can’t explain, probably error code, thought the inspector doesn’t indicate an error, bottom right button:
I fear it has to do with the ‘Off’ in the code, but having it quoted should mitigate that?
please have a look at my code for this, the others are exact copies and work perfectly:
- type: custom:button-card
template: button_picture_script_small
name: 'Uit'
entity_picture: '/local/hue_scenes/off.png'
tap_action:
action: call-service
service: script.tiles_set_hue_scene
service_data:
option: 'Off'
state:
- operator: template
value: >
return states['input_select.hue_scenes'].state === 'Off'
color: 'lightgrey'
name:
color: darkgrey
- operator: default
color: grey
name:
color: lightgrey
for testing purposes I change the name from ‘Off’ to ‘Uit’, because I would have sworn the error wasn’t there before, but no effect it has. The button does work as intended and changes style on state.
Unfortunately, I’m not at home so I can’t share my precise configuration but this should give you a good visual understanding of my current progress.
The above screenshot is of the actual fan-control-entity-row card. My current iteration using button-card is visually near-identical. The entire thing exists within a vertical-in-stack card with multiple button-cards with each card representing a specific visual object (Icon, Name, speed button, etc.).
Functionally, the Icon, Name and On/Off button make the same service call - fan.toggle. There are also object specific graphical tweaks that take place based on the entity state. (Icon spins when the fan is on, etc.).
Really, the final step is figuring out how to get the speed and states acted upon. Based on @Mariusthvdb’s suggestion and @RomRider’s follow up, it sounds like a script may be the correct way forward. Now I need to learn scripting in HA. 
you need to terminate the line
value: >
return states['input_select.hue_scenes'].state === 'Off';
It’s not
name:
color: xxxx
It’s
styles:
name:
- color: xxx
PS: your javascript is fine, no need for parenthesis or ; at the end for 1 line.
1 Like
I was wondering about that, since in my whole setup I terminate JS templates indeed. These buttons apparently don’t need that, and the many I have built so far don’t throw errors or unexpected behavior…
btw, I ve tried it just now, and makes no difference
then you need it in parenthesis
EDIT: You are trying to get the word ‘true’ or ‘false’ there, correct?
Oops, missed that yes. Funny how the color does change as it should. Simply showing the error in the correct color ;0)
No, I need the word ‘Off’ to switch off the lightgroup:
now only need to find out why some change the active name color to black, and some don’t, and stay white, while I have nothing set in the config of that button:
see:
and code:
- type: custom:button-card
template: button_picture_script_small
name: Arctic
entity_picture: '/local/hue_scenes/arctic.png'
tap_action:
action: call-service
service: script.tiles_set_hue_scene
service_data:
option: 'Arctische dageraad'
state:
- operator: template
value: >
return states['input_select.hue_scenes'].state === 'Arctische dageraad'
color: '#00d0a0'
- operator: default
color: grey
- type: custom:button-card
template: button_picture_script_small
name: Relax
entity_picture: '/local/hue_scenes/relax.png'
tap_action:
action: call-service
service: script.tiles_set_hue_scene
service_data:
option: 'Ontspannen'
state:
- operator: template
value: >
return states['input_select.hue_scenes'].state === 'Ontspannen'
color: '#ffc059'
- operator: default
color: grey
- type: custom:button-card
template: button_picture_script_small
name: Clear
entity_picture: '/local/hue_scenes/clear.png'
tap_action:
action: call-service
service: script.tiles_set_hue_scene
service_data:
option: 'Helder'
state:
- operator: template
value: >
return states['input_select.hue_scenes'].state === 'Helder'
color: '#fcdb97'
- operator: default
color: grey
Hi
I’m trying to show as label_template a text and the state of the entity, but without success
This is the code
- type: "custom:button-card"
color_type: icon
entity: sensor.qnapb3c_cpu_usage
name: CPU
icon: mdi:chip
size: 30px
label_template: >
return 'CPU: ' + states['sensor.qnapb3c_cpu_usage'].state;
show_label: true
show_name: false
action: none
styles:
icon:
- height: 20px
card:
- height: 80px
label:
- font-size: 14px
and this is the result
What’s wrong in the code?
Thanks
not really sure, but I think you mean the ‘CPU’ isn’t showing?
I’ve tested this:
- type: custom:button-card
color_type: icon
# entity: sensor.qnapb3c_cpu_usage
name: CPU
icon: mdi:chip
size: 30px
label_template: >
return '°C: ' + states['sensor.cpu_temperature'].state;
show_label: true
show_name: false
action: none
styles:
icon:
- height: 20px
card:
- height: 80px
label:
- font-size: 14px
which shows like:
and with your CPU:
so the template is correct.
at least you don’t need the entity in the config, since you use the full path in the template…try take that out?
or use the entity in the template (and take out name, since you don’t want to show it anyway):
- type: custom:button-card
color_type: icon
entity: sensor.cpu_temperature
#name: CPU
icon: mdi:chip
size: 30px
label_template: >
return '°C: ' + entity.state;
show_label: true
show_name: false
action: none
styles:
icon:
- height: 20px
card:
- height: 80px
label:
- font-size: 14px
Thanks @Mariusthvdb
That’s correct, now it shows the text I want to show ‘CPU: 8%’ with
label_template: >
return 'CPU: ' + states['sensor.qnapb3c_cpu_usage'].state + '%';
What is missing in this way is the last_changed value I would like to show in the button card, not showing anymore.
Is there any way to show it?
Thanks
Hi, I don’t really understand it showed before, (it wasn’t the state it showed??) but for last_changed you do need the entity of course… and use show_last_changed: true in the config to show that in the label.
Sorry, I forgot to copy in my code, but it is the last line not showed here
- type: "custom:button-card"
color_type: icon
# entity: sensor.qnapb3c_cpu_usage
name: CPU
icon: mdi:chip
size: 30px
label_template: >
return 'CPU: ' + states['sensor.qnapb3c_cpu_usage'].state + '%';
show_label: true
show_name: false
action: none
styles:
icon:
- height: 15px
card:
- height: 80px
label:
- font-size: 12px
show_last_changed: true
But in this way, since the entity is not anymore defined, it’s not showing up
as I read the docs, the show_last_changed replaces the label completely. SO you can’t have both…
solution might be to give it a name_template (and use the label template for that) and use show_last_changed.
For that you do need the entity in the entity: field. And then you can change the template to entity.state
Thanks!
Is there an attribute that I can use and add in the label (meybe on a new row) ?
label_template: >
return 'CPU: ' + states['sensor.qnapb3c_cpu_usage'].state + '% ' + states['sensor.qnapb3c_cpu_usage'].attributes.last_changed;
In this way is not working, I’m getting ‘undefined’
Yes sure, but I don’t think this would work, since last_changed isn’t an attribute. think it is states['sensor.qnapb3c_cpu_usage'].last_changed but you’d have to try, I didn’t use that in Buttons yet.
- type: custom:button-card
color_type: icon
entity: sensor.cpu_temperature
icon: mdi:chip
size: 30px
name_template: >
return '°C: ' + entity.state;
show_label: true
show_name: true
show_last_changed: true
action: none
styles:
icon:
- height: 20px
card:
- height: 80px
label:
- font-size: 14px
note: for the name_template you need the last version 1.10 which isn’t released yet 
uses
- type: custom:button-card
color_type: icon
entity: sensor.cpu_temperature
icon: mdi:chip
size: 30px
name_template: >
return '°C: ' + entity.state + ', ' + entity.last_changed;
show_label: true
show_name: true
show_last_changed: true
action: none
styles:
icon:
- height: 20px
card:
- height: 80px
label:
- font-size: 14px
so yes the is possible, just need to format the entity.last_changed to your liking