Icon templating not working

Hi,

I have templating in various cards that I setup a while ago without any issues, but now trying to make a new card I’m struggling to get it to work for some reason.

When I use icon: ‘mdi:fan’ for the fan it works fine, but as soon as I use icon_template: it switches back to the default icon and ignores the template entirely :

Here is the code itself :

entities:
  - entity: light.bathroom_light_light
    name: Main Light
    toggle: true
    type: 'custom:slider-entity-row'
  - entity: switch.bathroom_fan_switch
    name: Fan
    icon_template: |
      {% if is_state('switch.bathroom_fan_switch', 'on') %}
        mdi:fan
      {% else %}
        mdi:fan-off
      {% endif %}
  - entity: sensor.bathroom_sensor_humidity
    name: Humidity
title: Bathroom
type: entities
show_header_toggle: false

What am I missing ?
Thanks

The official documentation.
If you show me icon_template there I’ll explain you how to use it.

You can’t template in lovelace without custom cards.

see this custom card:

type: 'custom:card-templater'
card:
  type: entities
  title: Bathroom
  entities:
  - entity: light.bathroom_light_light
    name: Main Light
    toggle: true
    type: 'custom:slider-entity-row'
  - entity: switch.bathroom_fan_switch
    name: Fan
    icon: |
      {% if is_state('switch.bathroom_fan_switch', 'on') %}
        mdi:fan
      {% else %}
        mdi:fan-off
      {% endif %}
  - entity: sensor.bathroom_sensor_humidity
    name: Humidity
1 Like

I’ve created a handful of template switches for instances like this - not ideal / easy - but does work.

- platform: template
  switches:
    garage_door_main:
      friendly_name: "Main Garage Door Switch"
      value_template: "{{ is_state('cover.main_garage_door', 'open') }}"
      turn_on:
        service: cover.open_cover
        data:
          entity_id: cover.main_garage_door
      turn_off:
        service: cover.close_cover
        data:
          entity_id: cover.main_garage_door
      icon_template: >-
        {% if is_state('cover.main_garage_door', 'open') %}
          mdi:garage-open
        {% else %}
          mdi:garage
        {% endif %}

Multiple ways to ‘skin a cat’ in HA - sometimes just not as straight-forward as we’d like sometimes… :joy:

Try using the custom card template-entity-row https://github.com/thomasloven/lovelace-template-entity-row

if he goes that route, he should just create a template fan which should handle his icons for him.

EDIT: Not sure if it actually changes the icon based on the state though.

EDIT2: Scratch this, icon does not change. Use template switch instead.

Wow, now that’s fancy… Learn something new every day!

1 Like

Thanks dad

1 Like

Are you sure? I have a feeling it’s not designed to support input_xxx entities in a way standard cards do.

I tried template-entity-row first, but with that one the toggle button went away (replaced by “on” / “off”), the fan is automated so I’m not sure I’ll be using the toggle anyway but just in case I went with card-templater, which simply works.

I didn’t realize that was simply impossible without a plugin, thanks for all the tips ! It’s working great now :slight_smile:

Actually the template-entity-row works fine with input_xxx entities. I use it quite a bit in my ui. It has a lot of nice features for packing a lot of information in the space of a normal entity row.

Have you tried HTML with it? Just curious if you can add icons to fields. I haven’t used it but I might give it a whirl and try this out myself.

No I haven’t tried HTML with it.

1 Like

I experienced exactly the same. And here’s some more info from Thomas…

Or you meant something else?

True. The toggle is still in the more-info dialog which you access by clicking on the control. If you rarely use it then not sure it matters. The advantage is you get templates for all the options plus control over the secondary text line. Seems like a fair tradeoff in some circumstances.

never tried that but presume it’s true as it’s not a custom card. well, for me it was a deal breaker as I don’ want such a long way to turn my setting on or off. UPDATE: actually, I used that card when it didn’t support more-info, it’s been added quite recently but I’ve already moved to more flexible solution (button-card)

To deal with this issue I ended up creating a “custom” control using stack-in-card, input_boolean wrapped in hue-element (so I can things like conditionally hiding and styling).

1 Like

That is what I meant yes, I want to keep the toggle at the end of the line so that plugin doesn’t fit unfortunately.
But card-templater works really well and is very simple to use :

card:
  entities:
    - entity: light.bathroom_light_light
      name: Main Light
      toggle: true
      type: 'custom:slider-entity-row'
    - entity: switch.bathroom_fan_switch
      icon_template: |-
        {% if is_state('switch.bathroom_fan_switch', 'on') %}
          mdi:fan
        {% else %}
          mdi:fan-off
        {% endif %}
      name: Fan
    - entity: sensor.bathroom_sensor_humidity
      name: Humidity
    - entity: sensor.bathroom_sensor_temperature
      name: Temperature
  show_header_toggle: false
  title: Bathroom
  type: entities
entities:
  - light.bathroom_light_light
  - switch.bathroom_fan_switch
  - sensor.bathroom_sensor_humidity
type: 'custom:card-templater'

2020-04-11-185212_490x328_scrot

1 Like