I enabled pwa on my website and now chrome is showing add to home screen prompt and it is ok. Now i added my site to home screen through prompt and reloaded my website but chrome is still showing add to home screen even i added to my home screen. Ideally chrome should not show up add to home screen prompt if user added to his home screen. I think i am missing something on coding side.
Related
My scenario:
open website in Safari,
add it to home screen.
open it from home screen
at some place in website - there is link which opens in new tab ( target=_blank )
on Iphone 13 an prior there is top panel with Done button which allow to close it and return to main page.
on Iphone 14 doing same steps - but panel with Done missed. and no way to close window and back to main page. My users literally stuck on new page without ability to return
Is something in manifest required?
How do you get the iPad or iPhone to have a Home Screen shortcut icon to open your website in Google Chrome and not safari?
Here is the work around I use.
Open callmeicons.com using safari (do not use another browser for this part)and click “create your own”,
then in the Dropdown select “website link”,
Next past the website URL you want to open but replace the HTTP:// with googlechromes://(YOUR URL). For example if you wanted your Home Screen shortcut icon to open https://stackoverflow.com you would enter googlechromes://stackoverflow.com
Next you can enter a name and then choose an icon and select “create icon” at the top menu
Lastly when prompted you go to the share icon (box with arrow out of the top) in safari and select “add to Home Screen”
The final result: when you click the icon added to your Home Screen it should splash Safari browser for a milli second and then realize its mistake and open your link in Google Chrome
I have a website that uses the JavaScript SDK, and I have a facebook login button that calls FB.login() that opens a new tab for the user to log in.
This website is optimized for the iPad, and I made a home screen entry for this website so it could be viewed in full screen, like how this article mentions it:
http://www.viaboxxsystems.de/html-fullscreen-apps-for-the-ipad
My problem is that only in the home-screen-launched, fullscreen version, when I click on the login button, either I see a white screen, or I get the login details screen (but in that case, clicking "Log In" also results in a white screen), and thus I get to a dead end.
How do I make it so the Facebook login goes through and I get redirected back to my website successfully?
Apple’s documentation for this says,
When you use this standalone mode, Safari is not used to display the web content—specifically, there is no browser URL text field at the top of the screen or button bar at the bottom of the screen.
Sounds to me like this might also affect the ability to open popups. If that’s the case, you could maybe use the server-side authentication flow instead.
My app is started with a splash screen in the page. After 5 seconds (after showing splash screen) it will navigate to next page (login page).
When we click on the back button (on device or on the app), I want to exit the application. That means it should not go back to splash screen page. How can I achieve this?
Any help would be much appreciated...
Apple says in the Safari HTML reference that the below code is supposed to make the the web-app full screen on iPhone OS 2.1 and later.
<meta name="apple-mobile-web-app-capable" content="yes">
But it doesn't seem to work. Is there a way of hiding the title/location bar within Safari in an iPad WebApp?
This only works after you save a bookmark to the app to the home screen. Not if you just browse to the site normally.
If you want to stay in a browser without launching a new window use this HTML code:
<a href="javascript:this.location = 'index.php?page=1'">
First, launch your Safari browser from the Home screen and go to the webpage that you want to view full screen.
After locating the webpage, tap on the arrow icon at the top of your screen.
In the drop-down menu, tap on the Add to Home Screen option.
The Add to Home window should be displayed. You can customize the description that will appear as a title on the home screen of your iPad. When you are done, tap on the Add button.
A new icon should now appear on your home screen. Tapping on the icon will open the webpage in the fullscreen mode.
Note: The icon on your iPad home screen only opens the bookmarked page in the fullscreen mode. The next page you visit will be contain the Safari address and title bars.
This way of playing your webpage or HTML5 presentation in the fullscreen mode works if the source code of the webpage contains the following tag:
<meta name="apple-mobile-web-app-capable" content="yes">
You can add this tag to your webpage using a third-party tool, for example iWeb SEO Tool or any other you like. Please note that you need to add the tag first, refresh the page and then add a bookmark to your home screen.
It only opens the first (bookmarked) page full screen.
Any next page will be opened WITH the address bar visible again.
Whatever meta tag you put into your page header...
This site has a working workaround, same effect, uses some javascript to set the first child div to total height of viewport.
http://webapp-net.com/Demo/Index.html
Looks like most of the answers on this thread have not kept up. iOS Safari on iPads have fullscreen support now and it's very easy to implement using javascript.
Here's my full article on how to implement fullscreen capability on your web app.