How to add Lovelace Resource?

I found a custom lovelace panel I want to use and after placing the .js file in /www/ like it told me to it told me to add a path to the .js file to the lovelace resource area.

Looking around on the forum most the stuff I’ve found reference this is 2 years old telling me to add a “lovelace” section to the config file and telling it that lovelace will me in yaml mode. But then I also found people saying DON’T do that because it was going to be depreciated.

I found a “lovelace_resources” file in .storage but I doubt I’m supposed to go manually editing this one? What’s the right way to do this? I’m using a docker container to run my Home Assistant instance.

It’s pretty well hidden…it took me a while to find it myself (I don’t use the UI I use yaml mode…)

go to settings on the left sidebar → dashboards → top right three dot menu → resources → bottom right add resource


I don’t have the three dot menu on the dashboard area.

Acorrding to the about area under settings I’m running Home Assistant 2022.7.3 with Frontend 20220707.0 - latest

Ugh, I found it, I had to click on my profile name in the bottom of the left hand side menu then scroll down until I found “Adavnaced Mode” once I did that I was able to go into add resources.

That kind of obfuscation is extremely unhelpful when the steps for adding resources are not well documented :man_facepalming:


Your card may not be available vis hacs, but if it is, hacs does it all for you.

Yeah, I like HACS a lot, but this card isn’t on it

Try to add it in HACS as a custom repository:
→ HACS → frontend → “…” menu → add a custom repo → specify a link to a repo, select “Lovelace” → then try to find your plugin → add it.

1 Like