I have a responsive website that is widely used on the mobile by customers, we always indicate that the customer uses Google Chrome, as it offers an option to create a shortcut to the site on the phone, except that it creates the shortcut and the icon stays the initial letter of the tag, I've seen that several sites have the icon of the site's tab, how do I make mine also have the icon in the shortcut?
Website icon in the Shortcut when adding site to the mobile screen in the option that chrome has Android
1
asked by anonymous 05.06.2018 / 22:49
1 answer
4
What happens is that each operating system works with the Icon one way. Usually what you see is Favicon being transformed into the shortcut icon on mobile devices.
What I tell you is to use a Favicon generator that also has the JSON Manifesto, and that generates icons for all operating systems. Here's an example. such site. It will give you a pack of images and script and you will crawl on your page within the <head> % link
Sample code for u put the shortcuts using favicon, noting that this code should be within the <head> of the document and images of this example at the root. OBS: images will be generated by the website engine I mentioned as an example, but there are others ...
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
05.06.2018 / 22:57