Currently I am developing a website. I am trying to link an image via img tag but it doesn't seem to appear on the website.
Here is how I'm linking it:
<img src="images/social/facebook.png">
The facebook.png image is located inside a images folder which then has a sub folder called 'social'.
I believe I have linked it correctly because when I directly visit http://example.com/images/social/facebook.png the image appears on the browser. As of writing this post, I have inspected the website using Chrome developer tools. Developer tools says: "Failed to load resource: net::ERR_BLOCKED_BY_CLIENT". I have researched this error up and most sources say that the content is blocked by an extension such as AdBlocker.
That brings me to the question of, why does AdBlock Plus block this image? And why is it that if I put the image on the root of the website, e.g src="facebook.png", AdBlock Plus doesn't block it.
Related
I am currently working on a new website which I already uploaded to a webserver. Interestingly, Google chrome shows an icon as a "favicon" that has no relationship to the page. There is no favicon mentioned in the CSS, the (static) HTML code, and there is also no "favicon.ico" in the directory that Apache2 serves.
Is there any way to find out why Google Chrome uses the icon? There are other subdomains on the web server that use the same CSS style (and HTML template) for which Google Chrome does not use the icon.
I am currently using skeleton framework,
www.getskeleton.com
while building a website but the skeleton image is displaying as a favicon on the web page's tab. I deleted the image itself and checked all the link, rel, tags and meta tags in the html page and css page to see if anything was pointing towards an image but there's nothing to suggest why it is still there. Any suggestions?
The path of the favicon is dist/images/favicon.png.
Ensure if the favicon is deleted from this path.
Also try clearing browser cache and hard refresh the webiste Ctrl + F5.
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.
I have a issue of displaying .png images on web my web page. Other image types excluding .png just work fine. The issue is .png. The web site is located in a sub domain. In the root, a wordpress site is running.
In firebug, I can see a 403 error. But I can assure that I have set 0777 permissions for all images. It couldn't be a permission issue.
Rarely, .pngs are loading. But the second request gives a broken image. I have applied different cache removal techniques including <FilesMatch> directive in .htaccess, appending version attributes to image link, using # ...etc. But nothing works.
The most complicated point is that when copy & paste the image link in browser it shows the .png. However not within a web page.
Can anybody help me resolve this?
Thanks in advance.
Even I tried executing it in a browser. But the .png image doesn't showup for me.
Try changing the image folder permission to 755 or 644.
My browser is session authenticated with a website.
I am using their API to pull down images from the site so I can display them on my page.
Visiting that image url displays the image, putting it in an img tag does not:
<img src = "https://files.something.com/123123" />><!-- this doesn't show -->
arse<!-- this works -->
Any ideas on why? and how I might overcome it?
If I put in http for the link, it redirects to https any way.
There's two things worth bearing in mind here:
Your host is automatically redirecting to https. Is this deliberate?
I suspect that you're seeing coming up against cross-domain security, or that your server is actively refusing it.
To trouble-shoot: you'll want to find out what response you're getting from your images.
Open up either the 'NET' tab in Firebug, or 'Network' in Chrome Developer Tools and watch the page-load. I suspect you're going to see those images come through red with an error number. Once you've got that it's very easy to trouble-shoot why the server's refusing to serve the images.