Changing apple-touch-icon for a website

iconsafari

For aesthetic reasons, I'd like to change the apple-touch-icon (the icon that is displayed in the favourites grid in Safari), for a website that I do not own (such as YouTube).

I thought I would be able to do this by editing the html to include <link rel="apple-touch-icon" href="http://url-to-image.png">, then re-adding the website to my favourites. No luck. Although this did work in Windows to create a custom live tile.

Is there any other way this can be accomplished?

Best Answer

Safari doesn't use the HTML of the current page when obtaining the apple-touch-icon. Safari makes a separate HTTP request to the page when you add it as a favourite, and then at regular intervals later on to keep the icon updated.

You might find success replacing the icon in the Safari cache, then locking the file so Safari can't overwrite it. You can find the icons at:

~/Library/Safari/Touch Icons Cache/Images/

Once you've found the image you wish to change and replaced it, use Get Info to lock the file.