[wp-trac] [WordPress Trac] #16434: Give site admin ability to upload favicon in Settings, General

[WordPress Trac]

#16434: Give site admin ability to upload favicon in Settings, General
-------------------------------------+-----------------------------
 Reporter:  jane                     |       Owner:
     Type:  feature request          |      Status:  new
 Priority:  normal                   |   Milestone:  Future Release
Component:  Administration           |     Version:  3.1
 Severity:  normal                   |  Resolution:
 Keywords:  ux-feedback needs-patch  |     Focuses:
-------------------------------------+-----------------------------

Comment (by emiluzelac):

 Replying to [comment:140 GaryJ]:
 > The comment from three years ago regarding apple-touch icons is now well
 out of date. For covering all of the related features in browsers and
 operating systems, you'd need something like:
 >
 >
 > {{{
 > <link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-
 57x57.png">
 > <link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-
 114x114.png">
 > <link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-
 72x72.png">
 > <link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-
 144x144.png">
 > <link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-
 60x60.png">
 > <link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-
 120x120.png">
 > <link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-
 76x76.png">
 > <link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-
 152x152.png">
 > <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-
 180x180.png">
 > <meta name="apple-mobile-web-app-title" content="My Awesome Website">
 > <link rel="icon" type="image/png" href="/favicon-192x192.png"
 sizes="192x192">
 > <link rel="icon" type="image/png" href="/favicon-160x160.png"
 sizes="160x160">
 > <link rel="icon" type="image/png" href="/favicon-96x96.png"
 sizes="96x96">
 > <link rel="icon" type="image/png" href="/favicon-16x16.png"
 sizes="16x16">
 > <link rel="icon" type="image/png" href="/favicon-32x32.png"
 sizes="32x32">
 > <meta name="msapplication-TileColor" content="#2b5797">
 > <meta name="msapplication-TileImage" content="/mstile-144x144.png">
 > <meta name="application-name" content="My Awesome Website">
 > <meta name="theme-color" content="#182148">
 > <link rel="manifest" href="/manifest.json">
 > }}}
 >
 > Unless Core is going to support all of these image creations and
 manifest generation, then I think this feature should be plugin material.

 I don't know if we need to add all `apple-touch-icon` and `icon` sizes, do
 we? That seems like an unnecessary bloat to me. We can either load the
 highest resolution and let it resize, or add low and high if really
 needed.

 See even if you add one, it will take less than all of them combined,
 unless there is a logic where they're loaded according to the screen size.


 `<link rel="apple-touch-icon" sizes="152x152" href="touch-icon.png">`

 ----

 == References: ==


 [https://github.com/h5bp/html5-boilerplate/issues/1367 Is there any need
 for the 6 different apple-touch icons when just one will work?]
 [https://github.com/h5bp/html5-boilerplate/pull/1425 Use one apple-touch-
 icon instead of six]
 [https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html
 Configuring Web Applications]

--
Ticket URL: <https://core.trac.wordpress.org/ticket/16434#comment:144>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform