iPhone and iPod touch allow a user to save a WebClip bookmark to your site on their Home Screen.
To specify a bookmark icon for all pages of a web site, place a PNG image named "apple-touch-icon.png" at the root directory of your web server - similar to the "favicon.ico" for site icons.
To override the site bookmark icon on a specific web page, insert a <link> element similar to <link> within the <head> element of the page.
The bookmark icon dimensions should be 57x57 pixels. If the icon is a different size it will be scaled and cropped to fit.
Safari will automatically composite the icon with the standard "glassy" overlay so it looks like a built-in iPhone or iPod application.
iPhone custom icon. Root web folder?
- snowjay offline
- Posts: 274
- Joined: Aug 09, 2006
iPhone custom icon. Root web folder?
Where exactly is the root of the server? Apple has instructions for creating your own icon (below) but it needs to be placed in the root folder of the server, but I'm not sure where that is since everything is dynamic.
Jason
- Estranged offline
- Posts: 51
- Joined: Apr 08, 2006
(No subject)
It's at
You'll see the favicon.ico in that folder.
If you're only using the built-in control pages, that's the way to go. If you're modifying them on your own, you'll want to use
inside your html file. That lets you put the image anywhere you want.
There are also some reports that indicate making a larger icon and having the iPhone scale it down yields better looking icons.
- Code: Select all
/Library/Application Support/Perceptive Automation/Indigo 2/IndigoWebServer
You'll see the favicon.ico in that folder.
If you're only using the built-in control pages, that's the way to go. If you're modifying them on your own, you'll want to use
- Code: Select all
<link rel="apple-touch-icon" href="iphone.png"/>
inside your html file. That lets you put the image anywhere you want.
There are also some reports that indicate making a larger icon and having the iPhone scale it down yields better looking icons.
- matt (support) offline
- Site Admin
-
- Posts: 21417
- Joined: Jan 27, 2003
- Location: Texas
Re: iPhone custom icon. Root web folder?
Open the IndigoWebServer.py file (inside IndigoWebServer folder), and directly above this line:
add these lines:
Then add the PNG directly to the IndigoWebServer folder (where the favicon.ico lives). The next public beta of Indigo will include these changes and a default 57x57 Indigo icon PNG. The Indigo icon doesn't look all that great with the glossy overlay the iPhone adds...
Regards,
Matt
- Code: Select all
'/favicon.ico': {
add these lines:
- Code: Select all
'/apple-touch-icon.png': {
'static_filter.on': True,
'static_filter.root': pathname,
'static_filter.file': 'apple-touch-icon.png'
},
Then add the PNG directly to the IndigoWebServer folder (where the favicon.ico lives). The next public beta of Indigo will include these changes and a default 57x57 Indigo icon PNG. The Indigo icon doesn't look all that great with the glossy overlay the iPhone adds...
Regards,
Matt
- snowjay offline
- Posts: 274
- Joined: Aug 09, 2006
(No subject)
Thanks! I'll give this a shot when I get home.
Jason
- snowjay offline
- Posts: 274
- Joined: Aug 09, 2006
(No subject)
Worked perfect!
I'm using a 85x85 "button" that I use in my web pages.
Someone else had posted them, it's an orange button with the Indigo house in it.
I'm using a 85x85 "button" that I use in my web pages.
Someone else had posted them, it's an orange button with the Indigo house in it.
Jason
- bcmayes offline
- Posts: 119
- Joined: Apr 02, 2006
- Location: Philadelphia, PA
(No subject)
Thanks.
Mine worked great! I made one based on the sphere icon. I just filled in the whole thing with the dark purple used in the INDIGO logo text and let the iPhone gloss it up.
Byron
Mine worked great! I made one based on the sphere icon. I just filled in the whole thing with the dark purple used in the INDIGO logo text and let the iPhone gloss it up.
Byron
Mac mini 1.25, 1024MB RAM; Indigo 2.0
- Mark offline
-
- Posts: 262
- Joined: Apr 21, 2005
- Location: California
(No subject)
bcmayes wrote:Mine worked great! I made one based on the sphere icon. I just filled in the whole thing with the dark purple used in the INDIGO logo text and let the iPhone gloss it up.
I guess I put my "tutorial" in the wrong forum. If you're interested in having a different custom icon for each of your control pages, check out my post on this forum page:
http://www.perceptiveautomation.com/phpBB2/viewtopic.php?t=2305&start=45
Who is online
Users browsing this forum: No registered users and 6 guests