WordPress Logo

最近のWordPressでは「サイトアイコン」や埋め込みコンテンツの「Embed」機能、「絵文字対応」など、様々な新しい要素が取り入れられています。

今日は、その『サイトアイコン』を設定した際に自動で <head>〜</head> 内に挿入される favicon 系のメタタグを無効にするテクニックを紹介します。

そもそも『埋め込みコンテンツ』とは、記事の投稿・編集画面でEmbedに対応したサイトのURLを記述すると表示される以下のようなボックス要素のこと。
ここではサンプルとして当ブログ内のURLを入力しましたが、大手サイトではYouTubeなどがEmbedに対応しています。

株式会社オンズは［株式会社 十一屋］に社名変更します。

上記ボックス内、サイトタイトルの横にアイコンが表示されていますが、このアイコンはWordPressのダッシュボード左側のメニューより、『外観』→『カスタマイズ』→『サイト基本情報』→『サイトアイコン』で設定可能。

  1. 外観
  2. カスタマイズ
  3. サイト基本情報
  4. サイトアイコン

この『サイトアイコン』を設定すると <head>〜</head> 内に以下のように favicon 関係のメタタグが挿入されます。

<link rel="icon" href="https://on-ze.com/cropped-icon-512-32x32.png" sizes="32x32" />
<link rel="icon" href="https://on-ze.com/cropped-icon-512-192x192.png" sizes="192x192" />
<link rel="apple-touch-icon-precomposed" href="https://on-ze.com/cropped-icon-512-180x180.png" />

初心者の方にとっては非常にありがたい機能ですが、icon系のタグを直接テーマファイルに記述している場合は重複してしまうので逆に『有難迷惑』となってしまします。

埋め込みコンテンツ表示の際のアイコン画像は『サイトアイコン』機能で設定した画像に依存しているので、この機能を保ちつつ、ヘッダーに挿入されるicon系のタグだけを無効化する方法、それが下記のシンプルなコードです。

remove_action('wp_head', 'wp_site_icon', 99);

これをテーマファイル『functions.php』内の任意の場所に記述します。

今後の動向として、ブログ運営者にとってEmbed対応は必須の要素となることが予想されます。

サイトアイコンは非常に些細な要素ですが、こうした細部にも拘ることでブランド価値が高まります。
面倒だからと怠らずに、ちょっとした手間を加えてみてはいかがでしょうか。