How can I make images on my site secure?
Firefox location bar tells me that my despite using https: images on my site are not secure, so what should I do to remedy this?
All Replies (1)
If you get the lock with the warning triangle, it usually means there is an HTTP: URL in one of these places:
- inline images: <img src="http://mylogo.png">
- CSS: {background-image: url(http://mylogo.png);}
- site icon: <link rel="icon" type="image/x-icon" href="http://favicon.ico">
If possible, remove the protocol and use a relative link so that if the user loaded the page using HTTPS, the images also will be loaded using HTTPS:
<img src="//mylogo.png">
Here's an old article about that option: https://blog.wikimedia.org/2011/07/19/protocol-relative-urls-enabled-on-test-wikipedia-org/
If you have trouble finding all the mixed content, use Firefox's Web Console. You can open the Web Console in the lower part of the tab using either:
- "3-bar" menu button > Web Developer > Web Console
- (menu bar) Tools > Web Developer > Web Console
- (Windows) Ctrl+Shift+k
Then reload the page in the upper part of the tab and above the messages, type mixed into the filter line to surface the most relevant messages.
Success?