Sidebar Sidebar
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

how to get custom website icon for iphone?

freeny

freeny

macrumors 68020
Original poster
Sep 27, 2005
2,064
65
Location: Location:
Ive been trying to get a custom iphone icon for my website. From googling I have found a few tutorials on creating the .png, renaming it "apple-touch-icon.png" and dropping it into the root folder of the site on the server where the site is hosted.

None of these seem to be working. Has the 2.0 update disabled this?
Since I use .mac to host my site is there any thing special I am supposed to do?

Any suggestions.... :eek:
 
I can't remember the name of the site, but there was somewhere that you could submit an icon to and the website and they would make it so you pointed it to their site with a code they supplied and it gave the icon on the iPhone and stuff. It worked pretty well. The simply used a redirect system. It came out with 1.1.2 or 1.1.3 whichever first supported adding websites to the home screen. But I'd have to dig to find it.
 
freeny said:
Ive been trying to get a custom iphone icon for my website. From googling I have found a few tutorials on creating the .png, renaming it "apple-touch-icon.png" and dropping it into the root folder of the site on the server where the site is hosted.

None of these seem to be working. Has the 2.0 update disabled this?
Since I use .mac to host my site is there any thing special I am supposed to do?

Any suggestions.... :eek:
Click to expand...
The steps haven't changed, and I can confirm that custom icons still work in iPhone 2.0. Make sure your PNG file is actually a PNG file (and not a renamed JPG or GIF), and make sure its resolution is either 58 x 58 or 158 x 158.

Look here for more:

http://allinthehead.com/retro/319/how-to-set-an-apple-touch-icon-for-any-site
 
clayj said:
The steps haven't changed, and I can confirm that custom icons still work in iPhone 2.0. Make sure your PNG file is actually a PNG file (and not a renamed JPG or GIF), and make sure its resolution is either 58 x 58 or 158 x 158.

Look here for more:

http://allinthehead.com/retro/319/how-to-set-an-apple-touch-icon-for-any-site
Click to expand...

png-8 or png-24 or does it matter?

Nope, still not working....
I am trying this on an iphone if that matters and not a touch.

Ive tried putting it in different folders on the .mac server and notta.....

anyone able to do this on .mac?
 
no matter how many times I tried to enter the security code on webclips it says I have entered it wrong ??? Anyone else have this problem or have a solution?
 
SIUGRAD99 said:
no matter how many times I tried to enter the security code on webclips it says I have entered it wrong ??? Anyone else have this problem or have a solution?
Click to expand...

Yeah, I just tried it and it didn't work. Even tried i.e.7 thinking maybe it didn't like safari for windows, even turned off popup blockers. So I sent them an email to see what's up.

Clipalizer worked quite well, but had to use Photoshop to turn my jpg into a 57x57 png file.
 
Create a 58px x 58px image (you can use a square image) and upload it to your server. Then place the following code into the <head> section of your document.

<link rel="apple-touch-icon" href="http://icon-image-link-goes-here"/>
 
I got an email back from webclip.us, supposedly something was up with the server and they said it is fixed now. I haven't tried it myself though.
 
the links provided did in fact put the custom icon on my iphone. unfortunately this is done only to my iphone and not others who will one day link to my website on their phone.

For some reason the 57x57png thing doesnt seem to work for me. I have tried just about every "root" folder possible with no luck.... hmph :(
 
freeny said:
For some reason the 57x57png thing doesnt seem to work for me. I have tried just about every "root" folder possible with no luck.... hmph :(
Click to expand...

Root, as in the main directory of your website -- the one you're looking in when you're at the top index page (e.g., www.yoursite.tld/[this directory]). In OS X client, it would be /Users/yourusername/Sites/. In OS X server, it's /Library/WebServer/Documents/{optional virtual site folder}/. In most *nix, it's /var/www/path-to-virtual-host/.

From http://vjarmy.com/archives/2008/01/howto_iphone_webclip_icons.php :
  • Create a 57x57 PNG.
  • Name it "apple-touch-icon.png"
  • Throw it in the root folder of your website. (Not the root of your server, the root of your web documents.)
Boom. If you add a webclip for vjarmy.com, you'll see my smiling mug.

If you want more flexibility - perhaps you don't have access to the site root, perhaps you want to use a different file name or format - you can use a link tag in the head of the document, such as:

Code: 
<head>
    <title>your-page-title</title>
    <link rel="apple-touch-icon" href="/path/to/file/whatever.jpg"/>
</head>
Click to expand...
 
You must log in or register to reply here.
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.
Top Bottom
Back