Trying to get a background loaded

Hmmm… no success. I have a www folder in my config folder. On it an image called dark.jpg. I put this into the Lovelace editor (screenshot because c’n’p is not working on iOS)

Nothing. I tried with "/local/www/dark.jpg" too

Try removing the dash in front of background:

If you want it on all views. PLace it outside all the views:

In the example blow, I placed my file in this dirctory /config/www/images/ with the filename background.jpg. Making a full directory path /config/www/images/background.jpg. When referencing the file inside lovelace.yaml or the GUI lovelace, you will use /local/images/background.jpg.

background: center / cover no-repeat url("/local/images/background.jpg") fixed
views:
  etc..

… a just in case type of suggestion ( I apologize if it seems super obvious but you never know…). Are you refreshing the page after you make the changes? Lovelace seems to get “stuck” until you force a refresh.

Thanks guys. But still no success here.

The dash was put there automatically. I refresh AND restart the server every time.

Here is my config:

title: Home
background: center / cover no-repeat url("/local/images/night.jpg") fixed
views:
  - badges:
      - sensor.windgeschwindigkeit
      - sensor.temperatur
      - sun.sun
    cards:

I put now into the www folder a subfolder named images.

If you look in the HA logs do you see any errors?

Do you have the right permissions set on the image file?

No errors. I need to set permissions? I’m using the configuration tool in hassio to edit my config. What do i need to do?

Please take a screenshot of your config folder, where configuration.yaml is located.

Not sure under HASSIO.

Under HA I originally added a background and got an error message about permissions. Set the permission on the background file to homeassistant and it worked.

That’s not needed for hassio. Don’t have the ability to change permissions anyways in hassio.

I suppose I should ask this too, but are you clearing the cache during your refreshes? CTRL+F5

Come with me on a trip to my folders and files :slight_smile: And yes…cache is cleared.



night.jpeg versus night.jpg :wink:

2 Likes

I go now and slap myself in front of a mirror…THANKS A LOT! :joy:

1 Like

This is why peer reviews are so effective for development as once we make a typo such as this one it’s very hard for the brain to register it’s a problem; for it was the one that created it in the first place :wink:

Nice background, where did you find it?

1 Like

Its from @Martin_Granger s thread. I stumbled over it as I looked how HA could look like :slight_smile:

Wow! I’ve spent literally hours trying to change the background on HA.

The most terrifying thing I’ve discovered so far about HA (and I would love to talk to the programmers about this - also I would like to join the team) is… that when I read code saying to put an image in the /local directory (which doesn’t exist) in the ‘config’ directory (which does exist) - what they actually mean is to put an image in the /www directory (which also doesn’t exist) and you need to create, but you need to address the /www directory as /local??? WTAF??

And we wonder why Home Assistant isn’t mainstream…

6 Likes

Oh gosh… this post just saved me a huge headache! I have been trying to figure out where to put the background image… and it just wasn’t making sense. It is probably noted somewhere but I wasn’t having luck searching. Thanks! Creating a “www” folder and putting in that and calling it local isn’t obvious as far as I can tell. Thanks again!

thank you from the future. i was ready to smash the #$% out of my keyboard. /www/local/image.jpg = /local/local/image.jpg
this needs better documentation

LMAO @ from the future!

I think it is better to say:
File structure: /homeassistant/www/ = web: /local/
Or, the old:
File structure: /config/www/ = web: /local/