rolandjesse.de/_posts/2015-06-22-web-app-mode.md
2015-11-20 17:45:52 +01:00

999 B

layout section-type title category tags
post post Web app mode tech
tutorial

You can make your website behave like a native web app in iOS and Android devices by setting the web-app-mode variable to True and providing links for the icons for each resolution:


web-app-mode: True

# Icons for Web App mode
icon-36p: "/img/web-app/icon-36p.png"
icon-48p: "/img/web-app/icon-48p.png"
icon-72p: "/img/web-app/icon-72p.png"
icon-96p: "/img/web-app/icon-96p.png"
icon-144p: "/img/web-app/icon-144p.png"
icon-192p: "/img/web-app/icon-192p.png"

This is how the website will look when added to the homescreen:

iOS

Android

And when the user opens it (note that it renders in fullscreen):

Web App