How can I add comments to lovelace

Configuration Frontend
1

Hello,

I am looking to add comments to lovelace.

When I try to add comments to lovelace in RAW config editor and save it prompts me that comments will not be saved.

comments
comments1167×391 58.3 KB

Lovelace is yaml, why # not accepted? Is there different method for adding comments to the code for lovelace.

1 Like
2

You can only do that if you use it in yaml mode.

You can do this by adding this line in your configuration.yaml file

lovelace:
  mode: yaml

There is a note to mention though, there are pro’s and con’s for doing this depending on your needs. The way I see it:

Con’s:
Honestly, there is just one major con with this approach.

  • You can no longer read and/or edit your configuration with the RAW UI editor.
  • You can no longer create and/or move cards with the UI editor.
  • You can no longer create views and/or move/remove them with the UI editor

Basically the entire settings menu (at the top right) becomes completely useless. (By using Compact Custom Header you can remove this menu and it’s icon entirely)

Pro’s:
There are in my opinion actually a lot of pro’s by doing this:

  • You can use notepad++ to edit your file (which is in my opinion far superior to the UI editor), you could use any other text editor ofcourse. With editing it will save you a lot of time as you can just mass replace words and leave the editor open while you refresh your page to see the changes.
  • You can use includes like !include x or !secret x which is great if you upload your setup to github. That way you can mask sensitive info.
  • You can comment and comment out lines just the way you expect it to be. (And what your initial question was in the first place).
  • The file is in the same folder as configuration.yaml and is called ui-lovelace.yaml so it is easy to find, easy to copy.
  • With this mode it is even possible to split your configuration in to pieces. Your lovelace configuration would then just refer to those files. (It is just like an !include line), however I haven’t tried it yet (while I really should with over 6000 lines :stuck_out_tongue:)

So it depends on what you want, do you prefer tinkering in the UI (which is admittedly gettin pretty good) or would you prefer the more oldschool way of editing in a text editor.

7 Likes
3

When using the UI managed lovelace mode, no, it’s not truely YAML. Once you make a change and save it, it’s parsed into JSON and stored that way. Only the editor displays it a YAML, It’s all stored and processed as JSON internally. You can see this file in CONFIG/.storage/lovelace.

Everything else @jimz011 already said well, so I’ll leave it at that lol.

2 Likes
4

Good information here, makes left or right decision easier.

I think maybe the front end is good place to start to get feel around for cards.

But now I am starting to look at some of the more advanced layouts people have up on github they are will be using the yaml file so whilst it’s easy to play in the comfort of the sandpit of ‘ready made’.

I guess the reason I was drawn to home assistant in the first place was because I like the freedom of customization so yaml it is!

5

Thank you I had a feeling it was some other code because I remember back about lovelace being better which I think had something to do with performance as well maybe, but the fact it was displaying in YAML confused me.

And I did wonder where lovelace was in the file directory too, so another box ticked :grinning:

6

Thanks, this is really some good information.

A small addition for anybody who has already created customized views with the UI raw editor and who intends to use the YAML mode.

Make sure you copy the data from the UI raw editor before entering these lines in the configuration.yaml file:

lovelace:
   mode: yaml

When you restart, your custom views are reset and the UI editor is back to automatic mode. Also the file ui-lovelace.yaml is not automatically created.
Once you have created it, you can easily paste the data you have copied from the UI raw editor.

4 Likes