Custom Header

Thanks, that worked perfectly. Any idea how I can change the color on the very top of the header in the iOS app from the default blue?

Trying to get the custom header to work, but i put my lovelace to kiosk mode and can’t deactivate it anymore. How to get that?

2nd important note

I believe the iOS app uses the primary color from your theme as the status bar color, not sure if it can be changed any other way.

Not sure, but i think this only works if the theme is set to ‘Backend-selected’ and then set via service call.

Release 1.2.2

This one adds a bunch of new features for templates and exceptions, including the much requested per tab condition for exceptions.

New Exception Conditions:

  • is_admin : Set to true or false to match admin or not
  • is_owner : Set to true or false to match owner or not
  • tab : Can be a single tab or comma separated list of tabs. Accepts ranges, paths, and titles.
  • template: Accepts a Jinja template that returns true or false.

Also added the ability to use a user’s ID number in the user: condition.

New Template Variables:

  • deviceID : This uses card-tools device ID implementation, but doesn’t require card-tools.
  • isAdmin : Returns true or false if user is an admin
  • isOwner : Returns true or false if user is the owner
  • userID : User’s unique ID number
  • userAgent : Full user agent string
  • viewTitle : Title of the current view
  • viewPath : Path of the current view
  • viewIndex : Index number of the current view
  • url : Full current URL

Fixes:

  • Tabs not hiding while in kiosk mode (fixes swipe-navigation swiping to hidden tabs as well).
  • Respects new app-header theme variables for header text and background.
  • Extra space on bottom of view in kiosk mode causing scrollbar to always be visible.
2 Likes

must be getting daft here, but clicking https://github.com/maykar/custom-header/releases/tag/1.2.2 and the sourcecode zip file button gives me the source in all its glory, but no custom-header.js …

am I missing the obvious here?

manual install.

Hi All, stumbled across this beauty of an addon whilst trying to figure how to use a POS Chinese Tablet as a locked down interface for HA for my Airbnb guests. Kudos to all involved!

I have however noticed a very obvious work around. Despite making the exception run kiosk mode for a specific user/device, and also only allowing access to one specific tab, if the user swipes down and refreshes the page, then the sidebar appears for about 2 or 3 seconds before Custom Header kicks in with its magic. In this time the User is able to tap items in the sidebar such as Map or Logbook. Once he does that, those sections will load and the Airbnb guest can see way more information that I am comfortable with.

Now I know I can just disable Map and Logbook by disabling default_config from my configuration.yaml but I actually like those sections being in the sidebar for me and my partner. Was wondering if there is any other workaround?

Build failed for some reason, its there now.

I don’t think this is something that I can prevent due to the nature of how custom elements are loaded in Lovelace, the amount of custom elements you use, and the speed of the device. I will look into it, but cannot promise anything.

Can you just disable the pull to refresh feature in the browser you are using or use a browser that allows you to disable it?

Oh that is actually pretty nice. Not sure how and when I will implement this new feature in my setup, but I like it. Thanks @mayker

Works like a charm :slight_smile:

Many thanks!

Hello! I’ve just installed Custom Header and all is working well… just an information…
every time i load my HA page for 3/4 seconds i’ve the standard view (without customization)… then the “custom header view” come up… how to solve??? then …someone could help me to find a solution to add some informations (text box) at the login screen? thanks a lot.

Just answered this 4 posts up.

As far as adding something to the login screen, that is off topic for this thread. Custom Header cannot help you with that.

Is it just me, or is this issue not actually fixed?

OK yet again, HACS is not pulling the latest version…

It’s not clear how to find the devicdID?

OK I can get it on desktop chrome and on iOS chrome start chrome://inspect and it will show the id - but what about the iOS app? … looks like web-inspector in safari settings (ios app uses safari)

not just you, looking into it

If you’re using storage mode it’s listed at the bottom of CH settings, if you’re using yaml mode and can’t use the browsers dev tools then you can temporarily add it as text to the header or anything else since it’s a template variable. Otherwise it’s listed in the dev tools console as well.