Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Add web app to home screen

I have a web app situated at www.xclo.mobi

I notice that when looking at other IOS web apps, they have an image that points to the browser menu telling people to install there web app to their device that appears as soon as the user views that page.

The image generally says: "Install this web app on your device: Tap on the arrow and then 'Add to Home Screen'"

EXAMPLE IMAGE

can someone please advise me on how to add this? what codes will I need to add to my IOS home pages in order to get this?

thanks a lot for your help.

like image 781
Kev Hopwood Avatar asked Feb 28 '13 11:02

Kev Hopwood


1 Answers

I've just got a proposed edit to the answer telling me it doesn't work anymore. Fist of all, the proposed edits are used to edit the answer, if it doesn't work and you know how to fix it, send the fix on the update, if you don't know how to fix it, post a comment instead and provide more info, not just "it doesn't work".

There is a new add2home version http://cubiq.org/add-to-homescreen-goes-3

Source code is here: https://github.com/cubiq/add-to-homescreen

The basic usage for the new version

<head>
<title>Add To Home</title>
...
<link rel="stylesheet" type="text/css" href="../../style/addtohomescreen.css">
<script src="../../src/addtohomescreen.js"></script>
<script>
addToHomescreen();
</script>
</head>

use this script Cubiq add to home screen

Usage, copy the files add2home.js and add2home.css to the folder where you have your ipad.html and edit your <head> to include this:

<head> 
<link rel="stylesheet" href="add2home.css"> 
<script type="application/javascript" src="add2home.js"></script> 
</head>
like image 74
jcesarmobile Avatar answered Oct 16 '22 23:10

jcesarmobile