I am uploading my website using Filezilla, and some images are not appearing. I have checked that the file names are all lower case and that the file type is set to auto instead of ASCII. I have cleared the cache too and I am still not seeing the same images not appearing.
I have got a 403 and 404 error on these images in the console, please see screenshot image for this.error image
All images work fine when testing locally on my computer but some random images are not appearing. Anyone any ideas why this could be?
Thanks!
image not appearing
Could you maybe provide some code with examples?
It could e.g be that the path on the server is different. If you use absolute paths it may work on your host where the homepage is under /. But if it is under /user/ or something similar (so not in the root), the paths can be broken and images will not appear. So check if you provide the paths differently for the pictures that work as opposed to the ones which fail.
Related
Help!
I made a website with downloaded images inside the directory, in an img folder. I am certain that the images are pointed right, because when I work locally, it displays just fine. All I did when uploading to the server was copy and paste the entire project folder over, and I know that none of the files got jumbled up, I inspected and checked. Now when I go on the server, many of the images won't display. I am certain they're pointed right! Locally they work fine.
I'm stumped, even other images on other pages of the site work fine, and they use the same method of the src coming from a saved image from a filepath...
I'm using cyberduck if that helps, I don't know what to do and the project is due tomorrow.
Checking the console gives me 404
"Failed to load resource: the server responded with a status of 404 (Not Found)
http://sites.westmec-coding.org/~eciudad/ProjectPortfolio/startbootstrap-stylish-portfolio-gh-pages/img/StPatricksDay.png Failed to load resource: the server responded with a status of 404 (Not Found)"
But I literally see the image folder in there with it on the cyberduck GUI
I solved the problem.
Somehow, all the .png's became capitalized to PNG when moved to the server.
I went back in and renamed it to lower case png, capitalization can effect things drastically. The console works miracles.
I have an iOS app that contains a UIWebView, which display a webpage. Sometimes the page displays a different image than the one associated with the src link.
A user sent me a screenshot where it was clear that one of the icon images had been replaced with a completely different image. The same wrong image was displayed in each of the instances where this icon was supposed to be displayed. Refreshing did not solve the issue, but closing and opening the app did. (Or maybe she actually deleted and reinstalled the app.)
The html for the icon is just an img:
<img src = "/the_icon_source">
The img src is hardcoded directly into the HTML file. I therefore don't see that the HTML itself could have been wrong or said anything besides "/the_icon_source".
So how can the wrong image be associated with an image src? Could the server be sending the wrong image when it's asked for "/the_icon_source"? Could the iOS app be caching incorrectly, mixing up images? How to test and fix?
I myself cannot reproduce this issue. I'm not sure how often it occurs, but several users have mentioned it, also for other images on the page. They have only mentioned it occurring in the app, not on the website. This may just be because the app is used more than the website.
My host is Webfaction and the images are served using WebFaction server’s static-only front-end nginx process. The app displays the website in a UIWebView. (Webfaction suppprt merely told me that they served the right images.)
Is the problem not that you have it like this:
img src = "/the_icon_source"
rather than like this:
img src = ".the_icon_source"
If this is sat on a linux server the / will be pointing to the root directory whereas the . or simply the_icon_source would simply point to the directory in which the website is sat which i assume is where the image is also located.
The problem was appeared when I migrate my site from WindowsServer2003 to CentOS.
There is a image field in the Node type.In the old server everything goes well,but in the CentOS the nodes' image field do not show the picture. It just show the image name as a link and click the image name I can see the picture in a new browser tab.
I know that the images have been upload in the sites/default/files. And also the permission for the directory is 777.
I google a lot but get no results.
so what cause the problem? any suggestions are appreciated.
Windows and Unix-based systems use different pathing syntax, so the paths for your images may not work now, under CentOS. Use a text editor's find-and-replace feature to change the paths in the database by exporting the database to a SQL file, running the find-and-replace, and then importing the file. Make sure to keep backups of everything.
I need to upload images into a page in my website.
I usually use WinSCP FTP program because it gives me the option "Copy to Clipboard (Include paths)". I copy images' URL through this option and the images are usually uploading and displaying successfully to the website.
I'm trying to do the same now for a new page but that is not working. Using any option in WinSCP is not helping at all. All I get is a small icon instead of the image. But when I use FileZilla for copying the URL, the images are uploading and displaying successfully. BUT the problem is that the page is requesting the username and the password to display the images.
I've been googling about it and I realise that the problem could be that I need to change the FTP URL to HTTP. I tried to do it this way:
ftp://username#domain.org/domain_restore/pics/anton.jpg
to:
http://username.domain.org/anton.jpg
That is probably totally wrong? I tried some other ways but the problem is I'm only a beginner and I don't have the knowledge how to edit it or how to find out what the problem is.
I followed the instructions of someone from the support of my host and they advised me to do a restore to all my directories in the FTP manager. I did that but I feel like I messed it up because now all the folders and the directories are duplicated. Could that also be the problem?
I'm trying to see what a certain webpage would look like if I replaced a certain image with another. Rather than upload the image, edit the site, etc, each time I tweak it, I'd like to know if there's a way to change the image in the page to my local version while viewing the remote page.
I use Firebug for debugging web development usually, but I'm open to any other tool that might do this.
(It is absolutely impossible to search for this and find anything but questions about dynamic image swapping on a deployed website, so sorry if this is a duplicate.)
Added: I just tried substituting a file:/// URI pointing to the image (copied and pasted from the address bar after manually opening the image), and alas, it did not work — the image fails to change.
It seems to only work with the http[s] protocols (likely for security reasons). You can store your images on service like Dropbox, share the image or folder, then use the public URLs.
Really, you can use any web accessible images, so a local server would work too.
If your image is in a localhost server(not as file mind you) i think you can still put that localhost url in the firebug inspect element and it'll work.
Tried an absolute file path but it doesn't work apparently. So I guess you just have to make do with a localhost server image. That works for me
Quick and Lowtech Answer: Take a screen shot of the page open it in photoshop and drop the local image on a layer above the webpage image.
Hi if you are serving from a webserver, u probably can't point it to a file on ur local drive. Even if its localhost, u can't point to a local file c:/test.jpg for example. Its because the browser sorts of sandbox ur page so that scripts can't access local files.
One way is to upload the new file (new_file.jpg) to the webserver, give the image link an id
<img id="something1" src="test.jpg"/>
Using jQuery in the firebug watch window do
$("#something1").attr("src","new_file.jpg");
You should see the image change. If you are not using jQuery, you can use document.getElementById("something1") and get the element to modify.
Another way is to use http://makiapp.com/
You can overlay an image from you computer onto any website you look at with this. Very cool tool for lining up a comp with your code.
You can:
Drag your test image into Google Drive
Open it in a browser
Go to the actual image path
Use this path as a substitute in Firebug
It's almost as fast as working from a local drive.