How to handle multiple favicon sizes, and
Added by Michelle Dupuis almost 6 years ago
In addition to the single favicon file, the norm now is to have multiple icon files in various "standard" sizes.
Here's a good overview:
[[[https://www.emergeinteractive.com/insights/detail/the-essentials-of-favicons/]]]
I would like to include in the HTML delivered to the browser some markup like this:
<link rel="icon" href="/path/to/favicon-32.png" sizes="32x32">
<link rel="icon" href="/path/to/favicon-57.png" sizes="57x57">
<link rel="icon" href="/path/to/favicon-76.png" sizes="76x76">
<link rel="icon" href="/path/to/favicon-96.png" sizes="96x96">
<link rel="icon" href="/path/to/favicon-128.png" sizes="128x128">
<link rel="icon" href="/path/to/favicon-192.png" sizes="192x192">
<link rel="icon" href="/path/to/favicon-228.png" sizes="228x228">
How can I get Wt to send this to the browser (in the
)?
Has anyone created a class do make this real simple :)
Replies (4)
RE: How to handle multiple favicon sizes, and - Added by Michelle Dupuis almost 6 years ago
One more thing, I notice that Wt is serving a favicon.ico file according to the log:
172.31.254.73 - - [2019-Jul-23 21:11:40.557] "GET /favicon.ico HTTP/1.1" 200 2296
But there is no favicon.ico file anywhere in my project. (Including not in the resources directory). Where is Wt getting this icon from?
RE: How to handle multiple favicon sizes, and - Added by Michelle Dupuis almost 6 years ago
I did find the addMetaLink method, but I'm not sure if a metalink is the same as a link in the header. Regardless, the log reports it failed to run, I assume because headers were already sent by the time I add the link (first line of app constructor)
I believe I can use the head-matter tags in wt_config.xml to load my icons, but I would rather have this in code (where users can't mess with it)
RE: How to handle multiple favicon sizes, and - Added by Roel Standaert almost 6 years ago
This is indeed kind of why <head-matter>
exists, to make stuff like that easy to add. addMetaLink
can also be used for this, but then you will have to enable progressive bootstrap (which is also something that has to be set in wt_config.xml
).
Normally, when a Wt site is first loaded, it loads a blank HTML document that then loads the rest over JavaScript. Only then is the application creator called and the WApplication
created.
At that moment it is thus too late to set these things in the <head>
. With progressive bootstrap it will call the application creator immediately, and you can use addMetaLink()
to set these. There's one caveat though, because at that moment Wt can't know yet whether the browser supports JavaScript, it will first render the page in plain HTML (WEnvironment::ajax()
will return false
), and load the JavaScript-enabled parts in with enableAjax()
later.
<head-matter>
is unaffected by that, because whatever is put in there is always sent, even if there isn't a WApplication
yet.
RE: How to handle multiple favicon sizes, and - Added by Roel Standaert almost 6 years ago
Oh, and it does indeed return a 200
status code when favicon.ico
is requested, but that does not necessarily mean that favicon.ico
was served. What's your --docroot
parameter like? If Wt does not know that it should understand /favicon.ico
as the path to a static file, it will just load a WApplication
with /favicon.ico
as the internal path. The browser, expecting an icon and not a webpage, will then ignore it.