How to find out why Chrome displays an image as "favicon"? - google-chrome

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.

Related

Favicon not showing on quick links on Android Google Chrome

The way I use to display the favicon on my website is to add a favicon.ico in the root folder.
It is working alright on the tabs of the desktop and also the tabs on Chrome in phone itself, but when it's in the quick links, I only see the first letter of my website name. so if the domain is example.com I see E instead of the favicon:
Will I have to add meta tag for favicon to make it show here, or it has nothing to do with it?
favicon.ico is used for low resolution icons, such as the one that appears in the tab. However, bookmark and add-to-home-screen images must be high resolution icons.
In order to have such icons for Android Chrome:
Preferably, provide a Web App Manifest, along with a 192x192 icon.
If you don't want to create such file, you can provide a 180x180 Apple Touch icon. It is simpler and more platforms support it (eg. iOS Safari).
As an alternative, you can use online favicon generators, such as RealFaviconGenerator, to create all these files for you. Full disclosure: I'm the author of this service.

How to change the chrome extension image in chrome web store

How to set the featured image of a chrome extension in the web store like in the link below:
https://chrome.google.com/webstore/search/color%20eyedropper
Is this done via the manifest.json?
You need to include the images needed in the zip file of your app. You can find the documentation here: https://developer.chrome.com/webstore/images
For setting a promotional image, this can be done through the developer dashboard.

Editing a chrome extension

I use the extension New Tab Wallpaper for Google Chrome. I am wondering if it's possible to modify it so that it doesn't show the annoying Settings button on the bottom right corner. Or at least doesn't appear unless you move your cursor down there.
screenshot of new tab page
Looking at the extension in the Chrome Web Store, it doesn't look like the author linked the project to a homepage or an open source code repository such as GitHub.
That being said, if you really wanted to alter the extension, you can find the code on your computer, see this answer regarding where to find the extension on your computer for various operating systems. A Google Chrome extension is simply HTML, CSS and JavaScript.

ASP.NET - Images Not Loading Properly on Google Chrome/Firefox?

I am making a web application using ASP.NET and I noticed that only Internet Explorer loads images properly that are on my home computer (../Desktop/WebsiteImages/xxxx.jpg), whereas the images won't load on Chrome or Firefox. If I want the images to display on Google Chrome or Firefox, I have to upload the images on a web hosting site such as imgur instead of having them all on a file on my computer. Is this a known bug?
If I want the images to display on Google Chrome or Firefox, I have to
upload the images on a web hosting site such as imgur instead of
having them all on a file on my computer. Is this a known bug?
It is not a bug.
Web Server will never serve a file which is located outside of a web application (unless you create an image handler by yourself).
If you are new to web application, easiest way is to place images inside ~/images/ folder inside your ASP.Net application.
Then you can call the image like this -
<img src="#Url.Content("~/Images/MyImage.jpg")" alt="My Image"/>
showing local file like file:// is not allowed in Chrome and Firefox for security reasons by default, but this answer shows you how to change those settings. it's not recommended to use local filepath for your image

AdBlock Plus issue with image inside folder/subfolder

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.