Cards, Views, Groups, and UI Confusions

All, I’m trying to figure out how all of these fit together. I’ve been staring at my configuration for 45 minutes and haven’t a clue how to proceed… I’m very confused on how these do, or should, fit together to build a UI.

Right now, I have this with makes two tabs, a default_view and a services view:

    name: Home
    view: yes
      - group.bedroom
      - group.downstairs
      - group.garage
      - group.laundrymorning
      - group.livingroom
      - group.masterbath
      - group.outside
      - group.rachel
      - group.sam

    name: Services
    view: yes
      - weather.home
      - group.emby
      - group.haclient
      - group.dont
      - group.unused
      - group.sensorscustom

This works. But, I’d like to start building some more robust (cards?) to put in there.

So, I start looking at the examples here for the Entities Card:

Okay, this is what I want… thing is… where does it “go”? My configuration.yaml? customize.yaml? groups.yaml?

Once I build it, where to do I add it and what is it called? Do I add it to my default_view?

Should I abandon the concept of groups and just go with entities since they seem to be doing what I’m accomplishing with groups?

Do you use the default Lovelace UI or the older (deprecated) States UI?

Lovelace doesn’t use any views configured in the configuration.yaml (or its !includes) anymore.

All lovelace configuration is either done thru the GUI editor in the lovelace frontend or if you use yaml mode it’s all done in the ui-lovelace.yaml file.

to help we need to know which method of frontend you are using.

Well, I installed about 3 weeks ago. I didn’t explicitly choose one or the other, but it sounds like the deprecated UI is still the default?

If so, what’s the best way to go with the modern UI without losing most of my configuration that I spent 3 weeks building because I didn’t know any better?

Lovelace should have been the default when you installed it.

Does your URL to HA have /lovelace/ in in it?

and you can go the info tab in the developers-tools and if you see the following you are on lovelace:


if you see “set lovelace as default…” then you are on the states UI as default somehow.

But have you been defining “views” in your groups.yaml file and the seeing changes in your frontend?

Ah, okay… so yes, I do see lovelace and confirmed it in the developer-tools info. Yes, I have been using groups to define views because those are the instructions I found.

I did just find the “Take Control of your UI” option and enabled it, so I can move cards around.

Hopefully I’m on the right track with your help. Assuming I am, would my groups.yaml be defunct since I assume it’s now handed with with UI?

only the parts of your groups.yaml that you used to define views is useless. Everything else in there is still valid and is useful. You can still use groups for lots of other things.

Cool. I get that you do views in the UI now, but where is that configuration stored? I’m using Docker and have /config defined. I don’t see a yaml for them, but I may assume they are part of the database now?

I use yaml mode myself so all of my lovelace config are in yaml files in my config directory.

I believe the GUI editor stores files somewhere in the /.storage folder in your config directory.

But you can see what is in that file and edit it using the RAW editor in the top right menu (where you found “take control of UI”). I think it’s buried in one more level of menu selection in there.

I like yaml mode because it gives me the ability to split my config into manageable pieces by using !includes (UI mode can’t do that) and I can use comments. That allows me to experiment by creating different configs so if I don’t like it I can do testing by just commenting things out without completely losing that whole configuration. Then if I decide I want it back I just uncomment it and Voila there it is again. GUI editor doesn’t allow comments in the file at all.

And I like to have more control over my config.

And lastly I just generally dislike the end results of the files formatted by HA GUI editors.

What’s a large violin got to do with it ? :rofl:

Yep I do ui-lovelace.yaml, so yaml mode too
It’s a bit like html but more properly just ordered lists

I use it because

  1. Apparently it’s slightly less processor intensive
  2. But mainly because you can change stuff around easily without restarting

My interface still looks like the old states ui as I’m more concerned about how it works than how it looks


…I mean…what are you talking about? I obviously wrote “voila”. You must have looked wrong. Look again…:wink:

As long as you aren’t adding resources that the system would have to incorporate before they are available to lovelace then no restart is required for the GUI config or yaml mode. Just hit the “refresh” button in the menu and changes take effect immediately.

As a matter of fact I’ve heard that one of the GUI mode advantages is that changes made there don’t even need the “refresh” button to be hit. The changes take effect instantly when you save the changes in the UI editor.

This is pretty much my feelings exactly.

then it sounds like yaml mode is for you.

just put this in your configuration.yaml:

  mode: yaml

then all of your configuration for lovelace will go into the ui-lovelace.yaml file in your config folder.

unless, of course, if you use !include directives in that file (and why wouldn’t you? :wink:). Then those bits will be stored in whatever file you tell them to be stored.

I have a directory for my lovelace stuff called “lovelace_views” and all of my different “lovelace_yyy_view” files go in there.

OH, btw, before you do that it would be best to enter the raw editor mode in the GUI editor and copy all of the stuff in that window and then paste it into your ui-lovelace.yaml file so you don’t lose anything you have right now. Otherwise you will end up with a blank frontend when you switch to yaml mode.

And back up before and when you’ve done some work