ワードプレスで管理画面やログイン画面にもファビコン・サイトアイコンを設定する方法
2020年12月10日2020年12月28日Tweetこの記事は最終更新から5年以上経過しています。内容が古くなっている可能性があります。ワードプレスで、ファビコンや各種サイトアイコンを設定する際、いつもheader.phpに直書きしてしまいたくなってしまいます。
サイトアイコンの設置って最終段階で行う事が多いため、はっきり言って面倒くさくなってるんですね。まあ、別に間違いではありませんし大概の場合はそれでOKです。
ただ、header.phpに記述しても管理画面やログイン画面では読み込んでくれないんですね。仕事では結構ツツかれる事の多い部分です。
そこで今回は、ログイン画面や管理画面でも表示されるようにファビコンやサイトアイコンを設定する方法です。
～ 目次 ～
wp_head・login_head・admin_headの３つのフックに登録する
通常の閲覧時・ログイン画面・管理画面のすべてでHTMLのhead内に共通コードを出力するには、やはりフックを利用するのが一番スマートです。
それぞれ wp_head・login_head・admin_head の３つのフックに登録しましょう。
サンプルコード
実際の記述は下のような感じになります。
PHP /* ファビコン・サイトアイコン追加 */ function add_site_icon() { echo <<<EOC <link rel="icon" href="favicon.ico"> <link rel="icon" href="siteicon.png"> <link rel="apple-touch-icon-precomposed" href="apple-touch-icon.png"> EOC; } add_action('admin_head', 'add_site_icon'); add_action('login_head', 'add_site_icon'); add_action('wp_head', 'add_site_icon'); 1234567891011 /* ファビコン・サイトアイコン追加 */function add_site_icon() { echo <<<EOC <link rel="icon" href="favicon.ico"> <link rel="icon" href="siteicon.png"> <link rel="apple-touch-icon-precomposed" href="apple-touch-icon.png">EOC;}add_action('admin_head', 'add_site_icon');add_action('login_head', 'add_site_icon');add_action('wp_head', 'add_site_icon');４～６行目を実際に挿入するコードに置き換えれば、コピーしてそのまま使用できます。
記述するのは使用中のテーマのfuncitons.phpでOKです。
最後に
どうでしょうか。ログイン画面や管理画面でもファビコンちゃんが表示されたでしょうか。まあ、ちょっとした”こだわり”の部分なのですけどね。。
たくさんの記事編集者さんが居るサイトなどでは、管理画面やログイン画面もキレイにカスタマイズして、どこにもWordPressなんて表示されていない場合もあります。そんな時、ファビコンがワードプレスのデフォルトのものだとちょっと残念ですものね。
個人でブログを書いている方も、やってみると気分が上がる！かもしれません。
この記事は2020年12月10日に公開されました。
Tweet