Manual:$wgAppleTouchIcon

From MediaWiki.org

[edit] Details

Apple's iPhone and iPod Touch mobile devices will display an icon when you save a bookmark onto the home screen from Safari. This is somewhat similar to a favicon, but larger (approximately 60x60).

Example:

$wgAppleTouchIcon = "/wiki/icons/Kickbutt-wiki.png";

This produces a <link> tag in HTML header output:

<link rel="apple-touch-icon" href="/wiki/icons/Kickbutt-wiki.png" />

Setting $wgAppleTouchIcon is not required to support a custom icon; if left unset, the browser will attempt to load "/apple-touch-icon.png". If this doesn't exist either, a thumbnail of the page is used which is not very attractive.

Using the override option, wikis may set a different icon from other pages on the same host, or may simply choose to set a custom URL.

[edit] Guidelines

An iPhone home screen including some custom site icons.

Clean images with good sharpness and contrast and a bright colored background will fit in reasonably well with other icons. If you don't have one to test with, refer to handy screen shots such as the one here.

Apple documentation recommends a 57x57 pixel PNG image, however 60x60 seems closer to the mark; a smaller image is scaled up slightly, becoming a bit blurry.

Rounded corners and a "glossy" texture are added by the iPhone UI, so use a flat, square background in your source image:

Original image:	As rendered:

Transparent backgrounds are rendered as solid black.

See also: $wgFavicon

Language:

English  • 日本語