Menu
just wondering when I had an iphone I was able to create a web app then place some code in it so that when the user pressed "add to homescreen" an icon would be placed on the home screen and when the user clicked it the web app would run full screen (no web navigation bar) so it just looked like a normal app (although it would only run with the web on) Is there anyway I can do this with android or do I have to code a whole app to do it? Sorry if this is a bit unclear. Thanks, Adam.
What I used for the iphone:
<meta name="viewport" content="user-scalable=no, width=device-width" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<link rel="apple-touch-startup-image" href="images/myCustomStartupGraphic.png" />
771
I don't think it's possible. A workaround is to make a really simple app containing only a WebView and load into this webView your URL and then publish this app into the Play Store.
WebView webView = findViewById(R.id.webView);
webView.loadUrl("http://awesome.website.com");
Then on your website you can use the HTTP User agent to redirect users to download this app on Android devices.
62
You can now add pages as apps to the homescreen in Chrome Beta for Android. This is new as of Chrome M31 Beta. I'm not sure when it will be moved into mainstream Chrome for Android. To find Chrome Beta I couldn't just search the Play store, but instead had to do a regular Google search in Chrome. That result linked to Chrome Beta in the Play store.
Check out the info here to add a homescreen option: https://developers.google.com/chrome/mobile/docs/installtohomescreen
This is all I did to get this working:
Add this meta tag to the <head>:
<meta name="mobile-web-app-capable" content="yes">
Add this image link to the <head> for the homescreen icon:
<link rel="shortcut icon" sizes="114x114" href="views/img/icon114x114.png" />
I had the icon already made in a few sizes and ended up using one at 114x114. I found that the 512x512 version of the icon I was using for iOS didn't work for me in Chrome, with either sizes="512x512" or sizes="114x114" set in the <link>. Google's recommended size is 196x196.
If you have any issues, the Google Remote Debugger is awesome for troubleshooting. https://developers.google.com/chrome-developer-tools/docs/remote-debugging
25
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
