I have a small five page website and have the images used across the website in the same folder, img. The website works fine offline and I upload everything with the same structure, however when I view the website on the server, certain images don't display for some reason.
For example, my logo and image slider photo's appear, but then images in the gallery are broken. They're all linked correctly, eg:
<img src="img/logo.png">
They're all name appropriately too, such as slider_1.png etc.
I'm not sure why some display fine whilst others don't, despite them all being in the same folder and being linked the same way in HTML.
Ok, the images are now working but for some reason the CSS isn't working correctly on my own server space, but works on my schools. I haven't played with any of the server settings etc.
Had the same problem and after reading half of Google saw that the new version of FileZilla changed the image extensions from .jpg to .JPG when uploaded to the we- problem solved.
You can change the code like this:
<img src="yourdomain.com/img/logo.png"=
Related
I created a website using HTML and CSS and there are a lot of images on the website. However, for some reason about 20 of the images don't load in on Apple devices. On desktop and my android phone all images load fine but on my iPad and an iPhone I tested it out on they don't load, only an alt tag is displayed. Can anyone help me fix this? I have had a look to see what is common about all of the pictures that load and I can't seem to find any similarities. They are all around the same file size, even the ones that load being bigger on some a lot of occasions. The URL is https://www.fredsfashionboutique.com/ if you would like to have a look for yourself. On the home page they all seem to load fine but in the clothing section they don't.
TIA,
Freddie
Its to do with the image itself, not sure what though.
The fix:
Go to image link > Copy Image > Open photo editing program > Paste image (don't open the image, make sure to paste it, its something to do with the metadata) > Export as .png > reupload to site.
Testing image: https://www.titusstudios.net/data/static/images/miscellaneous/04052020/neilbarret.png
Source code for every image is <img src="img/image1.jpg">
I have a lot of images just kept it simple with image1 image2 image3...
but I also have subpages that have folders with images that don't work. I also did a responsive page that works on the computer when I shrink the window but not on the phone.
Update your image URLs.
For example:
www.mywebsite.com/images/myimage.jpg
You are probably still linking to your local images folder.
When I view my site locally on my laptop, the site looks perfect and works. But once I copy my files to the server, the live site looses the CSS and all the image links are broken. The images and css are properly linked and I have renamed and reuploaded the files several times (thinking it was a broken transfer). This is a project page from my main site and I don't have any issues with any of the other pages. Is this a server issue or a code issue? Any ideas on what this could be/how to fix it?
The problematic page is http://squigua.com/AD/R1NR/norules.html
The style and photos should leave the first initial screen looking like this:
black background, centered text, pictures, funky typeface
Your problem is that all your resources are in a folder named "AD".
Adblock will just assume you're serving up ads, so it will block ALL resources in that folder.
have strange situation i just moved my webpage to new hosting. I check everything and it was ok on my local pc. Webpage is working on firefox,chrome,ie without problem. Unfortunetly when moved to hotsting provider and check it for all 3 webbrowser only for firefox the carousel images are not shown - the carousel itself is showing up, i can even switch images which are empty. What can be wrong? On my local pc using firefox its showing up.
check if image name contains space or image extension is in upper case.
If you have image with ".JPG" extension and you call it by ".jpg" ( Notice change in Case) locally it may work but wont on server.
the problem was that every image i got was as below (look slash):
<img alt="" src="carousel\7.png">
and that was working for IE,chrome but not for fireofx (only local pc firefox)
when i chagned to that form every image:
<img alt="" src="carousel/7.png">
since that its working also firefox on hosting side.
I have a website that works correctly on my computer but when uploaded to the server there are several links that are no appearing. When I check these links through developer tools and it says 'Natural 1 X 1' when the image size is actually 192 X 122 pixels. The images are uploaded and appear on the server.Here is how the link looks:
<img src="img/ads/Christie_Lamb_WJO_Advertisement_TN.jpg"/>
I have other links with other folders that work fine, such as:
<img src="img/website_tn/Murray_Raine_Puppets_Website_TN.jpg">
and the offending website page online:
http://elementalarts.com.au/posters.html
Any help appreciated
This is probably because of adblock, avoid any folders with the name ad/advert when uploading images.
Tried to disable adblock on your page which solved the issue for me
Are you using Adblock or any other advertisement blocker?
Adblock sometimes blocks images that come from a folder called ads or others similar to that.
When i turn my Adblock off, i can see your images.