パソコン操作

今や必須!ファビコンの画像を作成して設定する簡単なやり方

ららです。
 

私のこのブログには、
ずいぶん前からファビコンが設置されているのですが、
変更してみようと思って、やり方を思い出していました。
 

あ、ファビコンていうのは、こういうやつです。

お気に入りにいれたときの、これ

 

ブラウザで表示した時のこれ

 

たかが小さな画像ひとつですけど、
これがあると、かなり印象がちがいます。
実際につけてみると、実感しますから^^
 

では、ファビコン設置のやり方をご紹介します。
 

ファビコン用の画像を用意する

アバター画像を、そのままファビコンに使う場合も多いですね。
私も最初はそうしてました。
そのときは、こういうアバターの顔の画像を用意します。

 

でも、小さく縮めてしまうので、
誰の顔なんだかわからなくなることもあります。
なので、アバター用に、画像を作ってもいいですよね。
私は、こんな画像を作ってみました。

今回は、これを使いたいと思います。
 

アイコン用のファイル形式にする

アイコン用のファイル形式は、拡張子が ICO です。
これに変換します。
 

変換は、このサイトでやってくれます。
ファビコンを作ろう

画像を指定して、変換してもらって、
ダウンロードします。
 

私のパソコンにも、拡張子が ICO の、
こんなファイルができあがりました。

 

アイコンの画像をアップロードする

できあがった、アイコン画像(拡張子が ico の画像)を、
サーバーにアップロードします。
 

ワードプレスであれば、
いつものように、メディアのアップロードをやればOKです。

赤い枠のところが、この画像のURLです。
これをどこかに控えておいてください。
 

サイトの中で、ファビコン画像を指定する

ファビコンを表示させたいブログなり、サイトなりの
<HEAD> ~~ </HEAD> の中に、
以下の一文を追加します。

<link rel="shortcut icon" href="ファビコン画像の場所(URL)" />
 

たとえば、私のブログ(WP+エフィシェント)であれば、
テーマ編集 → ヘッダー から、

 

コードのなかほど、
link rel と何行も書いてある場所がありますので、
そこを見つけて、同じように書き込みます。

 

1カラムのキラーページであれば、
<HEAD> ~~ </HEAD> の中のどこでもいいので、
書き込みます。

 

結果はこうです。
キラーページの方は、ちゃんと表示されましたが、
ワードプレスの方は、古いアイコンのままです。

 

ブラウザを変えたら、ちゃんと表示されました。

 

調べてみると、IEは、
ファビコンがうまく表示されないことが多いらしいです。
 

クッキーや履歴などを削除してからもう一度試して、
それでもダメなら諦めなさいと書いてありました。
 

まぁ、こういうところに集中しすぎるのもよくないので、
ほどほどにファビコンを楽しみましょう~ ヽ(´▽`;)ノ

ABOUT ME
らら
らら
ららです。2人の子供がいる40代の主婦です。コツコツとアフィリエイトにチャレンジし、月6桁の目標を達成することができました。このブログでは、同じ目標を持つあなたに、ららの知識やアドバイスをお伝えしています。お問い合わせはいつでも受け付けていますのでお気軽にどうぞ。
無料レポートが書けなくてもメルマガを始める方法
HAPPYな仕組みダウンロード

「メルマガを始めてみたいけど読者を集めるの大変そう…」
そんなあなたへ。努力しなくっても読者さんが集まる、目からウロコの方法を伝授します(無料です)。

>>レポートをダウンロード!

 

ららが稼げるようになった教材「アンリミテッドアフィリエイト」が9月30日で大幅値上げ!ららのサポート付で手に入れるなら今がチャンスです♪

メールはお気軽に

ららにメールあなたからのメールはいつでも大歓迎です。
お問い合わせはこちらのフォームからどうぞ。
48時間以内に愛をこめてお返事をさせていただいています。

 

ららにメールする

この記事で使われているイラストは…

この記事で使用されているイラストの大部分は、こちらのイラスト集のものを使用しております。

COMMENT

メールアドレスが公開されることはありません。