Simple change of Background Color to Background Image...

JMartin

JMartin

Getting the hang of it
Mar 2, 2016
143
21
California
So what I want to do is simply replace the solid colored background of the login.htm file in the "WWW" folder to reflect a picture instead.

I'm no HTML or CSS expert, but I know my way around notepad, and can insert a tag in the right place.

I've used the "background" tag, the "background image" tag, and when I open the login.htm file in my browser directly (chrome) it works.
But if I try to access the login screen through the server (using the IP address), or if I try to access that screen remotely (say... from work), all I get is the solid color again.
I can change the color, and that works, but for the life of me, I cannot get an image to be used as the background.

What am I missing here?
Anyone have any thoughts or suggestions?
 
Last edited by a moderator:
nayr,
Thanx, but I've tried every possible path... Absolute, Relative, "%20" for spaces, forward-slash, back-slash, I've even gone so far as to place copies (thinking it was a simple path problem) of the "home.jpg" background image in every conceivable location.

It's not that the login.htm file can't find it... if I open the file locally with File://blah blah it works fine... it's that the BI web server won't serve it.

This one has got me stumped.
 
put it on another server then and give it full path.. put it on like imageur
 
Ugh. Thanx that worked.

Which of course begs the question... Why?

It's my image, it's in my BI www folder, permissions are granted (Win-10), but why won't the Blue Iris Web Server, serve it?
Problem solved... just not happy with the solution.
 
the bi web server is ment for BI, I suspect its not designed to host custom files.. only its own.
 
Yet we have a huge thread entitled, "I made a better remote-live-view web page" which includes dozens of upgraded pages and scripts...

I just thought inserting a simple .jpg file as the background of a default web page would be a simple task.
Oh well.
 
JMartin said:
Yet we have a huge thread entitled, "I made a better remote-live-view web page" which includes dozens of upgraded pages and scripts...

I just thought inserting a simple .jpg file as the background of a default web page would be a simple task.
Oh well.
Click to expand...

Sorry, I didn't see this thread. What you ask is easy for any page except login.htm. Blue Iris won't send any file except login.htm until you have logged in, which is probably why it has been failing.

Here is what you can do. Go to http://websemantics.co.uk/online_tools/image_to_data_uri_convertor/

Upload the image you want to use as a background. They will convert it to something called a "Data URI" which lets you embed an image as text so it will appear on the login page without having to be hosted elsewhere.

Now open the login.htm page and find the <body> element. Add a style attribute like this:

HTML: 
<body style="">

Now in that web page where you created the Data URI, scroll to the section "As a CSS background image". Copy the entire line that starts with "background-image:" and paste it inside the quotation marks in your body element.

Of course this will come out as a tiled image so you may want to include other CSS rules, like "background-repeat: no-repeat;"

Separate all style rules with a semicolon. You can find more related rules here: http://www.w3schools.com/cssref/css3_pr_background.asp
 
Last edited:
  • Like
Reactions: fenderman
It is working now with nayr's workaround, but I really like your idea... I'll give it a try.
Thanx,

Jim
 
You must log in or register to reply here.
Top Bottom