Apple Touch Icon Support

Developer help
1

I want to set the favicon also as the apple touch icon. Meaning that if you bookmark the ghost website on your iPhone home screen it shows a high res logo as the “app” icon instead of a screenshot of the website.

I’m using a self hosted Ghost 3.1.1 with the Liebling Theme on https://iosapps.de. On iPhone im using iOS 13.1 with Safari to add the website to the home screen. Instead of showing the Logo/Favicon it shows a screenshot as the Logo it would use on the home screen. This is standard behavior when no apple touch icon is found.

I got all the files but don’t know where to put them within the Ghost installation. Setting a favicon in the ghost backend doesn’t do the trick for iOS.

What can I do to use my favicon/icon as the apple touch icon with Ghost? or Where do i have to put my apple-touch-icon file in order to work? (just in /html folder doesn’t work)

Thanks in advance,
ypilot

2

Take a look at the documentation on Apple’s site here:

2 Likes
3

You’ll need to add any image files to your theme’s root directory and then modify your theme’s default.hbs file to add the relevant <link> and <meta> tags.

You can read more about theme development in the docs…

2 Likes
4

For me it was a problem with building the theme after changing it. I had an issue with npm, where it didn’t run my scripts. So this was the fix: node.js - npm run does nothing - Stack Overflow

Now the theme icons are displayed properly in iOS.

To keep my root directory clean, i created a subfolder in the assets folder, containing all my icons. This is roughly how i did it, though you don’t need as many icons anymore and some files are called differently by now (so don’t just copy and paste from this article): https://peterdaugaardrasmussen.com/2015/12/30/adding-a-favicon-to-a-ghost-blog-browser-tab-icon/

Thanks for your comments @Dave and @Kevin ! They helped me to further tweak how iOS handles the website (e.g. defining a separate meta name) and let me try adding them to the root folder, which i did’t try before.

1 Like