I am stuck trying to set a background-image for the header on my website. Nothing loads.
My hosting has disabled linking images via an external URL, so I've put the image on Filezilla, that also doesn't work.
I have copied the image path from the FTP and pasted that in my html file which didn't work. I have also tried to copy code I found in tutorials, didn't work.
Whether it's the code or the FTP, I can't figure it out.
Let's say you make a map in your FTP account, we name this map Test for now.
You open the map Test and you upload a file index.html. You also upload an image in the map Test. So you have a map named Test, in the map 2 files, one index.html and image.jpg.
When you want to use this image in your index.html file you just write the simple code <img src="image.jpg"/>. This should upload the image. You visit by the link: www.yourhosting/ftpname/Test/index.html
EDIT:
NOTE: You should work online, not on your local host. As I can see youre already doing this by uploading on FileZilla.
Related
Good Morning Everyone, So basically I have Brackets And File Zila, And I'm currently working on my final project however whenever I do the live preview in Brackets to check to make sure everything shows up and works correctly the url shows up as "http://127.0.0.1:61913/index.html" and my .html are all uploaded to file zilla and I'm connected to the server so I don't what's wrong I have tried to unconnect to the server and reconnect, I made sure that all the .html files in file zila match the same ones I have in Brackets and my wwwroot folder, and that I have the same images and favicon image as I do in Brackets as well. So if someone could please help me with this that would be great!
Live preview and your uploading your files to your own unique website are 2 very different things.
The live preview address is just your own IP (be careful showing this publicly, as it can be abused)
Live preview: preview of whatever file you are working on, only visible by you
Uploaded files through filezilla to your own website: public on your website, can be accessed by anyone
Keep in mind whatever changes you make in brackets that are shown in live preview are not visible on your website until you upload them through filezilla.
I'm having trouble getting an image loading on my website.
When I had the "images"-folder in the same folder as my html this code managed to load the image successfully.
<img src="/images/progressive.jpg" width="400" />
However, I want to put the "images"-folder up one directory. So I move the folder and change the path to:
<img src="../images/progressive.jpg" width="400" />
but it fails to load, any idea why that is?
My vs code extension is "autofilling" the path so it recognize the file, which should mean that the path is correct.
I just found the issue. I'm using the VS code extension "Live server" which seemingly can't find files up one directory. When I open the .html file from the file explorer instead of using the "Live server" the images load successfully.
Location of image defined as /images/progressive.jpg for current page location https://website.com/path/subpath/page.html will use full image address as https://website.com/images/progressive.jpg
But, for location of image defined as ../images/progressive.jpg and the same page location (https://website.com/path/subpath/page.html) you will receive image address https://website.com/path/images/progressive.jpg
Maybe this is a problem?
I am trying to load an image locally onto my html. I first tried serving an image path through a /images/ folder, but that did not work. I then tried serving images with the whole path to the image like <img src="/Users/code/src/code/go/src/websites/website/website-Bucket.png" alt="test"> but I still had no luck. I checked my html and it has no errors. I have restarted my PC, changed the image to .jpg, and it still did not want to work. I get an error in Safari - An error occurred while trying to load the resource and the image shows as a blue box and question mark. What things would you try to troubleshoot?
Extra - I am using goLang to serve the files. I have it so a http.handleFunc() goes off and serves the images folder when it is requested. The path is showing http://localhost/images/theImage.png "the correct path" but nothing happens. So, I save the image and it shows it as a html and shows a section of the page?? Would that be a path thing?
In first instance you have to understand the path source, when you are on a HTML file, your path inside the file should be :
<img src="images/website-Bucket.png" alt="test">
that's because :
the path of your .html file can access trough files the inside path with the "/folder/file" structure route in the html file, so your structure files should be:
yourfiel.html (your file render on browser) /imagesfolder
-website-Bucket.png" (you call it on your html as
/imagesfolder/website/Bucket.png)./
you can learn more about paths here :
http://www.coffeecup.com/help/articles/absolute-vs-relative-pathslinks/
Looks like it may be a file path issue.
Take a look at this page it has a good example.
https://www.w3schools.com/html/html_filepaths.asp
Also try renaming the image with a _ and not use the -.
Open Console in any browser and see if you see any errors that mention not being able to find the source path of the picture.
It should give you a hint of where your browser is trying to find that img.
All of your guy's responses were correct. I had the correct path. It was a Golang thing. I did not make a handlefunc when the server wants the /image.png. It was never serving the image, it just was doing nothing with it. Thank you for the responses.
After i hosted my HTML5 application on Apache tomcat.My page is not showing any background image.
I have placed my project folder (MyExpert) inside root folder and inside MyExpert folder there is an image folder and a css folder .I am giving background image as
background-image:url(../images/myprofile_on.png)
in my css file but images are not coming on my pages except home page.Though application is working fine on localhost.I tried various thing but no fruitful result.
it looks like it will be a simple referencing or permissions issue here, try nivgating directly to the image in your browser and see if you can navigate to it manually so is this case given your description it would be:
http://www.yourdomain.com/MyExpert/images/myprofile_on.png
If that works then its a simple referencing issue from you css file, if it returns a forbidden access page you know its permissions, if it returns a file not found I would recommend checking the casing on your CSS url to ensure it matches the file path as if your box is linux then file paths are most likely case sensitive.
I have a file uploader but it's not showing the files path (so you can only upload files that are in the same folder)
How can I make it so show's the files path (desktop/something/yes/dog.swf)
It's getting more common that browsers doesn't reveal the local path where the uploaded file was selected, and this is for most purposes a good thing. If you upload a file to a site you probably don't want any excess information to be sent along, like for example your local user name.
For you as an application developer it should not make any difference. You shouldn't rely on the local path of the file for anything. If you use the local path on the server side also, you open up a horribly wide security hole. Anyone could for example upload a file with the path "c:\windows\explorer.exe", and if you save the file there you are in trouble...
If I'm reading this right, that's a client side browser issue, and not something you can set in your code.
It's also browser-specific, so we would have to know the browser version to tell how to do it on YOUR browser, and that would do nothing for other people accessing the web site via their browser.
If you want to ask how to set it on your browser, I would recommend that you ask that on the Super-User site. (See the links at the bottom of this page.)
Did you try to upload a file from another folder? I've noticed that no path is shown but it still works just fine.