LinkedIn
Twitter
Drupal has a simple way to set a regular PNG as a favicon. Basically I create my own sub-theme, as described here, then replace the favicon.png with my own. Works great.
But what if I want to set up a specific set of favicons optimized for different devices? This is the default for modern websites. Typically they'll have something like this inside the <head> section of the html page:
<link href="https://community.apigee.com/assets/common/favicon/favicon-16x16-file.png" type="image/png" sizes="16x16" rel="icon"> <link href="https://community.apigee.com/assets/common/favicon/favicon-24x24-file.png" type="image/png" sizes="24x24" rel="icon"> <link href="https://community.apigee.com/assets/common/favicon/favicon-32x32-file.png" type="image/png" sizes="32x32" rel="icon"> <link href="https://community.apigee.com/assets/common/favicon/favicon-96x96-file.png" type="image/png" sizes="96x96" rel="icon"> <link href="https://community.apigee.com/assets/common/favicon/ios-57x57-file.png" type="image/png" sizes="57x57" rel="apple-touch-icon-precomposed"> <link href="https://community.apigee.com/assets/common/favicon/ios-72x72-file.png" type="image/png" sizes="72x72" rel="apple-touch-icon-precomposed"> <link href="https://community.apigee.com/assets/common/favicon/ios-114x114-file.png" type="image/png" sizes="114x114" rel="apple-touch-icon-precomposed"> <link href="https://community.apigee.com/assets/common/favicon/ios-144x144-file.png" type="image/png" sizes="144x144" rel="apple-touch-icon-precomposed">
Drupal has a tickbox inside the settings page for my theme, where I can disable the default, simple favicon:
But where do I place all the <link> elements? I found MYSITE/profiles/apigee/themes/apigee_responsive/templates/system/html.tpl.php .
And I can insert the elements there, but... shouldn't I do this as part of my subtheme?
I tried copying that file to my subtheme and modifying it there, but I don't think that worked.
Can anyone advise?
