Custom Header

mayker · May 23, 2020, 5:38pm

The fix for this is mentioned above in Steven_Rollason’s post. This is due to the icon changes in 0.110 and requires the icon to be wrapped in a div.

niconath · May 23, 2020, 7:33pm

hi, how do I disable access to custom header for a user and also be able to set a default theme for that user?
Thanks to you

mayker · May 23, 2020, 7:55pm

Custom Header doesn’t select themes, you would set that in the user’s settings found at the very bottom of the HA sidebar.

To disable access to CH settings you would use an user exception with a config that hides CH settings.

niconath · May 23, 2020, 8:04pm

thanks a lot for your help the problem is that i don’t have access to the sidebar anymore to change my theme…

conditions:
        user: garage
      config:
        default_tab: '1'
        disable_sidebar: true
        show_tabs: '1'
        menu_hide: true
        hide_tabs: '0,2,3,4,5,6,7,8,9,10'
        hide_ch_settings: true
        hide_help: true

mayker · May 23, 2020, 8:19pm

To temporarily restore the default header, sidebar, etc check the first two important notes found here. Or just change the sidebar setting, select the theme, and disable sidebar again.

niconath · May 23, 2020, 8:23pm

Oh, right, well, thank you very much for all your help and hard work. Good job.

mayker · May 23, 2020, 8:28pm

You can simplify your config by removing hide tabs. show_tabs is an alternative to hide_tabs, there is no need for both. Show tabs will show only the tabs listed and hide tabs will hide the ones listed. Also, disable_sidebar automatically hides the menu button so you can remove that as well:

conditions:
        user: garage
      config:
        default_tab: '1'
        disable_sidebar: true
        show_tabs: '1'
        hide_ch_settings: true
        hide_help: true

niconath · May 23, 2020, 8:45pm

Okay, great. Thanks a lot. I’ll do that right now.

Yoinkz · May 24, 2020, 4:57pm

Hey Steven,

I took your code and for some reason I see a ‘n’ after the weather icon.

Have you come across that?
I tried removing things here and there, but I can only remove it by removing the whole icon div tag

Steven_Rollason · May 24, 2020, 5:21pm

I don’t see that on mine. I can only think that there is a stray character between the and the - what does your config look like (it looks slighty different to mine, as I don’t have the date)?

Yoinkz · May 24, 2020, 6:31pm

Got this… And I even tried removing the ‘dayNameShort’ because of the Scandinavian character ‘ø’, but that didn’t change a thing.

custom_header:
  background: 'rgba(150, 150, 150);'
  button_text:
    options: >-
      {{ hours24 }}:{{ minutesLZ }} - {{ dayNameShort }}. {{ dayNum }}. {{ monthNameShort }} - <div
      style='display: inline-block; height:32px; width:32px;
      vertical-align:middle;'><ha-icon icon='mdi:weather-{%- if
      is_state('weather.dark_sky', 'partlycloudy') -%}partly-cloudy {%- elif
      is_state('weather.dark_sky', 'clear-night') -%}night {%- else
      -%}{{states('weather.dark_sky')}}{%- endif -%}'></ha-icon></div>
        {{states.weather.dark_sky.attributes.temperature }}°

mayker · May 24, 2020, 6:45pm

remove the extra indent before the last line:

  button_text:
    options: >-
      {{ hours24 }}:{{ minutesLZ }} - {{ dayNameShort }}. {{ dayNum }}. {{
      monthNameShort }} - <div style='display: inline-block; height:32px;
      width:32px; vertical-align:middle;'><ha-icon icon='mdi:weather-{%- if
      is_state('weather.dark_sky', 'partlycloudy') -%}partly-cloudy {%- elif
      is_state('weather.dark_sky', 'clear-night') -%}night {%- else
      -%}{{states('weather.dark_sky')}}{%- endif -%}'></ha-icon></div>
      {{states.weather.dark_sky.attributes.temperature }}°

Yoinkz · May 24, 2020, 7:46pm

Oh my…! How easy
Than you guys!

sbmlat · May 25, 2020, 12:43am

With latest release these errors show up pretty often in the log. There are at least 100+ same messages around that timeframe. Few occasions HA wouldn’t load (with big error message in red color) and HA would reload only if I select ‘Reload resources’. How do I narrow down this issue?

HA 0.110.1
CH: 1.4.6

2020-05-24 18:41:43 ERROR (MainThread) [frontend.js.latest.202005191] http://192.168.86.226:8123/hacsfiles/custom-header/custom-header.js:596:26328 Uncaught TypeError: Cannot read property 'querySelector' of undefined
2020-05-24 18:41:43 ERROR (MainThread) [frontend.js.latest.202005191] http://192.168.86.226:8123/hacsfiles/custom-header/custom-header.js:596:26328 Uncaught TypeError: Cannot read property 'querySelector' of undefined
2020-05-24 18:41:43 ERROR (MainThread) [frontend.js.latest.202005191] http://192.168.86.226:8123/hacsfiles/custom-header/custom-header.js:596:26328 Uncaught TypeError: Cannot read property 'querySelector' of undefined
2020-05-24 18:41:43 ERROR (MainThread) [frontend.js.latest.202005191] http://192.168.86.226:8123/hacsfiles/custom-header/custom-header.js:596:26328 Uncaught TypeError: Cannot read property 'querySelector' of undefined
2020-05-24 18:41:43 ERROR (MainThread) [frontend.js.latest.202005191] http://192.168.86.226:8123/hacsfiles/custom-header/custom-header.js:596:26328 Uncaught TypeError: Cannot read property 'querySelector' of undefined
2020-05-24 18:41:43 ERROR (MainThread) [frontend.js.latest.202005191] http://192.168.86.226:8123/hacsfiles/custom-header/custom-header.js:596:26328 Uncaught TypeError: Cannot read property 'querySelector' of undefined
2020-05-24 18:41:43 ERROR (MainThread) [frontend.js.latest.202005191] http://192.168.86.226:8123/hacsfiles/custom-header/custom-header.js:596:26328 Uncaught TypeError: Cannot read property 'querySelector' of undefined
2020-05-24 18:41:43 ERROR (MainThread) [frontend.js.latest.202005191] http://192.168.86.226:8123/hacsfiles/custom-header/custom-header.js:596:26328 Uncaught TypeError: Cannot read property 'querySelector' of undefined

mayker · May 25, 2020, 1:02am

Submit an issue on the Github with the required info and I’ll check it out.

sbmlat · May 25, 2020, 1:10am

Sure. This time I will try to capture screenshot.

mayker · May 25, 2020, 3:08am

Screenshot isn’t really necessary, but info like: your config, browser, and anything else in the list from that link that you think might be helpful. Submitting issues to Github helps me keep track of them and will automatically ask you for the required info I need to try to replicate and troubleshoot the issue.

MikaNeon · May 25, 2020, 9:48am

Hi,
I have the same problem as Yoinkz
which indent should be removed?

mayker · May 25, 2020, 2:40pm

The one that he had on the last line of the code he posted. The code from my comment has the indent removed from his code.

If your’s is different, post it here and I could try to see your issue.

MikaNeon · May 25, 2020, 6:03pm

I got to work right.
Thanks for help