Skip to content

Instantly share code, notes, and snippets.

@ThatGuyCND
Last active March 18, 2016 23:56
Show Gist options
  • Save ThatGuyCND/1e13b95318a4194812e5 to your computer and use it in GitHub Desktop.
Save ThatGuyCND/1e13b95318a4194812e5 to your computer and use it in GitHub Desktop.
Implements HOOK_html_head_alter() in the theme so that output from http://realfavicongenerator.net/ can be downloaded, extracted into the theme's assets folder. http://www.drupalcontrib.org/api/drupal/drupal!core!modules!system!system.api.php/function/hook_html_head_alter/8
<?php
/**
* Implements hook_html_head_alter().
*
* @param array $head_elements
*/
function THEME_html_head_alter(&$head_elements) {
// Loop through $head_elements array, find link tag that matches core default
// favicon implementaiton override meta data to point to new iconography file.
foreach ($head_elements as $key => $element) {
if ( 0 === strpos($key, 'drupal_add_html_head_link:shortcut icon:')
&& !empty($element['#attributes']['href'])
&& 'shortcut icon' === $element['#attributes']['rel']
) {
// Make sure to use a file that actually exists!
$favicon_path = drupal_get_path('theme', 'THEMENAME') . '/assets/favicons/favicon.ico';
$favicon_url = file_create_url($favicon_path);
// If the favicon path came from a user-provided setting, we would also need drupal_strip_dangerous_protocols().
$element['#attributes']['href'] = $favicon_url;
$element['#attributes']['type'] = 'image/vnd.microsoft.icon';
$head_elements[$key] = $element;
}
};
// Create arrays for favicons that follow similar conventions.
$apple_touch_icon_sizes = array(
'57x57',
'60x60',
'72x72',
'76x76',
'114x114',
'120x120',
'144x144',
'152x152',
'180x180'
);
$general_favicon_sizes = array(
'16x16',
'32x32',
'96x96',
'194x194'
);
// Add Apple touch interface icons
foreach ($apple_touch_icon_sizes as $icon_size) {
$head_elements['drupal_add_html_head_link:apple-touch-icon_' . $icon_size] = array(
'#type' => 'html_tag',
'#tag' => 'link',
'#attributes' => array(
'rel' => 'apple-touch-icon',
'sizes' => $icon_size,
'href' => drupal_get_path('theme', 'THEMENAME') . '/assets/favicons/apple-touch-icon-' . $icon_size . '.png'
),
'#weight' => -9999
);
};
// Add fallback for versions of iOS less than version 7
$head_elements['drupal_add_html_head_link:apple-touch-icon-precomposed'] = array(
'#type' => 'html_tag',
'#tag' => 'link',
'#attributes' => array(
'rel' => 'apple-touch-icon-precomposed',
'href' => drupal_get_path('theme', 'THEMENAME') . '/assets/favicons/apple-touch-icon-precomposed.png'
),
'#weight' => -9998
);
$head_elements['drupal_add_html_head_link:apple-touch-icon-fallback'] = array(
'#type' => 'html_tag',
'#tag' => 'link',
'#attributes' => array(
'rel' => 'apple-touch-icon',
'href' => drupal_get_path('theme', 'THEMENAME') . '/assets/favicons/apple-touch-icon.png'
),
'#weight' => -9997
);
// Add Safari browser icon for pinned tabs
$head_elements['drupal_add_html_head_link:safari-pinned-tab'] = array(
'#type' => 'html_tag',
'#tag' => 'link',
'#attributes' => array(
'rel' => 'mask-icon',
'href' => drupal_get_path('theme', 'THEMENAME') . '/assets/favicons/safari-pinned-tab.svg',
'color' => '#018dc7'
),
'#weight' => -9996
);
// Add icons for Chrome, Firefox and other browsers
foreach ($general_favicon_sizes as $icon_size) {
$head_elements['drupal_add_html_head_link:favicon_' . $icon_size] = array(
'#type' => 'html_tag',
'#tag' => 'link',
'#attributes' => array(
'rel' => 'icon',
'sizes' => $icon_size,
'type' => 'image/png',
'href' => drupal_get_path('theme', 'THEMENAME') . '/assets/favicons/favicon-' . $icon_size . '.png'
),
'#weight' => -9995
);
};
// Add Android specific link tag for favicon image and meta tag for theme-color.
$head_elements['drupal_add_html_head_link:android-chrome_192x192'] = array(
'#type' => 'html_tag',
'#tag' => 'link',
'#attributes' => array(
'rel' => 'icon',
'sizes' => '192x192',
'type' => 'image/png',
'href' => drupal_get_path('theme', 'THEMENAME') . '/assets/favicons/android-chrome-192x192.png'
),
'#weight' => -9994
);
$head_elements['drupal_add_html_head_meta:android-theme-color'] = array(
'#type' => 'html_tag',
'#tag' => 'meta',
'#attributes' => array(
'name' => 'theme-color',
'content' => '#018dc7'
),
'#weight' => -9993
);
// Add manifest file for future-proofing when web-apps become a _thing_
// recognized by all browsers in all OSs, not just Android.
$head_elements['drupal_add_html_head_link:web-app-manifest'] = array(
'#type' => 'html_tag',
'#tag' => 'link',
'#attributes' => array(
'rel' => 'manifest',
'href' => drupal_get_path('theme', 'THEMENAME') . '/assets/favicons/manifest.json'
),
'#weight' => -9992
);
// Add Microsoft specific favicon images, primarily used for bookmarks and
// tiles added to the system start menu.
$head_elements['drupal_add_html_head_meta:msapplication-TileColor'] = array(
'#type' => 'html_tag',
'#tag' => 'meta',
'#attributes' => array(
'name' => 'msapplication-TileColor',
'content' => '#018dc7'
),
'#weight' => -9991
);
$head_elements['drupal_add_html_head_meta:msapplication-TileImage'] = array(
'#type' => 'html_tag',
'#tag' => 'meta',
'#attributes' => array(
'name' => 'msapplication-TileImage',
'content' => drupal_get_path('theme', 'THEMENAME') . '/assets/favicons/mstile-144x144.png'
),
'#weight' => -9990
);
// Add the config file that tells Windows what to do with the previously
// defined meta tags.
$head_elements['drupal_add_html_head_meta:msapplication-config'] = array(
'#type' => 'html_tag',
'#tag' => 'meta',
'#attributes' => array(
'name' => 'msapplication-config',
'content' => drupal_get_path('theme', 'THEMENAME') . '/assets/favicons/browserconfig.xml'
),
'#weight' => -9989
);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment