Custom Header

[grzeg8102]

@mayker

This has been mentioned quite a bit, so I should probably start thinking of a new mode that doesn’t collapse the header and expands the width of the tabs to the full width of the header.

Wow, that would be excellent! I’m looking forward to see that!

[Mariusthvdb (Marius)]

so, rather mixed results after updating to HA 105.2. CH causing/having issues again:

2020-02-07 00:37:00 ERROR (MainThread) [frontend.js.latest.202001302] redacted:8125/local/lovelace/resources/custom-header.js?v=1.3.2:145:62732 TypeError: undefined is not an object (evaluating 'n.tabs.length')
2020-02-07 00:37:03 ERROR (MainThread) [frontend.js.latest.202001302] redacted:8125/local/lovelace/resources/custom-header.js?v=1.3.2:145:62732 TypeError: undefined is not an object (evaluating 'n.tabs.length')
2020-02-07 00:37:08 ERROR (MainThread) [frontend.js.latest.202001302] redacted:8125/local/lovelace/resources/custom-header.js?v=1.3.2:145:62732 TypeError: undefined is not an object (evaluating 'n.tabs.length')
2020-02-07 00:37:12 ERROR (MainThread) [frontend.js.latest.202001302] redacted:8125/local/lovelace/resources/custom-header.js?v=1.3.2:145:62732 TypeError: undefined is not an object (evaluating 'n.tabs.length')
2020-02-07 00:37:16 ERROR (MainThread) [frontend.js.latest.202001302] redacted:8125/local/lovelace/resources/custom-header.js?v=1.3.2:145:62732 TypeError: undefined is not an object (evaluating 'n.tabs.length')

What could this be Ryan? Had to comment CH out in resources.yaml, disabled mode wasn’t enough to stop it from slowing HA down.

please have a look?

[mayker (maykar (pronounced "maker" with a southern accent))]

I am unable to reproduce and have no issues with any of my many test setups in 105.2. Comment out all of your CH config and uncomment one config item at a time until you see the error and report back. With a config like yours, that’s unfortunately all I can offer.

[exetico]

Thanks for an Awesome component!

Have you considered to make something for the sidebar, too?

I would like to gave the option to group my elements in the sidebar.

[ferad]

How can i disable, hide or remove the “Custom Header” option in the button menu for a specific user or non administrator users? Or, how is it possible to completely disable the button menu onclick feature.

[mayker (maykar (pronounced "maker" with a southern accent))]

@exetico I have considered it and if I ever find the time I may create it

@ferad There is currently no option to hide the settings option, but that would be a good feature request. The only option right now would be to hide the options button completely.

[sleeepy2]

Try this, this is what I use.

Villhellm/custom-sidebar

[mayker (maykar (pronounced "maker" with a southern accent))]

Oh, awesome! Glad to see someone did it, I’ve got some code saved from an attempt at a custom-sidebar project with some features that they might be interested in. Will have to make a PR soon.

[hazio]

Hi, is it possible to enable ‘Footer mode’ only for mobile, and not for Desktop? thanks

[mayker (maykar (pronounced "maker" with a southern accent))]

Yes. https://maykar.github.io/custom-header/#configuration/exceptions

[timdonovanuk]

Is it just me or are exceptions broken in the latest version? Whenever I make changes to the kiosk exception, and press save, when I go back, they chosen options have not stuck.

Under any exception, everything is also ghosted out. I’ve tried unsetting “Disabled mode” too…

[jvosterode]

I have the same Problem. And everything i setup for a single user (exception) does not have any impact. Whether in the Custom Header Menu or Raw Editor.

[mayker (maykar (pronounced "maker" with a southern accent))]

@timdonovanuk & @jvosterode

Please read the issues section and post an issue with the required info

[ASNNetworks]

Hi, is it possible to set the color of the active tab individually per tab? So basically everyhing is grey, but when I select tab 0, it’s white, when I select tab 1 it’s yellow etc. I read through the documentations, but all I could do is give each tab a different color. But then they’re in that color all the time, I want them to only be in that color when the tab is active.

Is this possible, or am I trying to accomplish the impossible?

[mayker (maykar (pronounced "maker" with a southern accent))]

This is currently only possible with exceptions with tab conditions:

custom_header:
  exceptions:
    - conditions:
        tab: 0
      config:
        active_tab_color: white
    - conditions:
        tab: 1
      config:
        active_tab_color: yellow

[Valentino_Stillhardt]

@mayker

Per user/device configs

That’s incredible

[ASNNetworks]

I couldn’t get this to work. Could that be because I already have setup different exceptions (with footer mode etc) for different users and device id’s?

[mayker (maykar (pronounced "maker" with a southern accent))]

Yes, if you have other exceptions already this isn’t going to help you. I’ll think about adding a feature that would help support this, but it might be a bit.

[ASNNetworks]

That’s too bad. It’s not completely necessary, but would make my UI just that much more clean. I have created color coded UI where each domain has it’s own color theme (yellow for light buttons e.g) and have separated domains per tab. So I wanted to have the tabs their own color to match the domain.

[Makis]

Hi
I need some help please

I have installed CH through HACS
I would like to add the following code in raw editor, but nothing happens.
If I keer only the first 2 lines the the header gets narrow. (indicates that it works)
What am I doing wrong?

custom_header:
  compact_mode: true
  button_text:
    options: >-
      {{ hours12 }}:{{ minutesLZ }} {{ AMPM }} -  <ha-icon icon='mdi:weather-{%
      if is_state("weather.dark_sky", "partlycloudy") -%}partly-cloudy{%- else
      -%}{{ states('weather.dark_sky')}}{%- endif %}'></ha-icon>
      {{states.weather.dark_sky.attributes.temperature }}°