この記事では、WordPressのファビコン設定プラグイン『Favicon by RealFaviconGenerator』の使い方について解説します。

たまにWebサイトで、タイトルバーに表記されるアイコンがオリジナルな場合ががありますのよね。
下図のようなものを、ファビコンと言います。

Favicon by RealFaviconGenerator010

設定をする際、PCだけでなくスマホ用も用意したりと複数用意する画像を必要がありめんどくさくて後回しにして、そのまま未設定のまま・・・。

という事は経験ないでしょうか?

そんなあなたにお勧めしたいのが、今回紹介するプラグイン『Favicon by RealFaviconGenerator』なんです。
このプラグインを使えば、画像を用意するだけで、簡単にファビコンの設定が出来てしまいます。

運営者 佐藤
併せてファビコンの役割と必要性、そして簡単な設定方法について解説します。
是非あなたのサイトにも取り入れてみてくださいね!
スポンサーリンク

ファビコンの役割と必要性

ファビコンは、英語でFaviconと書き、Facvorite icon、お気に入りのアイコンという意味で、もともとInternet Explorer(以下IE)の独自機能で、お気に入り登録をすると表示されるものでした。

あるとオシャレ程度で、もとはそこまで重要なものではなかったようです。

しかし、最近ではGoogle Crome等IE以外のブラウザでもお気に入りの登録に関係なく表示されるようになりました。

また、お気に入り登録時のアイコンだけではなく、デスクトップへのショートカットアイコンとしても反映され数あるサイトの中からあなたのサイトを識別するための視覚的な手掛かりになるようになりました。

 

このアイコン=あなたのサイトと紐づけば、より読者さんも定着しやすくなるきっかけとなりえます。

 

以上の事から、これからサイト独自のファビコンを持つことは、ファインダビリティ(findability:情報の見つけやすさ)の助けに繋がるとても重要な要素になりそうです。

特にお金のかかるものでもありませんし、簡単な導入でこれだけの恩恵をえられるのであればここはひとつ、やってみましょう!

WordPressプラグイン『Favicon by RealFaviconGenerator』のインストール方法

Favicon by RealFaviconGeneratorプラグインをインストールにするには、【ダッシュボード】⇒【プラグイン】⇒新規追加で表示される画面の検索ボックスで【Favicon by RealFaviconGenerator】と検索すると出てきます。

【Favicon by RealFaviconGenerator】プラグインが表示されたら、【いますぐインストール】と書かれた箇所をクリックしてインストールして下さい。
有効化を忘れずに行って下さい。

 Favicon by RealFaviconGeneratorプラグインアイコン

利用するための準備はこれで完了です。

Favicon by RealFaviconGenerator』の使い方
画像さえ用意すればすぐに設定できる!

ここからは、『 Favicon by RealFaviconGenerator』の使い方を解説します。
インストールが完了したら、【ダッシュボード】⇒【設定】⇒【Favicon】から設定が出来ます。

Favicon by RealFaviconGenerator02

設定ページが開いたら、まずはをクリックしてファビコンに設定した画像を決めます。

選択する画像は260×260ピクセル以上のものとなりますので注意してください。

①まずは、【Select from the Media Library】ボタンをクリックして画像を選択してください。

②次に、【Ganerate favicon】ボタンをクリックします。

Favicon by RealFaviconGenerator03

そうすると、ページが切り替わり、詳細設定が出来るようになります。

iOS用のショートカットアイコン

Favicon by RealFaviconGenerator04

Windows8用のスタート画面でのタイル表示のさせ方

Favicon by RealFaviconGenerator05

ファビコン画像の選択

右下に行くほど、画像の圧縮率が高くなり、が劣化してゆきます。

左の上オリジナルに一番近いものを選ぶといいでしょう。

Favicon by RealFaviconGenerator06

 

設定が終わったら、Favicon by RealFaviconGenerator07をクリックします。

 

Favicon by RealFaviconGenerator08

この様な画像が表示されれば、完了です!

 

早速見てみましょう・・・

Favicon by RealFaviconGenerator09

み・・・・見えないですね(笑)

何度でも設定できるので、納得が出来るまでやってみてください。

まとめ

あまり重要視していなかったファビコンですが、最近は視覚的な観点からその役割は大きくなりつつあるようです。

特に難しい事をせずに設置できますし、画像を用意したら5分でも時間をとって是非設定にチャレンジしてみてください。

尚、フリー素材をお探しでしたら以下の記事が役立ちますよ!

スポンサーリンク