You have a typo, it should be variables
BTW, why not just use the variables from button card instead of using decluterring-card’s variables and skip decluterring-card completely ?
Thank you. That fixes the missing card, not the layout.
The only reason I use decluttering-card is to pass tha variable mac to the card. I can see (and do) use variables within a button-card but can’t see how to pass them - I would be more than happy to just use a button-card.
Thanks
Andy
If you take the decluttering card and put in in for real with each set of variables, does it line up correctly? That will determine if it is the decluttering card or the settings used.
Sorry, I don’t understand what you mean.
Each card has a valid set of variables.
They are defined like:
- name: H570M
unique_id: "H570M"
state: |
{% if states.sensor.H570M_satellite_cputemperature.state == 'unavailable' or states.sensor.H570M_satellite_cputemperature.state == 'Unknown' %}
off
{% else %}
on
{% endif %}
attributes:
cpu_temperature: "{{ states.sensor.H570M_satellite_cputemperature.state }}"
cpu_use: "{{ states.sensor.H570M_satellite_cpuload.state }}"
memory_use: "{{ states.sensor.H570M_satellite_memoryusage.state }}"
disk_use: "{{ state_attr('sensor.H570M_satellite_storage_c','UsedSpacePercentage') }}"
Either from MQTT or some are through SNMP:
- platform: snmp
host: 192.168.1.125
baseoid: 1.3.6.1.4.1.44738.5.1.1.6.1
community: public
name: 'Asustor2 Total Space'
scan_interval: 30
accept_errors: true
- platform: snmp
host: 192.168.1.125
baseoid: 1.3.6.1.4.1.44738.5.1.1.7.1
community: public
name: 'Asustor2 Free Space'
scan_interval: 30
accept_errors: true
- platform: snmp
host: 192.168.1.125
baseoid: 1.3.6.1.4.1.44738.2.3.0
community: public
name: 'Asustor2 CPU Temperature'
scan_interval: 30
accept_errors: true
- platform: snmp
host: 192.168.1.125
baseoid: 1.3.6.1.4.1.44738.2.7.1.1.2.0
community: public
name: 'Asustor2 CPU Usage'
scan_interval: 30
accept_errors: true
Does that help??
Thanks
Andy
So, to ‘declutter’ a card, you have cards that you build, duplicate, and change a bunch of stuff.
In that, you need to build a card, test it with different options, declutter it, and use that decluttering template.
For all of that to work, you need to have a card that works before decluttering it.
The decluttering card you showed above is 116 lines.
Have you tried that with two full cards built into a horizontal stack to see if they line up correctly. I suspect they do not. I expect something in that 116 lines to be throwing something off. That is why testing it manually for two cards inside of a horizontal stack is necessary.
I hope that makes sense.
Setting the width and height of button-card will break automatic alignment in a stack. Use aspect_ratio: 1/1 instead if you want to make them square.
Thank you.
Changing the width/height for an aspect_ratio now gives:
Is there any way to control the size and still keep the alignment??
Cheers
Andy
Use grid card and an empty card for organizing layout if must.
Never an issue and auto adaptive.
Easy and elegantly simple
Hey, you should really switch to grid-template-areas in your custom button card, and not try to include vertical and horizontal stacks. That is really complicating things for you.
Anyone know of a way to use conditional card with decluttering card to achieve cards that only appear if the variable is populated ?
I have it working fine with mushroom chips conditional, but if I use the normal conditional card for other lovelace cards it fails saying it’s an invalid condition (since the entity name is essentially blank)
What I’m trying to achieve is a page with lets say 4 lights, which I can simply re-use for all my rooms, specifying the light entities as the variables, but some rooms have 1 light, others 2 etc… so the idea would be if one of the 4 entity variable is blank (or some dummy value) then don’t show the card for that light.
Try an entity-filter card.
I did not try it in a decluttering-card. But, if I read you correctly, I think this should work.
- type: entity-filter
entities:
- switch.living_room_lamp
- switch.does_not_exist
- switch.garage_relay
- switch.does_not_exist2
state_filter:
- operator: '!='
value: undefined
card:
type: entities
It only shows the two entities in the list that actually exist.
1 Like
HUGE thanks! That works a treat with a little tweak - I have to specify a ‘dummy’ value as the default (in decluttering card) that conforms to an entity type (sensor/cover etc…) and then just set ‘show_empty’ to false and viola works like a dream!
I hadn’t used the ‘entity-filter’ card before, but seems like it is what conditional card should have been as it’s way more flexible, so big thanks for the tip!
1 Like
Can’t get the decluttering card to work. Here are entries in configuration.yaml where the other 2 cards work just fine:
frontend:
extra_module_url:
- /hacsfiles/lovelace-card-mod/card-mod.js
- /hacsfiles/lovelace-state-switch/state-switch.js
- /hacsfiles/decluttering-card/decluttering-card.js
here is decluttering template from ui-lovelace.yaml:
decluttering_templates:
state_sensor_card_template:
default:
- icon: mdi:alert
- attribute: ''
- unit: ''
card:
type: entity
entity: '[[entity]]'
attribute: '[[attribute]]'
name: ' '
icon: '[[icon]]'
unit: '[[unit]]'
card_mod:
style: |
:host {
--card-mod-icon-color: '[[color_code]]';
--mdc-icon-size: 80%;
}
div.info span.value {
font-size: 160% !important;
margin-bottom: 0px;
}
.name {
margin-bottom: 10%;
}
.type-entity {
height: 110px;
}
div.name {
display: none;
}
ha-state-icon {
margin-top: -10px;
--mdc-icon-size: 80%;
margin-left: 5px;
margin-right: -0px;
margin-bottom: -5px;
}
here is the custom card used in dashboard:
type: custom:decluttering-card
template: state_sensor_card_template
variables:
- entity: sensor.room_state
- icon: mdi:motion-sensor-off
- attribute: motion
- color_code: >-
{% if state_attr('sensor.room_state', 'motion') == 'on' %} gold {% else %}
var(--paper-item-icon-color) {% endif %}
Here is the error I get when using the card:
I have tried as many combinations I could think of with no luck.
Someone please tell me what am I doing wrong?
Thank you.
- Get rid of card-mod code and check if it works.
- Why using “extra_module_url” for this card?
- I am not sure the Entity card does accept the “attribute: ‘’” value.
Will try 1 later tonight. On 2 that’s how I added the other two and they both work, so followed the same. On 3 that’s based on the examples I found on GitHub, I think.
What should the url tag be instead?
Thanks.
Checked #1. I use card-mod extensively, so removing that is not an option.
Happy to try other options.
Thanks.
You missed the point about card-mod. It was recommended to test with a simpler code.
As for other my two points - you seem to ignore it.
No, this is needed for card-mod only.
The decluttering cards is added as a resource.
…which could be wrong, so they must be checked before using in the decluttering card first.
First create just the most basic decluttering template, to test if the issue is in decluttering or something else. Strip all extra variables and just use the most barebones template you can. If that works, you know the card itself works, but something with your variables is the issue.
Regarding removing your card-mode code: he doesn’t mean you need to uninstall card-mod from HA. Just remove it from decluttering template, to test if the issue is there or not. If you find out that something between card-mod and decluttering is the issue, than all other testing is useless.
This is why I advice to start with a very simple template for decluttering. Then keep adding more variables till it breaks. Then you know what causes the issue. It could very well be that decluttering can’t seem to proces:
- color_code: >-
{% if state_attr('sensor.room_state', 'motion') == 'on' %} gold {% else %}
var(--paper-item-icon-color) {% endif %}
But only way of really being sure is to start small and keep adding more 
Also one thing I noticed:
do you use the GUI Card Editor or YAML? Depending on what you use, there’s a big difference between:
type: custom:decluttering-card
template: state_sensor_card_template
and:
- type: custom:decluttering-card
template: state_sensor_card_template
(talking about the - hyphen)
That makes sense now. Switched the template to this, but error message still remains the same.
decluttering_templates:
state_sensor_card_template:
card:
type: entity
entity: '[[entity]]'
icon: '[[icon]]'
unit: '[[unit]]'
YAML.
It seems to be finding the template, but then something goes wrong 
Thank you.
edit: I installed the decluttering card using HACS and I do see it listed in the resources under settings > dashboards > resources.
But what is the proper way to add it as a resource, is it configuration.yaml or ui-lovelace.yaml and what is syntax for that resource definition.
One more experiment, commented out the decluttering_templates: in ui-lovelace.yaml and restarted HA.
The error still remains the same. So, seems like the decluttering_templates is not getting picked up from ui-lovelace.yaml, not sure why.
Thank you.