田村カツオ田村カツオ

こんにちわ。「ファビコン」と聞いて何故かいつも「ファミコン」を思い出す田村カツオです。

さて、今回はファビコンなるものの作り方について解説します。

自分だけのファビコンがあるかないかでは、サイトのイメージにかなり差が出てきます。ファビコンに使うべき画像サイズや表示されない時の対処法等をお伝えしますが、あまり難しくはないのでしっかりとマスターしてしまいましょう!

尚ここでは賢威7の場合を中心に説明していきますが、他のテンプレートの場合でも応用可能ですので、ぜひ参考にしてくださいね。

田村カツオのメルマガ登録ボタン

メルマガ(無料)をやっています。興味のある方はどうぞ!(^^;)

賢威7でファビコンを無料で作成しよう!【動画】

田村カツオYouTube公式チャンネルではファビコンの作り方を動画で説明しています。文章での説明だといまいち良くわからないという方は是非ご覧になってみて下さいね(^_-)

チャンネル登録はこちらから!

YouTubeチャンネル登録ボタン

ファビコンとは?

ファビコンとは?

まず、念の為ファビコンとは何なのかについて簡単にご説明しておきます。(もう既にご存知な場合は先に進んで下さい^^;)

ファビコンとはそのサイトのシンボルです。例えばブックマークしたサイトの一覧を見ていただくと下記の画像の様に左側にアイコンが出ているがわかりますね。そのアイコンがファビコンです。

ファビコンとは

ファビコンはブックマークしたサイトの一覧を開いた時以外にも、ブラウザのタブ等にも表示されます。何も設定しないでデフォルトのままでいると味気ないものになってしまいます。

ファビコンを自分独自のものにするのにはあまり手間はかかりませんので、ぜひオリジナルファビコンを無料で作成して使用しましょう!

賢威7でファビコンを無料作成する方法!

まずは画像を作る。

まず、ファビコンとして使用する画像を作ります。賢威7の場合、512×512pxの正方形の画像を用意する必要があります。

どんな画像にするかは人それぞれです。そのサイトで使っているキャラクターの顔にしたり、好きな文字にしたり。このサイトの場合は「カ」というカタカナ1文字にしてあります。カツオの「カ」ですね。

ペイントで作っても良いし、PhotoScapeで作ってもいいでしょう。無料素材の写真何かを使っても良いと思います。ファビコンは表示がどうしても小さくなるのであまり複雑なデザインにするべきではありません。シンプルなものを作りましょう。

 

とりあえず、ここではサンプルとしてこのような画像を作ってみました。

実際の大きさは512×512です。

作った画像をファビコンとして設定する。

①賢威7でファビコンを設定するにはダッシュボード画面左側のメニュー一覧から「外観」→「カスタマイズ」と進みます。

ファビコンを無料で作成!


②すると次の画面ではメニュー一覧が出てきますので、そこから「サイト基本情報」を選びます。

ファビコンを無料で作ろう!


③するとサイトアイコンを選択する画面になりますので、そこで先ほど作った画像を選択します。「保存して公開」ボタンを押すのをお忘れなく!


④無事、ファビコンが設定できました。

ファビコン設定前
ファビコン設定前

ファビコン設定後
ファビコン設定後

他のテンプレートの場合。

前章で述べたように賢威7では簡単にファビコンを設定できる機能がついていますが、他のテンプレートを使用していてファビコンを無料で作成して設定したい場合はどうすればいいのでしょうか?

まず、そのテンプレートに賢威7の機能に類似する機能がついていればもちろんそれを利用するべきですが、そうではない場合はプラグインFavicon Rotatorを使用するのがおすすめです。

 

ダッシュボード画面左のメニュー一覧から「外観」→「テーマの編集」と進み、「header.php」に加筆することでもファビコンは設定出来ますが、各ブラウザによって画像の大きさを変えなければいけない等、正直面倒な部分もあります。

やはり、手っ取り早いのはプラグインFavicon Rotatorを使用する事ですね。

イッヌイッヌ

ワードプレスブログなら、困った時はプラグイン!

田村カツオ田村カツオ

確かにプラグインは便利なんだけど、プラグインの入れ過ぎも不具合を引き起こしたりサイトが重くなったりする原因にもなる事もあるから、程々にね。

ファビコンが表示されない時の対処法。

ファビコンの設定は決して複雑なものではありません。万が一ファビコンを設定したのに表示されないという事になったとしても、落ち着いて基本的なところを確認していきましょう。

画像のサイズを確認する。

画像のサイズは正しく設定できていますか?例えば賢威7の場合、前述した方法でファビコンを設定するのであれば画像サイズは「512×512px」以上である必要があります。

もう一度画像のサイズを確認してみましょう。

キャッシュを削除する。

ファビコンが表示されない時はファビコンを設定する以前のファビコンがブラウザによってキャッシュされている可能性が考えられます。キャッシュを削除してみましょう。

Google Chromeの場合は右上の「︙」をクリックし「その他のツール」→「閲覧履歴を消去」からキャッシュを削除出来る画面に飛ぶ事が出来ます。

キャッシュを削除しよう。

他のブラウザの場合でも、設定画面からキャッシュを削除出来るというのは大きくは変わりませんので、やってみて下さい。

終わりに。

ファビコンは小さな画像ですが、サイトの信頼性やオリジナリティに大きく関係する要素です。簡単に設定できますので、あなた独自のファビコンを無料で作って、あなたのサイトをキャッチーにしていきましょう!

======================

現在、メルマガ登録者限定で初心者がブログアフィリエイトで月収10万円以上稼ぎ、インターネット上に資産を築く為のオリジナルテキストをプレゼント中です!

自分の部屋でPC1台で楽しく稼いでみたいという人は是非ご覧になってみて下さいね(^_-)

※僕のメルマガは無料で読んで頂く事が出来ますし、必要ないと感じたらいつでもボタン1つで解除が出来ます。