【WordPress】サイトアイコン(ファビコン)の設定の仕方

サイトアイコン(ファビコン)とは

 ブログの見た目を整えるために、 WordPressのサイトアイコン(ファビコン)を設定しました。 ブラウザのタブや検索結果に表示される小さな画像で、 サイトの認識性を高める役割があるそうです。

・

・

・

推奨される画像サイズ

  • 512×512px以上の正方形
  • PNG形式

 WordPress側で自動で必要なサイズを生成してくれるため、元画像は大きめの正方形を用意しておくと良いです。

※画像形式やサイズは推奨がありますが、画像が大きければ設定時に、どの範囲を使うかというところで表示範囲の選択調整(トリミング)が可能です。

・

・

・

設定手順

 WordPressでは、管理画面から簡単に設定できます。

  1. 管理画面にログイン
  2. 左メニュー → 外観
  3. カスタマイズ を開く
  4. サイト基本情報 を選択
  5. 「サイトアイコン」から画像をアップロード
  6. 必要に応じてトリミング → 公開

確認場所(赤枠部分)

WordPress『管理画面』より『外観』→『カスタマイズ』の順でクリックします。

・・・

カスタマイズ画面の左メニュー『サイト基本情報』をクリックします。

・・・

『サイトアイコン』の項目に『画像を変更』、初めての設定(未設定)の場合だと『サイトアイコンを選択』という表示がありますので、そちらをクリックします。

・・・

↓画像選択後の切り抜き画面で、範囲を選択→『画像切り抜き』

・・・

『サイトアイコン』部分の画像が変更されてるか確認できます。→『公開』を押して保存します。

・

・

・

反映されないときのチェック

 編集中のファビコンが更新されない場合は、

  • ブラウザのキャッシュを削除
  • Cocoonの高速化キャッシュを削除
  • CDN(Cloudflareなど)を使用している場合はキャッシュパージ

キャッシュが残っていると、古い画像が表示されることがあります。(殆どはブラウザキャッシュで直ります。)

・

・

・

まとめ

 サイトアイコンは小さな部分ですが、 ブログの印象を整えるうえで大切な要素です。 WordPressでは簡単に設定できるため、 ブログのデザインを見直すタイミングで設定しておくと安心です。

・

・

・

タイトルとURLをコピーしました