Know if website launched from home screen shortcut

Question

I'm relatively new to web development and I was requested to add a popup message suggeting the user to add the website shortcut to his/her mobile home screen.

I already have the popup running but my boss is asking me to detect if the user launched the website from the shorcut to not show again the popup and I'm not sure if this is possible.

Any help or advice would be greatly appreciated.

       if (navigator.userAgent.match(/Android|webOS|BlackBerry|IEMobile|Opera Mini/i)) {  
            $.fancybox({
               'width': '50%', //Use percentage to maintain responsiveness
               'height': '50%',
               'autoScale': true,
               'autoDimensions': false,
               'transitionIn': 'fade',
               'transitionOut': 'fade',
               'centerOnScroll': true,
               'type': 'inline',
               'href': '#mob_popup',
               padding: 8,
               helpers: {
                   overlay: {
                       css: {
                           'background': 'rgba(255, 255, 255, 0.45)'
                       }
                   }
               }


           });

Cannot your shortcut contains some URL parameter to distinct it? — A. Wolff, Feb 11 '14 at 16:33
There are existing plugins that will handle the popup and detection for you. I suggest not re-inventing the wheel, here. — xdumaine, Feb 11 '14 at 16:43

score 2 · Accepted Answer · answered Feb 11 '14 at 16:41

2

Use javascript to check the window.navigator.standalone property. If you're launched from the home screen, that property should come up true and if you're in Safari (or another browser) it will be false.

answered Feb 11 '14 at 16:41

cajunc2

206
1
3

In my understanding this could work but only for iOS problem at this point would be Android. – Cabrakan Feb 11 '14 at 16:49

score 2 · Answer 2 · answered Mar 18 '22 at 03:21

2

For iOS devices, use window.navigator.standalone === true
For Android devices, use window.matchMedia('(display-mode: standalone)').matches

See similar post for reference.

answered Mar 18 '22 at 03:21

Andrew

132
1
9

Know if website launched from home screen shortcut

2 Answers2