The reason behind the website not working in Safari and Custom Header having iOS issues are not linked. I will say that it doesn’t matter if you’re using chrome or safari on an iDevice, they’re both using iOS’s webview. In either case iOS devices are a pain to support.
Still won’t stop me from trying though…
Thanks for the info. You, sir, are totally awesome. Many, many thanks for all your hard work and for the awesome things you have created. I will live in hope for iOS issue resolution… 
@mayker It seems this custom_header performs a lot better than your old one. However I have one big question.
The view_css: doesn’t seem to work when the header is hidden 
Whatever I try, nothing seems to be happening when I have the header hidden. The reason I ask this is because this was working fine in CCH and my current setup relies on it XD (I would have to find something else if it is no longer possible )
What is going on is that the margins on the view_css do nothing when the header is hidden (whereas in CCH the entire view would just move up or down depending on the settings)
hide_header: true
view_css: 'margin-top: -5px;'
default_tab: 1
This used to work perfectly fine with CCH, but with CH it doesn’t move the viewport up.
Screenshot 1: How it looked like with CCH (note that the ‘header’ is actually an entities card with margins so that it looks like it is a single header)
Screenshot 2: How it looks with Custom Header, there is always a gap between the header and the first card. I have tried numerous entries with padding, margins and even tried changing the margins on the actual card, but the card would just be cut off.
As you can see, there is a gap between the header and the first card. Which previously could be alleviated by using my above code.
When I set header to true, it works but only the other way around, I can only move the first card down instead of up, when setting a minus margin it will do a plus margin instead).
For now I will have to do with it, but I hope you can (and ofc if you will and if it is even possible with the new component) address this.
Thanks
Dog device tracker?
Yes it is a Tile. Nothing fancy but does the job for knowing if the dog is home or not. I use it to automate the alarm so it decides which sensors will trigger the alarm depending on if the dog is home or not.
first impression: stable. very stable! not that I had complaints before, but it ‘feels’ very native…
3 ‘small’ questions:
are there no more options to hide/show notification? can’t find those in the config options? https://maykar.github.io/custom-header/#configuration/main and I used that in the exceptions conditions.
I’d like to keep the main header text, as set in my configuration. It seems there is no option to disable the header_text setting in custom header? only this, which by default replaces the main header:
header_text string 'Home Assistant' Replace the main header text, more info below
Secondly, I must be doing something wrong because my tab templates don’t show, this is my config (and all template are fine perse)
tab_icons:
alarm: >
{{states('sensor.alarm_panel_icon')}}
phones_tablets: >
{{states('sensor.presence_icon')}}
weer_klimaat: >
{{states('sensor.weather_icon')}}
alarmclock: >
{{'mdi:alarm-off' if is_state('sensor.next_alarm','Not set') else 'mdi:alarm'}}
tabs_color:
phones_tablets: >
{{state_attr('sensor.family_home','icon_color')}}
please have a look what I should do?
quick reply to the template question:
we can’t use multiline notation (yet), this works:
tab_icons:
alarm: "{{states('sensor.alarm_panel_icon')}}"
phones_tablets: "{{states('sensor.presence_icon')}}"
weer_klimaat: "{{states('sensor.weather_icon')}}"
alarmclock: "{{'mdi:alarm-off' if is_state('sensor.next_alarm','Not set') else 'mdi:alarm'}}"
tabs_color:
phones_tablets: "{{state_attr('sensor.family_home','icon_color')}}"
@mayker, do you need a feature request for the multiline notation jinja, or is this in the works?
ya, talked about that before 
I was referring to the templates for tab_color and tab_icon where this doesn’t work:
tab_icons:
alarm: >
{{states('sensor.alarm_panel_icon')}}
phones_tablets: >
{{states('sensor.presence_icon')}}
weer_klimaat: >
{{states('sensor.weather_icon')}}
alarmclock: >
{{'mdi:alarm-off' if is_state('sensor.next_alarm','Not set') else 'mdi:alarm'}}
and this does:
tab_icons:
alarm: "{{states('sensor.alarm_panel_icon')}}"
phones_tablets: "{{states('sensor.presence_icon')}}"
weer_klimaat: "{{states('sensor.weather_icon')}}"
alarmclock: "{{'mdi:alarm-off' if is_state('sensor.next_alarm','Not set') else 'mdi:alarm'}}"
Your issue is probably using > and not >- (which strips white space)
trying this,(took out the icon first) there’s a strange ‘n’ at the end when I use:
button_text:
options: >
{{ hours12 }}:{{ minutesLZ }} {{ AMPM }} - {{state_attr('weather.home_darksky','temperature') }}°
not sure if this is related, but inspector says:
note inspector surprisingly still sees compact-custom-header… Ive of course taken that out of the ui-lovelace.yaml, and restarted a few times, clearing caches…
title: Hassio RPi4
resources: !include lovelace/resources.yaml
button_card_templates: !include lovelace/includes/button_card_templates.yaml
decluttering_templates: !include_dir_named lovelace/decluttering_templates
#cch: !include lovelace/includes/compact_custom_header.yaml
custom_header: !include lovelace/includes/custom_header.yaml
views:
- !include lovelace/views/view_Home.yaml #0
- !include lovelace/views/view_Lights.yaml #1
secondly, when trying to replace your icon template with this:
button_text:
options: >
{{ hours12 }}:{{ minutesLZ }} {{ AMPM }} - <ha-icon icon={{states('sensor.weather_icon')}></ha-icon>
{{state_attr('weather.home_darksky','temperature') }}°
the whole text disappears, and the full header shows, even though I use compact_mode, with the config name:
and, a footer appears also:
apparently the icon_template for the button-text is not correctly formatted? Even so, putting of the rest of the config would be considered a bug?
with this in the log:
2019-12-17 12:07:14 ERROR (MainThread) [frontend.js.latest.201912041] https://redacted/local/lovelace/resources/custom-header.js?v=0.0.1:4774:21 TypeError: undefined is not an object (evaluating 'config.compact_mode')
Could you help me formatting the icon_template?]thanks
yes! that’s it. How odd. there are no white spaces in the output of the templates, and all other places in HA I use these work with those exact templates.
I’ve also found the issue in the weather icon… missed a closing } sorry for that.
still, have the suffixed ‘n’. What could that be?
n is probably from a stray new line (\n) somewhere
no, I’ve found it. It was not using the >- multiline but >
in this spot in the CH config the template did work without the >-, albeit suffixing the n.
Would really be nice if we could simply use > multiline notation in all places, without breaking the config, or unwanted newline acting up. No harm done, just noted for further development and ironing out some intricacies
thanks for your nudge, combining that with the whitespace remark made me find it.
Is there any way to disable Custom Header for laptop/desktop and have an option to change custom header settings? I’ve added media query exception but when I turn on disabled mode for this exception, I lose option to change CH settings.
Is it possible to hide/show a view on the fly with Custom Header, as it was with Compact Custom Header? With CCH, I had this code::
cch:
conditional_styles:
- entity: input_boolean.mode_christmas
condition:
state: 'off'
tab:
10:
hide: true
Based on the documentation, where I found that the configuration for hiding/showing views has changed, this no longer seems possible.
@fanaticDavid Conditional things are all handled by jinja now
custom_header:
hide_tabs: '{% if states.input_boolean.mode_christmas.state == "on" %}10{% endif %}'
yes! this is what I had been looking for, and never realized had already been possible with CCH…
show_tabs: >
{% if is_state('input_select.mode','Developer') %}22,23,24,25
{% endif %}
magic!
(btw note no >- is necessary )
since @petro always tells me I need to make safe templates… how can I create an {% else %} clause here? maybe use ‘all’ or 0-28 ?