0

Based on other similar stackexchange questions and documentation, I've implemented the following in the MYTHEME_page_attachment_alter function in MYTHEME.theme file to change the favicon based on the url (inside a condition statement):

    foreach($page['#attached']['html_head_link'] as $k => $v) {
        if (array_key_exists('rel', $v[0]) && $v[0]['rel'] == 'shortcut icon') {
            unset($page['#attached']['html_head_link'][$k]);
            $page['#attached']['html_head_link'][$k] = array(
                array(
                  'rel' => 'shortcut icon',
                  'href' => '/themes/fu/favicon_urbana.png',
                    'type' => 'image/png',
                ),
            );
        }
    }

Using Kint::dump($page) confirms that the shortcut icon is indeed updated. Why then will the tab for the page not show the updated favicon? I've cleared the cache, ran drush cr multiple times, etc yet the page continues to show the theme's favicon.

Am I missing something? Any advice would be greatly appreciated.

On a side note, we had this working successfully in Drupal 7 in MYTHEME_html_head_alter() and I am migrating this to Drupal 8.

  • What if you use /favicon_urbana.png?v=1? Just wanted to rule out the browser cache. – cchen Apr 17 at 20:52
  • I just tried your suggestion and unfortunately that did not have any effect. – Chris Howell Apr 17 at 21:04
0

If its not a browser cache issue perhaps you should try modifying it with a hook called later namely THEMENAME_preprocess_html

function THEMENAME_preprocess_html(array &$variables) {
  $test = "";
  $variables["page"]["#attached"]["html_head_link"][0][0] =
    array(
      'rel' => 'shortcut icon',
      'href' => '/themes/fu/favicon_urbana.png',
      'type' => 'image/png',
    );
}
  • I tried this as you suggested and this still did not alter the favicon in the tab. – Chris Howell Apr 17 at 21:04
  • Some browser take some time before loading a new favicon, sometimes it might take a clear cache and a few page refreshes before seeing a new icon. Try with another installed browser. – GiorgosK Apr 17 at 21:06
  • I did that as well. Usually work with chrome and go to firefox if I want a 'clean' browser. – Chris Howell Apr 17 at 21:08
  • Try changing temporarily theme and see if the current favicon is provided by your theme. Also see if metatag is overriding favicon. – GiorgosK Apr 17 at 21:16
0

You can change the favicon with MYTHEME_page_attachment_alter.
First you should remove the favicon added by the theme with. unset($attachments['#attached']['html_head_link'][0]); as mentioned here then add you favicon here is a code sample works for me.

/**
 * Implements hook_page_attachments_alter().
 */
function MYTHEME_page_attachments_alter(array &$attachments) {
  // Remove the default favicon.
  unset($attachments['#attached']['html_head_link'][0]);
  // add new favicon.
  $attachments['#attached']['html_head_link'][][] = array(
    'rel' => 'shortcut icon',
    'href' => '/themes/fu/favicon_urbana.png',
    'type' => 'image/png',
  );
}

Result:
enter image description here

  • I have tried this as well. The Kint::dump($attachments) clearly shows that the new href is new favicon. I do not see the <link rel="shortcut icon" ...> in the code inspector though. – Chris Howell Apr 18 at 14:35
  • Did check if there is any other module / theme implement hook_page_attachments_alter and remove your new favicon? – berramou Apr 18 at 15:01
  • Thanks for that suggestion. I did see that the metatag_favicon.module does implement this. I uninstalled this module and this did not help either. I also moved the hook_page_attachments_alter to my module file and while the attachment's href shows the new favicon, the tab still isn't updating with the new image. – Chris Howell Apr 18 at 16:16
  • Should I be seeing a <link rel="shortcut icon" href="... /> in the <head></head> section? I am not seeing one at all. Even when I comment out the alter hook. Do we have to have the metatag module enabled? – Chris Howell Apr 18 at 17:03
  • Yes you should see <link rel="shortcut icon" href=".."/> if there is no hook change it you should see the favicon of active theme – berramou Apr 18 at 17:25
0

It turns out I was missing

<head-placeholder token="{{ placeholder_token|raw }}">

in the head section of html.html.twig. Once I put that in there, the tags appeared and the favicon gets updated properly.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.