Page specific favicon not showing up in Safari, works in Chrome

[ad_1]

Hi,

I have a local business site [warrencountyva.com](http://warrencountyva.com) and that has its logo as a favicon. Some businesses will have a page down from this home page and I want separate favicons for those pages.

An example of one that is working in Chrome but not Safari on my macbook pro) is [https://warrencountyva.com/route11dj/](https://warrencountyva.com/route11dj/)

I’ve spent hours with chatgpt on this issue and gone around and around.

I’m using Twenty Twenty Four theme and the FSE. I’m putting this in WPCode as a php snippet:

function add\_custom\_favicon() {

if (is\_page(490)) {

echo ‘<!– Custom favicon added for page 490 –>’;

echo ‘

<link rel=”apple-touch-icon” sizes=”180×180″ href=”https://www.warrencountyva.com/PageIcons/route11dj/apple-touch-icon.png”>

<link rel=”icon” type=”image/png” sizes=”32×32″ href=”https://www.warrencountyva.com/PageIcons/route11dj/favicon-32×32.png”>

<link rel=”icon” type=”image/png” sizes=”16×16″ href=”https://www.warrencountyva.com/PageIcons/route11dj/favicon-16×16.png”>

<link rel=”manifest” href=”https://www.warrencountyva.com/PageIcons/route11dj/site.webmanifest”>

<link rel=”mask-icon” href=”https://www.warrencountyva.com/PageIcons/route11dj/safari-pinned-tab.svg” color=”#5bbad5″>

<link rel=”shortcut icon” href=”https://www.warrencountyva.com/PageIcons/route11dj/favicon.ico”>

<meta name=”msapplication-TileColor” content=”#da532c”>

<meta name=”msapplication-config” content=”https://www.warrencountyva.com/PageIcons/route11dj/browserconfig.xml”>

<meta name=”theme-color” content=”#ffffff”>

‘;

}

}

add\_action(‘wp\_head’, ‘add\_custom\_favicon’);

Any guidance would be appreciated. Thanks.

[ad_2]