Anyway to Hide developer tool section? in the HA frontend

nope … people ignored me :frowning2:

1 Like

I do not think it is possible.

Thanks @Danielhiversen

Why would you need or want to hide it anyway? In other words: what is the use case?

Ok I don’t really want to hide the dev tools. I feel that you shouldn’t be able to stop hass from the front end though.

To me, it would make more sense to make such limitations part of having multiple user accounts, e.g. only give admins access to the developer tools.

1 Like

Bigger picture that is what needs to happen.

Would be useful to hide sections in the menu especially if you have a guest suite with a wall mounted dashboard and don’t want them anywhere near dev tools. Integrating that into a multiple account approach would be a nice feature as fanaticDavid mentioned.

hi this is what am requesting from HA people

Evidently, Paulus helped Ben do it in this blog…

I have also just deleted the panels so there is nothing there when you click on them.

You have to do it every time you update though.

@PtP hi will appreciate if you could tell how it was done i do not want every one to have control over the sidebar which has a STOP home assistant button

Thanks in advance

I think it would be great if developer section is hidden in kiosk mode

@Gagan_Kochar In my instance of HA they are located here.

/usr/local/lib/python3.5/dist-packages/homeassistant/components/frontend/www_static/panels

I simply delete the .html and .html.gz file of all the dev tools.

Once again this is a horrible way to resolve this and has to be redone after every update of HA.

It also makes it really difficult to do work on your system if the need should arise.

Hopefully there will be an option to hide dev tools soon.

1 Like

Hello,

i insert in the configuration yaml

frontend:
  extra_html_url:  
    -/local/xxx.html

put into config/www the file

xxx.html

<style>
app-toolbar{
  visibility: hidden !important;
  height:0px !important;
}
</style>
2 Likes

hey man, I’ve try the code, seems like the dev tools tab still visible, do I need to make some extra settings to get it work? Please help, thanks!

@daywalker815 it didn’t work for me either.

@PtP and @kevinshane did you ever get it working? I think I have a more robust option (maybe tested it manually with the chrome dev tools console but cant get it to load automatically)

Got it to work (kind of hacky but can be toggled from chrome dev tools (yea exposing the variable isn’t the best but it works))

put:

frontend:
  extra_html_url:
    - /local/hide_toolbar.html

In your configuration.yaml then paste the following code in <config directory>/www/hide_toolbar.html

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<script>

  function hide_toolbar() {
    var elem = document.querySelector('home-assistant');
    var shadow_1 = elem.shadowRoot.querySelector("home-assistant-main");
    var shadow_2 = shadow_1.shadowRoot.querySelector("app-drawer-layout");
    var shadow_3 = shadow_2.querySelector("iron-pages");
    var shadow_4 = shadow_3.querySelector("partial-cards");
    var shadow_5 = shadow_4.shadowRoot.querySelector("ha-app-layout");
    var shadow_6 = shadow_5.querySelector("app-header");
    var shadow_7 = shadow_6.querySelector("app-toolbar");
    var shadow_8 = shadow_7.querySelector("ha-menu-button");
    shadow_8.style.display = 'none';
    // run $.exposed.shadow_8.style.display = 'block' to enable it again
    $.exposed = {
      shadow_8: shadow_8
    }
  }
  if (window.addEventListener)
    window.addEventListener("load", hide_toolbar, false);
  else if (window.attachEvent)
    window.attachEvent("onload", hide_toolbar);
  else window.onload = hide_toolbar;
</script>

Restart HA and might need to do a shift+F5 to get chrome to clear the cache

edit: formatting

2 Likes

Nice, thanks for sharing, unfortunately I can find the perfect solution yet, but currently I have “sort of” hiding the hass main page completely(xxx:8123 page and disable frontend) instead I use TileBoard as frontend browsing and controlling stuff(nginx etc to hide the 8123 page) ^^