How to add iOS & fav icons to the theme?

by

I want to add iOs, Android and favourite icons to the website. Generally I udnerstand how they shold be implomented: link files in the head section and you good to go, however there are many lines (for both devices and favico makes more than 10), so I do not know how to add them correctly:

  1. Somehow enqueue them in the functions.php?
  2. Some people on the internet mention creating a Site-Specific Snippets Plugin?
  3. Use some sort of plugin for that (not big fan of this idea)?
  4. Just add the links to header.php (that is what codex suggests).

Just in case, the code:

<link rel="shortcut icon" href="https://wordpress.stackexchange.com/favicon.ico" type="image/x-icon" />
<link rel="apple-touch-icon" href="http://wordpress.stackexchange.com/apple-touch-icon.png" />
<link rel="apple-touch-icon" sizes="57x57" href="http://wordpress.stackexchange.com/apple-touch-icon-57x57.png" />
<link rel="apple-touch-icon" sizes="72x72" href="http://wordpress.stackexchange.com/apple-touch-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="76x76" href="http://wordpress.stackexchange.com/apple-touch-icon-76x76.png" />
<link rel="apple-touch-icon" sizes="114x114" href="http://wordpress.stackexchange.com/apple-touch-icon-114x114.png" />
<link rel="apple-touch-icon" sizes="120x120" href="http://wordpress.stackexchange.com/apple-touch-icon-120x120.png" />
<link rel="apple-touch-icon" sizes="144x144" href="http://wordpress.stackexchange.com/apple-touch-icon-144x144.png" />
<link rel="apple-touch-icon" sizes="152x152" href="http://wordpress.stackexchange.com/apple-touch-icon-152x152.png" />

2 Answers
2

Hook into wp_head in your functions.php file. 

add_action('wp_head', 'add_your_stuff');
function add_your_stuff() {
    ?>
    <link rel="shortcut icon" href="https://wordpress.stackexchange.com/questions/157869/<?php echo get_stylesheet_directory_uri();?>/favicon.ico" type="image/x-icon" />
    <link rel="apple-touch-icon" href="<?php echo get_stylesheet_directory_uri();?>/apple-touch-icon.png" />
    <link rel="apple-touch-icon" sizes="57x57" href="<?php echo get_stylesheet_directory_uri();?>/apple-touch-icon-57x57.png" />
    <link rel="apple-touch-icon" sizes="72x72" href="<?php echo get_stylesheet_directory_uri();?>/apple-touch-icon-72x72.png" />
    <link rel="apple-touch-icon" sizes="76x76" href="<?php echo get_stylesheet_directory_uri();?>/apple-touch-icon-76x76.png" />
    <link rel="apple-touch-icon" sizes="114x114" href="<?php echo get_stylesheet_directory_uri();?>/apple-touch-icon-114x114.png" />
    <link rel="apple-touch-icon" sizes="120x120" href="<?php echo get_stylesheet_directory_uri();?>/apple-touch-icon-120x120.png" />
    <link rel="apple-touch-icon" sizes="144x144" href="<?php echo get_stylesheet_directory_uri();?>/apple-touch-icon-144x144.png" />
    <link rel="apple-touch-icon" sizes="152x152" href="<?php echo get_stylesheet_directory_uri();?>/apple-touch-icon-152x152.png" />
    <?php
}

Leave a Comment