Template for repetition block in the card configuration

Configuration
1

Hello community,
I have many temperature & Humidity sensors, which i would like to colour represent them based on the value ranges they have. The if/else condition block is same for all the sensor entities, but could they be made as a template and use them? I’m sure there could be similar to function or macros like in the C. So far what i couldn’t find examples in the internet. Could you please anyone give me a suggestion ?

here is my raw code for a card:

type: entities
title: Dach & Balkon
show_header_toggle: true
header:
  image: >-
    https://www.home-assistant.io/images/dashboards/header-footer/balloons-header.png
  type: picture
entities:
  - entity: sensor.esp32_ff_balkonyoben_humidity
    name: Balkon-Oben Humidity
    card_mod:
      style: |
        :host {
          color:
            {% if states(config.entity) | int <= 40 %} #16a697
            {% elif states(config.entity) | int < 50 %} #15a340
            {% elif states(config.entity) | int < 60 %} #a5d115
            {% elif states(config.entity) | int < 70 %} yellow
            {% elif states(config.entity) | int < 77 %} #fcab30
            {% elif states(config.entity) | int < 80 %} #fa8925
            {% elif states(config.entity) | int < 85 %} #fa6825
            {% elif states(config.entity) | int < 90 %} #fa3e25
            {% elif states(config.entity) | int < 95 %} #d90404
            {% elif states(config.entity) | int > 95 %} #ce14f7
            {% endif %}
            ;
        }
  - entity: sensor.esp32_ff_balkonyoben_temperature
    name: Balkon-Oben Temperature
    card_mod:
      style: |
        :host {
          color:
            {% if states(config.entity) | float <= -10 %} #e6374b
            {% elif states(config.entity) | float <= -5 %} #eb2f90
            {% elif states(config.entity) | float <= -0 %} #e84fde
            {% elif states(config.entity) | float <= 5 %} #427deb
            {% elif states(config.entity) | float <= 10 %} #42b0eb
            {% elif states(config.entity) | float <= 15 %} #42cfeb
            {% elif states(config.entity) | float <= 18 %} #42ebe5
            {% elif states(config.entity) | float <= 21 %} #42ebad
            {% elif states(config.entity) | float <= 25 %} #42eb72
            {% elif states(config.entity) | float <= 27 %} #97eb42
            {% elif states(config.entity) | float <= 29 %} #d2eb42
            {% elif states(config.entity) | float <= 31 %} #e3eb42
            {% elif states(config.entity) | float <= 32 %} #ebd742
            {% elif states(config.entity) | float <= 35 %} #ebb042
            {% elif states(config.entity) | float <= 37 %} #eb8842
            {% elif states(config.entity) | float > 37 %} #eb5e42
            {% endif %}
            ;
        }
  - type: divider
    style:
      height: 2px
      background: black
  - entity: sensor.esp32_ff_dachschaukelzimmer_humidity
    name: Schaukelzimmer Humidity
    card_mod:
      style: |
        :host {
          color:
            {% if states(config.entity) | int <= 40 %} #16a697
            {% elif states(config.entity) | int < 50 %} #15a340
            {% elif states(config.entity) | int < 60 %} #a5d115
            {% elif states(config.entity) | int < 70 %} yellow
            {% elif states(config.entity) | int < 77 %} #fcab30
            {% elif states(config.entity) | int < 80 %} #fa8925
            {% elif states(config.entity) | int < 85 %} #fa6825
            {% elif states(config.entity) | int < 90 %} #fa3e25
            {% elif states(config.entity) | int < 95 %} #d90404
            {% elif states(config.entity) | int > 95 %} #ce14f7
            {% endif %}
            ;
        }
  - entity: sensor.esp32_ff_dachschaukelzimmer_temperature
    name: Schaukelzimmer Temperature
    card_mod:
      style: |
        :host {
          color:
            {% if states(config.entity) | float <= -10 %} #e6374b
            {% elif states(config.entity) | float <= -5 %} #eb2f90
            {% elif states(config.entity) | float <= -0 %} #e84fde
            {% elif states(config.entity) | float <= 5 %} #427deb
            {% elif states(config.entity) | float <= 10 %} #42b0eb
            {% elif states(config.entity) | float <= 15 %} #42cfeb
            {% elif states(config.entity) | float <= 18 %} #42ebe5
            {% elif states(config.entity) | float <= 21 %} #42ebad
            {% elif states(config.entity) | float <= 25 %} #42eb72
            {% elif states(config.entity) | float <= 27 %} #97eb42
            {% elif states(config.entity) | float <= 29 %} #d2eb42
            {% elif states(config.entity) | float <= 31 %} #e3eb42
            {% elif states(config.entity) | float <= 32 %} #ebd742
            {% elif states(config.entity) | float <= 35 %} #ebb042
            {% elif states(config.entity) | float <= 37 %} #eb8842
            {% elif states(config.entity) | float > 37 %} #eb5e42
            {% endif %}
            ;
        }

any appologies for my naive question since i’m a new HA user, excited to explose since a week.

2

Custom template Macros

3

Thanks for your response! I did as it says in the page, but doesn’t really work. I might have done mistake in the format. Here is what i did:
Created a macro in a new jinja file:

image
image1127×306 26.1 KB

This Macro i tried in the Template editor and it has worked!

Then I reloaded calling the service “Home Assistant Core Integration: Reload custom Jinja2 templates”
added my adaptation in the card raw code editor:

type: entities
title: Test
show_header_toggle: true
header:
  image: >-
    https://www.home-assistant.io/images/dashboards/header-footer/balloons-header.png
  type: picture
entities:
  - entity: sensor.esp32_ff_balkonyoben_humidity
    name: Balkon-Oben Humidity
    card_mod:
      style: |
        :host {
          color: 
            {% from 'formatter.jinja' import colour_valueRangeHumidity %}
            {{ colour_valueRangeHumidity('sensor.esp32_ff_balkonyoben_humidity') }}
            ;
        }

as in the page says it can be added in the automation (sorry I haven’t started anything with automation, perhaps current it is for me less interesting since i’m geeting my Dashboard working with nice coloured display)

also where do i see the error or confirmation that my macro has been loaded & available for use?

4

When you add a new jinja or yaml file it may be necessary to perform a restart.

You can test that the macro is available for use by pasting your template calling the macro, i.e. {% from 'formatter.jinja' import colour_valueRangeHumidity %} {{ colour_valueRangeHumidity('sensor.esp32_ff_balkonyoben_humidity') }}, into the Template editor tool in Developer tools. If it doesn’t work, restart Home Assistant and check again.