Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Determine if site is open as web app or through regular safari on ipad?

Is there a way to determine if a visitor is viewing our site as a web app on their home screen or regularly through safari on ipad?

like image 895
Andrew Samuelsen Avatar asked Jun 28 '11 16:06

Andrew Samuelsen


Video Answer


1 Answers

I figured it out:

Make sure proper web app meta info is there:

<head>
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" /> 

Then add this script

<script>
if (window.navigator.standalone == true) {
 document.write('<p>Welcome Home</p>');
}else{
 document.write('<p>Tap the + button and choose "Add to Home Screen"</p>');
 document.write('<link rel="apple-touch-icon-precomposed" href="[email protected]"/>');
}
</script>
</head> 

So, window.navigator.standalone will be true IF they are viewing in the fullscreen web app mode. Super.

Source: This is for iphone but it works the same and is where i figured out how to do it: http://www.bennadel.com/blog/1950-Detecting-iPhone-s-App-Mode-Full-Screen-Mode-For-Web-Applications.htm

like image 115
Andrew Samuelsen Avatar answered Sep 19 '22 16:09

Andrew Samuelsen