When creating a shortcut to a website on Windows Phone 7, the icon it creates is a snapshot of the website instead of any sort of icon that I want it to display. For example, with iOS I can sepcify
<link rel="apple-touch-icon" href="Logo.ico" />
and it uses that icon for the home screen image.
I've tried
<link rel="shortcut icon" href="Logo.ico" />
which seems to work in IE but not IE mobile.
Has anyone successfully created a home screen icon for windows phone 7 / IE7 mobile?
I assume you are referring to pinning a web page to the start screen.
This is by design. You cannot change it.
I think the intention is that you can see a better idea of where you will be taken to when tapping it. This is particularly true if you pins multiple pages from the same site (which would have the same icon otherwise).
If it was possible to set a custom icon, it would need to be 173x173 pixels which wouldn't be the same as any other platform. There would therefore be A LOT of sites/pages which didn't have this specified. If the fallback was to use the default favicon image this is typically only 16x16 (or 32x32) pixels and so would not look good on the 173x173 pixel tile.
All you need is a .css file, a 256x256 image.
.logo {
display:none;
}
@media screen and (max-width: 480px) {
.logo {
display:block;
text-align:center;
width:auto;
padding-top:32px !important;
padding-bottom:32px !important;
}
}
And right before the first html output make a div with logo class and your 256x256 image.
tested on Nokia Lumia 800
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With