Archived topic
favicons and Head HTML
5 replies · Started by nomadiceman on June 10, 2020
Hi guys,
Im using a site to generate my favicons. https://favicon.io/ it then says to do this
First, use the download button to download the files listed below. Place the files in the root directory of your website.
android-chrome-192x192.png
android-chrome-512x512.png
apple-touch-icon.png
favicon-16x16.png
favicon-32x32.png
favicon.ico
site.webmanifest
Next, copy the following link tags and paste them into the head of your HTML.
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
Do you see any issues doing this? And can you tell me the best way to get that code in the head?
Thank you for your help
Hi there,
You can also upload favicon this way:
https://generatepress.com/forums/topic/favicon-4/#post-525974
To insert code in to <head>, you can try the wp_head hook with a hook element:
https://docs.generatepress.com/article/hooks-element-overview/
when i just place it in the folder as that post says, i don't get these
android-chrome-192×192.png
android-chrome-512×512.png
apple-touch-icon.png
favicon-16×16.png
favicon-32×32.png
favicon.ico
do i need to add that code above? I mean, Ive no clue what it is for haha, does it look safe and ok with you?
Hi there,
Will your site be a Progresive Web App ? ie. the use can add site to the homescreen of their device? If not then that code is not really required.
great understood. thanks again
You're welcome