Custom Header

Share your Projects! Dashboards & Frontend
84

@Mariusthvdb

Few questions that I haven’t answered for you yet.

The double chevron thing, I don’t think I’ll add it as you can just hold the current chevrons down to get to the end quickly.

Will look into adding that.

I’ll try to add notifications as a built-in template variable.

85

As explained in the readme for Custom CSS it will be a good bit of trial and error as you are fighting the styles that already exist and I can’t offer much support, the feature should be considered experimental especially since it’s subject to change on HA and Custom Header updates, but will see what I can do.

86

Ok, sounds reasonable. I will play some more with it tonight. Thanks for your reply

87

Thanks for that snippet of code! After a hard refresh in Firefox it works a treat! :grinning:

When I went through the documentation, I actually did think something like that would do the trick but I thought it might not handle hide_tabs being empty. Shame on me for not trying it first :blush:

88

Thanks @mayker after playing around some more I did manage to get it right. Srry for the bunch of questions and thanks for your support.

image
image1125×2436 599 KB

1 Like
89

I’ve switched from compact-custom-header to compact-header and it is working well, but can’t work out how to get into the UI editor (I use storage mode).
Previously I could click on Configure UI in the Lovelace options menu and then the menu updated to include an option to configure the compact header but now I only have Unused entities and Raw config editor.
Has the option moved elsewhere or is there some other reason why I am not seeing it?

1 Like
90

If you see those, you’re already in edit mode
Misread you want the CH editor. It is only shown when not in edit mode

1 Like
91

The option “compact header” is actually in that menu, before entering “configure ui” mode.

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

92

I click on the three dots menu in the top right hand corner:

22

and I just get a menu like this:

41

Am I looking in the wrong place?

93

nope, that’s where it should appear. any errors in your HA logs or browsers dev tools (F12). Are you using the latest custom-header version v1.0.4?

94

I have the same issue even after re-installing custom-header, clearing browser cache, and restarting hass.

Get this error in my home-assistant.log:

Tried to serve up '/config/www/community/custom-header/lit-element.js.map' but it does not exist
1 Like
95

@dooz127 how did you install custom-header? If you go to that path in your files, does the file exist?

96

I’m using 1.0.4 and I’m not seeing anything in the console
I get the same error from HACS as @dooz127 in the logs, but only when the console is open. I think this may just be Chrome trying to download the .js.map file for script debugging.

Here is my config:

custom_header:
  compact_mode: true
  exceptions:
    - conditions:
        query_string: embed
      config:
        default_tab: []
        hide_tabs: '9'
        kiosk_mode: true
        menu: show
        notifications: show
        options: show
        show_tabs: []
        voice: show
    - conditions:
        user_agent: Mobile
      config:
        compact_mode: true
        default_tab: []
        hide_tabs: 'Kiosk,Calendar,media-players,Github,Test'
        menu: show
        notifications: show
        options: show
        redirect: true
        show_tabs: []
        voice: show
    - conditions:
        query_string: testmode
      config:
        hide_tabs: 'Kiosk,Calendar'
        menu: show
        notifications: show
        options: show
        show_tabs: []
        voice: show
  hide_help: true
  hide_tabs: 'Kiosk,Calendar,Test'
  redirect: false

but it also happens with a minimal config like this:

custom_header:
  compact_mode: true
97

reported on something similar today:

24
24871×202 44.1 KB

the top error is gone (had to take out the actual file out of the folder) but the bottom one is still there. (thesis on Safari, hence maybe the different error language.

I did a manual install, and no the path does not exist. That is to say, up to the /lovelace/resources the pathos correct, the /lit-element.js.map is unknown to me

98

I installed using hacs. No, that file does not exist, only these:

/www/community/custom-header/custom-header.js
/www/community/custom-header/custom-header.js.gz

The Developer Tools Logs UI also says:

10:27 AM custom_components/hacs/http.py (ERROR) - message first occurred at 10:16 AM and shows up 3 times

I tried re-installing hacs, clearing cache, and restarting hass, but same thing.

99

@dooz127 @Mariusthvdb @Steven_Rollason

Give the latest (v1.0.5) a try. It looks like when adding translations to the editor & commonjs, commonjs added some unneeded sourceMappings. Still not sure why that would be the case as it seems to be behaving now.

I know that’s a bunch of tech jargon, but try the latest release.

100

I moved over from cch to this and now I don’t get the custom header pulldown and my header is there as well as a footer. Tried clearing out settings in raw config and it didn’t make a difference.

101

and your config is…:?

102

Do you still have CCH in your resources? Updated to the latest custom-header (v1.0.5)?

103

no I yanked that, do I need that still?