Is it possible to have a diferent image for diferent shutters ?
Any way to do this with a different picture for each blind?
Hi,
I have solar powered shutters, is there a way to also show the battery percentage in the card?
I really don’t know. But because I updated my pics are gone. I’ll repair it and will look into it.
Hi @Deejayfool
I love your shutter card and u use it since a year now. I use it for closing my sun-screens. I also made an automation for this.
However, I have a feature request for this card.
From a security point of view, I do not like the idea that any of my family members is able to close the screens without knowing e.g. that the windows are still open. That causes great troubles.
In my automation, i use conditions for:
- Sun strength (=> 20.000 lux)
- Window is clodes
- Wind speed is below a certain value.
Would it be possible to add these conditions to the configuration of the shutter-catd?
And if it is already possible with the current card, how could i implement this in the current config of the card?
Regards, Bert
2 Likes
Do you need to disable the “lower” button if some conditions are met?
Hi @Ildar_Gabdullin , Thank you for coming back on this issue!
Yes, I think that would be a solution. But then with a grayed-out icon or some other information about the condition which is not med. (There are 3 conditions which has to be med.)
I do have a card witch shows all 3 conditions that need to be med:
type: horizontal-stack
cards:
- type: custom:mini-graph-card
entities:
- entity: sensor.openweathermap_temperature
name: Temp.
line_color: '#e74c3c'
line_width: 8
font_size: 75
- type: custom:mini-graph-card
entities:
- entity: sensor.openweathermap_wind_speed
name: Wind
line_color: var(--accent-color)
line_width: 8
font_size: 75
- type: custom:mini-graph-card
entities:
- entity: sensor.outside_luminance_front_illuminance_lux
name: Zon
line_color: var(--accent-color)
line_width: 8
font_size: 75
But I have no clue how to change the Shutter-Card to implement the 3 entities with there respective values…
Hello,
Is there anyway to see the opening pourcentage while draging the slider ? It’s really anoying to not be able to see the % while we are setting the position of the shutter.
Other tweakings that could be great :
- ability to change the shape of the windows (with little wood, bay, windows)
- One or more leaf
- ability to change easily the color of the windows chassis and color or shutter
Some inspiration (coming from Jeedom)
It is possible to disable buttons:
- type: custom:shutter-card
card_mod:
style: |
.sc-shutter-buttons {
{% if ............... %}
pointer-events: none;
color: var(--disabled-color);
{% endif %}
}
Here all 3 buttons are disabled; any button may be disabled separately if needed.
I am afraid that i am lost a bit.
I tried the following config for the ShutterCard:
type: custom:shutter-card
title: Screen wk Bert
entities:
- entity: cover.screen_4
name: Werkkamer Bert (4)
buttons_position: left
title_position: top
card_mod:
style: |
.sc-shutter-buttons {
{% if sensor.outside_luminance_front_illuminance_lux < 60,000 %}
pointer-events: none;
color: var(--disabled-color);
{% endif %}
}
I understand that the variable sc-shutter-buttons is a variable in the script-file hass-shutter-card.js .
I tried it first with just one variable; the sun strength in lux.
As Lux value in the if-statement i used 10000, 10,000 60000 1nd 60,000 to test. (current value is 12,254 lux.
But neither values give disabled buttons.
I am sorry, but i am not a programmer, so please …
I also tried to use Template sensors; i
- platform: template
sensors:
is_sun_above_horizon:
friendly_name: "Is Sun Above Horizon"
value_template: "{{ state_attr('sun.sun', 'elevation') > 0 }}"
is_sunny_day:
friendly_name: "Is Sunny Day"
value_template: "{{ states('sensor.openweathermap_temperature') | int > 20 }}"
is_warm_day:
friendly_name: "Is Warm Day"
value_template: "{{ states('sensor.outside_luminance_front_illuminance_lux') | int > 20000 }}"
is_windy_day:
friendly_name: "Is Windy Day"
value_template: "{{ states('sensor.openweathermap_wind_speed') | float > 4 }}"
#
is_window_open:
friendly_name: "Is Window Open"
value_template: "{{ is_state('binary_sensor.raam_sensor_werkkamer_b_1_contact', 'on') }}"
is_wind_speed_above_4:
friendly_name: "Is Wind Speed Above 4 m/sec"
value_template: "{{ states('sensor.openweathermap_wind_speed') | float > 4 }}"
I also tried to use the Window Open because I thought that might be simpler and exchanged {% if sensor.outside_luminance_front_illuminance_lux < 60,000 %}
with this: {% if binary_sensor.raam_sensor_werkkamer_b_1_contact = ‘on’ %} in the Style: part of your example.
But still i have no success… Hopefully you can help me further?
kind regard, Bert
This is wrong - and this is not about using card-mod or shutter-card, this is a wrong using HA templating.
Should be at least
{% if states('sensor.outside_luminance_front_illuminance_lux')|float(default=0) < 60,000 %}
(not sure about a comma in “60,000” - looking weird; also I usually use a dot “60.123”, but may be it depends on local settings)
Also, use Dev tools to test your templates.
Hello,
I have a little problem with the blind.
When I change them, the blind moves to the respective position, but in HA the percentage does not change and neither does the blind.
The position and percentage change only when I go to zigbee2mqtt in the respective device and give a refresh.
Do you have any idea why? And how do I solve it?
Sorry for the late reaction, but normal life came in between… But I still have not managed to get this working.
To keep it simple I tried your example with simply the entity for ‘window is open’ however, I did not see the the buttons grayed-out and the shutter-card buttons remain working in both positions; Window Open (on) and Closed (off).
type: custom:shutter-card
title: Screen wk Bert
entities:
- entity: cover.screen_4
name: Werkkamer Bert (4)
buttons_position: left
title_position: top
card_mod:
style: |
.sc-shutter-buttons {
{% if is_state('binary_sensor.raam_sensor_werkkamer_b_1_contact', 'on') %}
pointer-events: none;
color: var(--disabled-color);
{% endif %}
}
And in the Template Editor all conditions are working:
4) - Test raam wk-Bert open/dicht
{% if is_state('binary_sensor.raam_sensor_werkkamer_b_1_contact', 'on') %}
Ja, het raam is open
{% else %}
Nee, het raam is gesloten
{% endif %}
===============
5) Test Lux waarde
Zonsterkte is momenteel: {{ states('sensor.outside_luminance_front_illuminance_lux') }} lux.
{% if states('sensor.outside_luminance_front_illuminance_lux')|float(default=0) < 3500 %}
Zonsterkte is hoger dan: {{ zonsterkte }} lux.
{% else %}
Zonsterkte is lager dan: {{ zonsterkte }} lux.
{% endif %}
==================
6)
{% if states('is_sun_above_horizon') %}
1 - Ja, de zon is boven de horizon
{% else %}
2 - Nee, de zon is onder
{% endif %}
7)
# {{ states('sensor.openweathermap_temperature') | int > 20 }}
{% if states('sensor.openweathermap_temperature') | int > 20 %}
1 - De temperatuur is BOVEN de 20 graden Celcius
{% else %}
2 - De temperatuur is LAGER dan 20 graden Celcius
{% endif %}
These template sensors are working perfectly looking at the results in the Template Editor.
(To be honest, it is the first time I used the Template Editor; have still a lot to learn from Jinja2.)
BTW, I even tried ChatGPT in the hope that might give me some help with this. It was a very interesting session, but it good not help me; it apologized for that 
Use Home Assistant Lovelace ShutterCard to open and close sunscreens with the following conditions in the ShutterCard:
Hopefully you have still some suggestions…
1 Like
@JohnnSnoww , I do not have this behaviour with the shutter-card. I use two different switches (make) but both are Tasmotized and produce MQTT entities in Home Assistand. So mine are not Zigbee devices. So, I can’t help you with this.
I found something peculiar, don’t know if that is of importance for my issue?
In the default shutter-card config, I am able to use the buttons left to the shutter as well use the mouse pointer to drag the shutter open or close.
With the by @Ildar_Gabdullin proposed config, the buttons ate still usable, but drag with the mouse is no longer working.
But I do not get the grayed-out buttons. Perhaps this has something to do with the statement:
color: var(--disabled-color);
I do not know where this variable (–disabled-color) is coming from…
Regarding colors.
You seem to be not using a default theme.
Check with a default theme, it definitely has a proper —disabled-color variable.
Regarding mouse drag. Cannot check it myself (far from any civilian pc) but think that the “sc-shutter-buttons” selector does not touch the “shutter” element.
Hoi Ildar, yes that was the problem. I did had an other theme…
Selected ‘Use default Theme’ and now it works. I was in the impression that the variable --disabled-color came from the shutter-card.js. Sorry, I am not a programmer, and rather new to these things.
Problem is still that (when the window is open) if you click in the location of the buttons, that the screen still reacts.
Would there be a possibility to prevent all actions of the screens?
And an other problem is, that when I do this for one window, the buttons from all windows are affected the same way; even if the windows are closed…
But I have read similar issues with shutter-card.js, where changes for one shutter effects all orther windows. So perhaps this is an issue with shutter-card.js?
Unfortunately, the maker of this card @Deejayfool does not react on questions…
So, perhaps i have to live with the fact that it is not possible to find a solution for my issue.
On the other hand, I can imagine that more people would like a solution for this.
Thank you very much for your help and patient with this.
Kind regards, Bert
Hi @Ildar_Gabdullin I give-up on this and will try different approach.
I am going to use the conditional card with the custom:stack-in-card,
Then I can use a picture card with a picture from the original shuttter-card as one of the two cards, and my original shutter-card as the second card.
I can display either of the two depending on the status of the window open/close, or the other three conditions which i would like to add.
I would like to thank you very much for thinking with me in this exercise.
Kind regards, Bert
As messaged privately , who not use a conditional card instead of pointer_events: none.
This card is too deviant from core HA cards to reliably mod, and even then…
I’ve stopped using it because of that.
However, showing/hiding based on conditions can easily be doen with conditional or state-switch and not rely on card-mod of the card itself
O wait never mind…. You’ve reached the same conclusion 
Btw you never need stack-in-card if you already have card-mod.
Try reducing custom cards, and simply use an entities or vertical-stack
Just tested myself, works absolutely FINE - it is possible to disable buttons & blinds as well:
- type: custom:shutter-card
card_mod:
style: |
.sc-shutter-buttons,
.sc-shutter-selector {
{% if is_state('input_boolean.test_boolean','on') %}
pointer-events: none;
color: var(--disabled-color);
{% endif %}
}
entities:
- entity: cover.test_garage_door
