I have created a dashboard using the original dashboard tools and included backgrounds in some of my tiles. When I'm on the same LAN as my Hubitats the backgrounds which are stored on the Hubitat show up perfectly. When I am remote to my LAN the backgrounds disappear. I searched the forums and saw numerous discussions of the issue but no clear solution. I tried linking them to a google drive but that caused backgrounds to disappear both on and off my LAN.
One question is, do any of the subscriptions Hubitat offers help with this issue?
Another question is, is there any other way to make backgrounds work local and remote?
You can use Github to store your image files, and then use the Github URL for the image to pull it in. That is where I store all my icon svg files for custom tile icons, so they work both a home and remote. I also store some backgrounds there.
Google Drive does not work, I tried that method before I started using Github.
I'm new to GitHub. I have an account and uploaded one of my image files and marked it public. I copied the link on GitHub and pasted it into my dashboard tile but the image doesn't come up. Is there something else I need to do?
That's right, I did remember seeing that in the 2.4.3.122 release notes from Sept 22nd:
"Modified legacy dashboards to transparently load dashboard and tile background image files in /local folder from the cloud. File size limit of ~100k applies."
I haven't tried it, since I've been using Github, and it isn't worth changing things over now.
Yeah, most of my stuff in Github are svg tile images. Looks like the hub update only looks at the background fields on the tiles, so it doesn't help for image paths in CSS? I also use image tiles for background images, with a negative z-index, so I can size them how I want to, and I don't think they added image tiles to use a local image path either, so that update doesn't help me at all, thinking about it now.
I was able to load an tile background image that was stored on the hub while accessing the dashboard through the cloud. I didn't try loading an image in the custom css so am not sure if that works or if the svg files would work. I had to look up what a svg file was and it sounds interesting.
Nice thing about svg is they are very small vector files. I get most of mine from here and I use the Windows store app Inkscape or Gimp to modify them.
This is my goto css for adding an image to most tiles. You can use the local hub image address or an internet address. You can use .tile-primary.on, .tile.primary.off, .tile.primary.open... etc for icon images that change with states.
Summary
/* Add a Gitgub internet svg image to a tile */
#tile-16 .tile-primary i.material-icons:before{
content: "";
background-image:url("https://...");
background-size: 100% 100%;
display: inline-block;
height: 50px;
width:50px;
/*if you want to change the position*/
position:relative;
top:0px;
left: 0px;
}
Quick look and these are interesting. I already have ideas floating around in the old noggin. I will probably have to go back and redo some of the dashboards that I've just redone. LOL Thanks for this info. I'm copying the code into my CSS notebook now.
I have referenced it at times. I will first ask Gemini and if that does not yield the results that I am needing, I will search the forum for the answer. I have actually been quite successful with Gemini. My needs have been fairly simple. Layering tiles. Setting translucence and color and then adjusting icons and changing the default names. I can see using the svg images for backgrounds for tile blocks on my dashboards instead of making them different colors. Since the dashboards are sharing similar code I will open a completed dashboard and the new one in separate tabs and then just copy and past what I need. II have a template dashboard with my menus that I start with by copying the json to the new dashboard when I start.
