groot29
April 24, 2023, 10:13am
1
Hi everyone, I wanted to add a photo and resize it, next to the “Raccolta differenziata” card but I can’t.
I tried to upload it but I can’t resize the photo.
Yaml code:
type: vertical-stack
cards:
- type: custom:digital-clock
- show_current: true
show_forecast: true
type: weather-forecast
entity: weather.casa
theme: ios-dark-mode
- type: entities
entities:
- entity: sensor.rifiuti
name: 'Oggi si esce:'
icon: mdi:trash-can-outline
theme: ios-dark-mode
title: Raccolta Differenziata
Thank you
jchh
April 24, 2023, 1:32pm
2
do you mean resize by putting it in a horizontal-stack?
type: vertical-stack
cards:
- type: custom:digital-clock
- show_current: true
show_forecast: true
type: weather-forecast
entity: weather.casa
theme: ios-dark-mode
- type: horizontal-stack
cards:
- type: # picture here
- type: entities
entities:
- entity: sensor.rifiuti
name: 'Oggi si esce:'
icon: mdi:trash-can-outline
theme: ios-dark-mode
title: Raccolta Differenziata
groot29
April 24, 2023, 7:29pm
3
Thank you,
jchh
April 24, 2023, 7:53pm
4
Try using an entity card (rather than an entities card with only one entity).
- type: horizontal-stack
title: Raccolta Differenziata
cards:
- type: # picture here
- type: entity
entity: sensor.rifiuti
name: 'Oggi si esce:'
icon: mdi:trash-can-outline
groot29
April 24, 2023, 9:06pm
5
It works! but…
How can I make the smallest photo?
[image]
jchh
April 24, 2023, 9:48pm
6
Yep. That is a little large!
If you use custom:button-card , you can specify the size of the icon,
groot29
April 24, 2023, 11:34pm
7
forgive my ignorance. I already have custom-button-card, but I can’t edit the yaml code.
type: vertical-stack
cards:
- type: markdown
content: Benvenuto,
theme: kibibit
- type: custom:digital-clock
- show_current: true
show_forecast: true
type: weather-forecast
entity: weather.casa
theme: ios-dark-mode
- type: entities
entities:
- entity: sensor.rifiuti
name: 'Oggi si esce:'
icon: mdi:trash-can-outline
theme: ios-dark-mode
- type: horizontal-stack
title: Raccolta Differenziata
cards:
- type: picture
image: \local\raccolta-differenziata\cart.png
- type: entity
entity: sensor.rifiuti
name: 'Oggi si esce:'
icon: mdi:trash-can-outline
jchh
April 25, 2023, 7:42am
8
morning here now…
You can, but it is yaml only - if you edit it you should see the yaml on the LHS. Try copy/pasting this:
type: custom:button-card
entity: sensor.rifiuti
name: 'Oggi si esce:'
show_entity_picture: true
entity_picture: \local\raccolta-differenziata\cart.png
size: 20px
groot29
April 25, 2023, 10:17am
10
Ok it work!
type: custom:button-card
layout: icon_label
theme: ios-dark-mode
show_entity_picture: true
entity_picture: \local\raccolta-differenziata\cart.png
size: 50px
entity: sensor.rifiuti
label: |
[[[
return ' ' + states['sensor.rifiuti'].state;
]]]
show_label: true
show_name: false
but…
The theme doesn’t apply to me
jchh
April 25, 2023, 11:28am
11
I don’t use themes, but I am pretty sure it doesn’t go inside a card.
Edit your dashboard in the UI and then edit the view you are using. You should see theme there…
groot29
April 25, 2023, 11:31am
12
Thank you
I’ll try it as soon as I get home. Could you recommend me a guide where to learn yaml? I already know python and C#
jchh
April 25, 2023, 1:16pm
13
YAML is ‘only’ a markup language. The one thing to note is that it is extremely fussy over indents - pay attention to them.
I learned by trial and error playing with homeassistant. The docs always show the yaml equivalent of all their integrations etc (as do HACS etc) so it’s quite easy to get up to speed. The templating engine is Jinja2 (so basically Python) and so hopefully will come easy to you.
groot29
April 25, 2023, 1:17pm
14
Thank you
latest question:
type: custom:button-card
layout: icon_label
theme: ios-dark-mode
show_entity_picture: true
entity_picture: \local\raccolta-differenziata\cart.png
size: 50px
entity: sensor.rifiuti
label: |
[[[
return ' ' + states['sensor.rifiuti'].state;
]]]
show_label: true
show_name: false
how can i insert a control saying:
if states['sensor.waste'].state == Plastic
replace image with entity_picture: \local\sorted-collection\PLASTIC.png
???
jchh
April 25, 2023, 1:21pm
16
I’ll need to check when I get home, but it will be something like this:
entity_picture: |
[[[
if (states['sensor.waste'].state == 'Plastic') return '\local\sorted-collection\PLASTIC.png'
else return '\local\raccolta-differenziata\cart.png'
]]]
[edit: we were both posting at the same time and you split your post in two so I ended up replying to myself!
jchh
April 25, 2023, 1:24pm
17
btw, that can be put on one line by enclosing in double-quotes:
label: "[[[ return ' ' + states['sensor.rifiuti'].state ]]]"
groot29
April 25, 2023, 1:45pm
18
Ops, sorry!
Thank you but the image doesn’t show:
type: custom:button-card
layout: icon_label
theme: ios-dark-mode
show_entity_picture: true
entity_picture: |
[[[
if (states['sensor.rifiuti'].state == '🟢 Vetro') return '\local\raccolta-differenziata\cart.png'
else return '\local\raccolta-differenziata\cart.png'
]]]
size: 50px
entity: sensor.rifiuti
label: '[[[ return '' '' + states[''sensor.rifiuti''].state ]]]'
show_label: true
show_name: false
jchh
April 25, 2023, 2:05pm
19
try 3 equal signs
entity_picture: |
[[[
if (states['sensor.rifiuti'].state === '🟢 Vetro') return '\local\raccolta-differenziata\cart.png'
else return '\local\raccolta-differenziata\cart.png'
]]]
groot29
April 25, 2023, 4:14pm
21
maybe what I wanted to do can’t be done. I read on the internet that it only works for icons. Request: if I use the icon, can I color it?
jchh
April 25, 2023, 7:24pm
22
yes, you can absolutely set the colour. Have you read the docs though - it’s all laid out there…
…and this is also a way to sent the entity_picture…
state:
- value: `Plastic'
entity_picture: /local/...
styles:
icon:
- color: yellow
1 Like
]
