NetTalk Central

NetTalk Web Server => Web Server - Ask For Help => Topic started by: hectorp on January 12, 2024, 05:39:52 AM

Title: NTWS 12.63-App shortcut in mobile's home screen
Post by: hectorp on January 12, 2024, 05:39:52 AM

I like to give my app the ability to place a shortcut in the mobile's home screen of who ever access it through the browser.

Just for the very first time the app is accessed or if the shortcut does not exists in the mobile's home screen.

Is such a feature available or doable?

If yes, how can it be done?

TIA

Title: Re: NTWS 12.63-App shortcut in mobile's home screen
Post by: Bruce on January 14, 2024, 10:36:49 PM

Both iOS and Android allow you to "pin" a web site as an app. As long as a manifest.json, serviceworker.js and so on long exist.
The creation of these is part of NetTalk Apps. Which Level of NetTalk are you using?

Title: Re: NTWS 12.63-App shortcut in mobile's home screen
Post by: Poul Jensen on January 14, 2024, 11:27:56 PM

Hi,

It can be done manually.

1) Go to a site like this and create your icon images:  https://realfavicongenerator.net/
2) In the app, Webhandler, SetCustomHTMLHeaders you place this:

Code: [Select]

self.MetaHeaders = '  ' & |
    '<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">' & |
    '<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">' & |
    '<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">' & |
    '<link rel="manifest" href="/site.webmanifest">' & |
    '<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">' & |
    '<meta name="msapplication-TileColor" content="#da532c">' & |
    '<meta name="theme-color" content="#ffffff">'

3) Distribute the created icon images and files in the web folder.
4) The user then opens your app, and creates the shortcut from the menu, Add to home Screen:

/Poul

Title: Re: NTWS 12.63-App shortcut in mobile's home screen
Post by: hectorp on January 18, 2024, 01:21:51 PM

Hi Bruce,

Web App Server.