05 Aug 2024 15:48
- # android
- # answers
- # chrome
- # ios
- # questions
- # realfavicongenerator
- # safari
- # tech
- # webmaster
- # websitebuilding
- # websiteshortcut
Q: I have generated a set of icons for my site for various platforms/devices using realfavicongenerator.net. After incorporating them into my site, I have noticed that on iOS (Safari) and Android (Chrome), when adding a shortcut to my site on the desktop, my site is being treated like a web app. Chrome on Android shows "install app" instead of "add shortcut", and on both iOS and Android devices, clicking on the shortcut launches my site in web app mode, i.e., without the browser's navigation elements. How do I get my site to behave like a standard site, not a web app, again?
A: realfavicongenerator.net generates a file called site.webmanifest. It should be in the same folder as all your different generated favicons, likely in the root folder of your site. The content of the file will look similar to this:
{
"name": "",
"short_name": "",
"icons": [
{
"src": "/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone"
}
If you change "standalone" to "browser", that should do it. Don't forget to clean your mobile browser's cache before you test it, as browsers tend to cache the manifest file.
