ygreq
(ygreq)
August 27, 2022, 9:55am
1
Hi folks!
Any idea how I can create a template that I can use in Lovelace so I can tick days of the week on and off? And based on the actual day of the week a binary sensor to turn on or off?
So in Lovelace if I tick Monday, Wednesday and Friday, on those specific days the binary sensor would turn on, otherwise off.
I found a few solutions of the forum but they don’t allow for presenting it on Lovelace.
Thank you so much!
tom_l
August 27, 2022, 10:21am
2
I currently use the custom button card .
- card_type: horizontal-stack
cards:
- entity: input_boolean.zone_3_mon
name: Mon
template: day_button
type: custom:button-card
- entity: input_boolean.zone_3_tue
name: Tue
template: day_button
type: custom:button-card
- entity: input_boolean.zone_3_wed
name: Wed
template: day_button
type: custom:button-card
- entity: input_boolean.zone_3_thu
name: Thu
template: day_button
type: custom:button-card
- entity: input_boolean.zone_3_fri
name: Fri
template: day_button
type: custom:button-card
- entity: input_boolean.zone_3_sat
name: Sat
template: day_button
type: custom:button-card
- entity: input_boolean.zone_3_sun
name: Sun
template: day_button
type: custom:button-card
template:
button_card_templates:
day_button:
color_type: icon
hold_action:
action: none
show_label: false
show_name: true
show_state: false
state:
- icon: mdi:checkbox-marked-circle
styles:
card:
- border: solid 1px var(--paper-item-icon-active-color)
- box-shadow: 0px 0px 10px 3px var(--paper-item-icon-active-color)
name:
- color: var(--primary-text-color)
value: 'on'
- icon: mdi:cancel
styles: null
value: 'off'
styles:
card:
- border-radius: 10px
- border: solid 1px var(--primary-color)
- box-shadow: none
- padding: 6px 0px
- margin: 0px 0px
- '--ha-card-background': rgba(0, 0, 0, 0)
grid:
- grid-template-areas: '"i" "n"'
- grid-template-rows: 33% auto
- grid-template-columns: auto
icon:
- width: 28px
name:
- justify-self: middle
- align-self: end
- font-size: 14px
- padding: 0px 0px
- color: var(--secondary-text-color)
tap_action:
action: toggle
However next month’s release introduces a schedule helper that I will be switching to.
2 Likes
ygreq
(ygreq)
August 27, 2022, 11:47am
3
May I ask where to put the code you shared? I’ve been going through the github and youtube to learn how to use the button-card, but still struggling.
I installed the button-card. But I am stuck at step 3 of the installation, I guess.
Add the configuration to your ui-lovelace.yaml
resources:
url: /hacsfiles/button-card/button-card.js
type: module
Where exactly should I put this code. I do not have a ui-lovelace.yaml.
Thank you so much!
tom_l
August 27, 2022, 12:00pm
4
If you install it with HACS you don’t have to worry about that, otherwise it is
Settings → Dashboards → ⋮ → Resources
ygreq
(ygreq)
August 27, 2022, 12:29pm
5
Then what are the actual steps I have to take in order to make your example work?
After creating the 7 input_booleans, I tried adding this to Lovelace:
type: horizontal-stack
cards:
- entity: input_boolean.monday
name: Mon
template: day_button
type: custom:button-card
- entity: input_boolean.tuesday
name: Tue
template: day_button
type: custom:button-card
- entity: input_boolean.wednesday
name: Wed
template: day_button
type: custom:button-card
- entity: input_boolean.thursday
name: Thu
template: day_button
type: custom:button-card
- entity: input_boolean.friday
name: Fri
template: day_button
type: custom:button-card
- entity: input_boolean.saturday
name: Sat
template: day_button
type: custom:button-card
- entity: input_boolean.sunday
name: Sun
template: day_button
type: custom:button-card
But it gives me an error obviously as I did not add the button template. I tried adding the template in configuration.yaml, but that gives me an error as well. Should I put it somewhere else? What am I missing?
Thank you so much!
tom_l
August 27, 2022, 1:02pm
6
When you press the ⋮ icon to edit your dashboard press it again after that and select Raw configuration editor. Paste the template at the top of your raw dashboard YAML. Save and exit.
1 Like
ygreq
(ygreq)
August 27, 2022, 1:16pm
7
I understand now. And it works, too. Thank you!!!
I do have a small issue, but maybe I can dibble in the template to make the icons smaller…
paulnel
(Paul)
December 16, 2022, 4:21am
8
Hallo, since latest update the color has gone wrong, pls will you comment on possible fix?