2022年2月中旬、ブログのファビコンを今更ながらに設定しました。
2018年、ゼロから始めたWordPressに翻弄され、ずっと後回しになっており、気付いたら5年も経過していました。
先日、「ヘルメットの梵字を使おう!」と急に閃き、試した次第であります。
今回は、ブログのシンボルとも言えるファビコン作成や設定について、なるべく簡単に済ませようと試したレポートとなります。
画像の準備
512 × 512pxサイズの正方形で、拡張子は「png」画像を用意。
画像は自分で撮ったヘルメットの写真を利用。
トリミングして拡張子は普段愛用している「縮小革命」で簡単変換。
<追記>
上記サイズだと、Google検索結果に表示されないかもという情報を見かけ、528×528pxに再設定しました。
詳細については以下の記事にて紹介済みです。
梵字に写り込みがありますが、ファビコン表示なら目立たないかと思いそのままです。
本当は無料の画像編集ソフトで直したのですが、保存しようとしたら「本日の無料域はオーバーしたので金払え」みたいな表示が出て、どうしても保存できなかったのでそのままです。
ファビコンの画像サイズを変更したついでに、梵字の写り込みも修正しました。
画像の余白部分
透過させることがお勧めされており、無料画像編集ソフトで挑戦するも途中で挫折。
ファビコン作成に時間をかけたくなかったため、あえて白背景にすることで良しとしました。
ブログへのファビコン設定
前述の画像さえ用意すれば、WordPressの管理画面から簡単に設定できます。
管理画面の外観
↓
カスタマイズ
↓
サイト基本情報
↓
サイトアイコンを選択
↓
画像を選択し、画像切り抜きボタンを押す
↓
最後に公開ボタンを押して終了
ファビコン設置の確認
①ブログURL後ろに/favicon.icoと入力
例:https://wabisabi-biker.com/favicon.ico
設定したファビコンが表示されます。
②Favicon Generatorで確認
サイト:Favicon Generatorから「Check your favicon」でhttpかhttpsかを選び、テキスト欄にブログURLを入力したら、「Check Favicon」をクリックするだけの手軽さです。
しばらくすると結果が出ますが、WordPressの管理画面から設定できるファビコンは種類が限られているようで、表示されない項目もあります。
とりあえず普段使用しているスマホやPC・iPadでの表示が出来ていたので良しとしました。
ちなみにファビコンの反映までに、長くて数日かかったものもありました。
おわりに
WordPressにファビコン設定をしたレポートでした。
いちばん難しく感じたのは、ファビコンはブログを表すシンボルなので、「これだ!」というデザインが閃くまでに時間がかかってしまいました。
当初は写真を試したりもしましたが、小さな表示に写真は適さず、マークや文字の方が分りやすくてお勧めだと思いました。