WordPressには管理画面からファビコン（サイトアイコン）を設定する機能があり、HTMLを直接編集しなくても一通りのファビコンを反映できます。
その設定手順と推奨サイズ、管理画面での設定だけでは不十分なケースについて説明します。
ファビコンの作り方やHTMLでの詳細な設定方法
WordPress管理画面からのサイトアイコン設定手順
WordPressでは管理画面からファビコンの設定ができます。登録するだけで一通りのファビコンが表示されるので簡単です。
- 管理画面の「外観」＞「カスタマイズ」を開く
- 「サイト基本情報」を選択する
- 「サイトアイコンを選択」ボタンからメディアライブラリを開き、画像をアップロードする
- 保存・公開して反映を確認する
推奨サイズ
広告
WordPressのサイトアイコンは、512×512px以上の正方形画像が推奨されています。実際にブラウザタブなどに表示される際は16px程度まで縮小されるため、通常のファビコンと同様にシンプルで視認性の高いデザインにしておくことが大切です。
管理画面設定だけでは反映されないケース
管理画面から設定すると内部的に複数サイズの画像が自動生成されますが、テーマやキャッシュ環境によってはブラウザタブに反映されないことがあります。
この場合は、HTMLに直接 <link> タグを追加する方法も併用します。具体的な記述方法は「ファビコン(favicon)の作り方とHTML設定方法」にまとめています。
またfavicon.icoとapple-touch-icon.pngのどちらか一方しか更新していないと、ブラウザタブとスマホのホーム画面で異なるアイコンが表示されたままになることがあります。ファビコンを変更した際は、両方のファイルを更新できているか確認しましょう。
それでも表示されない場合
画像パスの誤り、BASIC認証、キャッシュの影響など、管理画面設定とは別の原因が考えられます。
詳しい確認手順はこちら
広告
