I’m using the custom button card. Works great. Setup with the color changing from green if it is closed to orange if it open. Showing the door in the open and closed state.
2 Likes
yes - but you need to be in Lovelace UI - to use it…
Hey, great, can you explain to me how you did please change the icon status?
Thank you in advance.
I’m using the horizontal stack card for what I posted above. You can just use the manual card with the code below to shown just one button.
Here is the code for just the garage door button. One tap will close the garage door and double tap will open it. Just change the “entity_id” to yours and play around with the sizing to suit.
card:
- height: 10px
- width: 60px
double_tap_action:
action: call-service
service: cover.open_cover
service_data:
entity_id: cover.garage_door
entity: cover.garage_door
show_state: true
size: 40%
state:
- color: green
icon: 'mdi:garage'
value: closed
- color: orange
icon: 'mdi:garage-open'
value: open
styles: null
tap_action:
action: call-service
service: cover.close_cover
service_data:
entity_id: cover.garage_door
type: 'custom:button-card'
1 Like
Yes OK great, thank you very much, but how do you change the background color of the card? Thanks to you
I use the google dark theme.
All right, all right, thank you very much.
But it is not possible to change the background colour directly in the map?
Hi Matt, thanks for this. It is working for me almost well. I have setup everything but I cannot close the door. So - when I tap on the button door - the door is opening + changing the icon. Which is fine. But when I click for the second time - it doesn’t close the door - there is just no reaction…
My binary sensor is configured as:
binary_sensor:
- platform: template
sensors:
sonoff_dfdffdgfd:
device_class: garage_door
value_template: “{{ is_state(‘switch.sonoff_dfdffdgfd’, ‘on’) }}”
you might have to adapt it to fit your setup.
my garage door is just controlled via a z-wave outlet that is attached to a relay that’s wired into the bell wire on the opener, which when turned on is effectively like i’m standing in the garage pressing the wall button. i have a HA automation that always turns that outlet off 2 sec after it’s turned on…so when i turn that outlet on, it’s basically the same thing as if i were standing there holding the wall button down for 2 sec.
the catch here is that you can’t (at least i don’t think you can) change the action on that card based on the state of the door. it works for me because no matter whether i’m opening or closing, it’s always the same action (just turn on the garage door opener outlet).
if you have separate actions for open and close, you can use a state-switch to change the card based on the state of the door (which will allow you to set up two different cards with different actions).
something like this…
type: 'custom:state-switch'
entity: garage_door_sensor
states:
'off':
type: 'custom:button-card'
entity: garage_door_sensor
show_icon: true
show_name: true
tap_action:
action: action.do_garage_door_open
icon: 'hass:garage'
state:
- value: 'off'
color: 'rgb(68,115,159)'
'on':
type: 'custom:button-card'
entity: garage_door_sensor
show_icon: true
show_name: true
tap_action:
action: action.do_garage_door_close
icon: 'hass:garage-open'
state:
- value: 'on'
color: 'rgb(255,0,0)'
that may be even easier if you have just one sensor that controls both the door status and the open/close, you’d be able to change the entity on the on/off cards to match that entity and run whatever service calls you need on that. in my case, i have a sensor on the door that tells me if it’s open (on) or closed (off), so i would use that entity to determine the status of the door and what icon to show.
i hope that makes sense…let me know if anything is confusing and i’ll do my best to help (of course anyone else feel free to jump in too if i missed something obvious).
2 Likes
Very nice–I think this is my favourite way to surface a garage door opener. Status and action from a single icon wins the WAF award too. I changed the door opener to a hold_action as I’ve accidentally swiped it on my phone. A tap calls more_info.
1 Like
that’s actually a really good idea (changing the actual open action to hold rather than tap). i’m always paranoid that i’m going to randomly open the door when i don’t want to.
i also have mine set up to not allow for opening the door at night - if my alarm is turned on in night mode, the button changes to only be more info (no way to actually open the door via the button). it’s also conditional so that if the door is open, i can close it from the button…just won’t allow me to open from the button.
if i want to open it, i can always go into the device itself and turn it on…it’s just my own failsafe so i don’t bump the button in the middle of the night and randomly open the garage door without realizing it.
Sadly, on iOS at least, the hold action is extremely unreliable. I’ve changed to double tap which seems good so far.
What is it about tech demos to the wife that means they always seem to fail? 
i am thinking about trying to work up a confirmation popup so that i can safely use single tap without worry about bumping it accidentally…
Did you ever incorporate a confirmation?
no, but I have added a smart switch that the opener is plugged into that is turned off except when I need to open the door…which is effectively like a garage door lock (with no power to the opener there’s no way to open the door).
Question on your card. I set it up that the way you had it and if the door is open it will close by clicking on it. However, it will not open when you click on it even with the call to service to open it. I can open it if I manually put in the call to service for that cover. Not sure why it will not work.
Maybe try using the call service cover.toggle?
Hi Matt,
do you know where are something wrong?
type: 'custom:state-switch'
entity: binary_sensor.garage_garage_door_contact
states:
'off':
type: 'custom:button-card'
entity: binary_sensor.garage_garage_door_contact
show_icon: true
show_name: true
tap_action:
action: call-service
service: switch.turn_on
service_data:
entity_id: switch.garage_trigger
icon: 'hass:garage'
state:
- value: 'off'
color: 'rgb(68,115,159)'
'on':
type: 'custom:button-card'
entity: binary_sensor.garage_garage_door_contact
show_icon: true
show_name: true
tap_action:
action: call-service
service: switch.turn_off
service_data:
entity_id: switch.garage_trigger
icon: 'hass:garage'
state:
- value: 'on'
color: 'rgb(255,0,0)'
Many thanks!
NB: I’m a newbie
honestly i’m not an expert on the state switch, but my random guess off the top of my head is that on and off don’t need quotes. not sure if that would cause issues, but it might.
what exactly is going wrong?
I definitely don’t have a lot of experience with templates but using status of sensors I was able to get this to work as I wanted - hope this helps someone 
This is used with Zooz ZEN16 relay and Zooz Tilt sensor.
type: custom:button-card
tap_action:
action: toggle
entity: switch.garage_door_relay_2
entity: binary_sensor.double_garage_door_sensor_window_door_is_open
show_state: true
name: Double Door
styles:
card:
- height: 100px
- width: 105px
icon: mdi:garage
state:
- value: off
color: purple
value: on
color: green