Problem
I can't get the Apple Touch Icon to work for my Wordpress website. Meaning the Icons that normally appear when you "Add to Reading List", "Add to Favourites" and "Add to Homescreen" in Safari all don't show up and only show the default. The setup works in my local environment but not on the live site.
I used RealFaviconGenerator.net to generate the files and placed them in a subfolder of the root, called /public-html/apple-touch-icons (I did place them directly into /public_html before, which also only worked in the local environment.)
What I've tried
#7885393 describes a similar problem and suggests
- to "remove the password protection on the website" (or "making the subdirectory anonymous" or "making the folder containing the icons public").
- that "the source of the problem is an .htaccess file with password protection"
I contacted my hosting provider to see, if the folder was password protected, and they assured me that it wasn't (it had Permission: 0755).
I also tried to remove .htaccess password protection from the subdirectory by following the instructions in #1431378 (which says to create an .htaccess file inside of the subfolder /public-html/apple-touch-icons and include this line Require all granted, which also yield no success.
Similar issues #27412270 and #6807349 talk about https, say that you need a "valid and trusted security certificate" and that iOS won't load the image if there's a certificate error, but don't find a clear solution. (As far as I am concerned my page does not fall into the category of faulty or insufficient certification. (But please, let me know, if you think it does.))
I realized that, when I change this line
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icons/apple-touch-icon-180x180.png?v=m2Rnn7v7rB">
to an external link, say the Apple Touch Icon of Stack Overflow:
<link rel="apple-touch-icon" sizes="180x180" href="https://cdn.sstatic.net/Sites/stackoverflow/img/apple-touch-icon.png?v=c78bd457575a">
everything works just fine and as expected. However, if I change it to a link on my page, it doesn't.
I am not sure what to look for anymore, but still feel like it has to do something with authentication or actually making the folder anonymous or changing the .htaccess in a different way,... but I can't figure out if one of these really is the solution to the issue and if they are, how to actually make them work...
