私の使っているブログはGoogleのBloggerを使っているのですが、標準ですとURLを入れる欄の所へ「
」←このようなアイコンが表示されますよね!
このアイコンを独自のアイコンへ変更しようと思ったわけですが、このアイコンの変更をするのに「Favicon」って言うものを指定するみたいです。
まずは、「Favicon」をWikiで検索してみました。
| Favicon=Favicon(ファビコン)はウェブサイトやウェブページに関連付けられたアイコンのことである。 |
↑ と言う事みたいです。
そこで、普通のWebページなら、16x16ドットのアイコンファイルを作って「index.html」ファイルが置いてある場所と同じフォルダーへ「favicon.ico」って言うファイル名を付けて置いておけばいいようですが、私の知る限りでは、Bloggerは、そのような場所へファイルをアップロード出来ないです。orz
いろいろ考えた結果、このBloggerへ目立たない所へJPEGファイルを置いて、それをBloggerのテンプレートを修正して強引に読み込んでやらば出来るかなーと思って実験してみました。
(「
」←ここへ貼ったのを使ってみます。
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNByCwJDjlBfcQ5NNij57f3D86KKsoE2MKJN_749xa7KbIWmxK8Ie7d4I_lFw6qTOgOHIvbjCGGlDAVXNgMcOPVGSUjFWHJTslIeKYmqntJiT4Oamh3brT81Flbj0gKn2aMIhA0lPHa6k/ )
①Bloggerへログインして「カスタマイズ」⇒「レイアウト」⇒「HTMLの編集」を選びます。
(念のため、バックアップを取ってから行ってね!)
②HTML文の<head>・・・</head>の間へ次のように入れます。
<head> : : <link href='画像ファイルのURL' type="image/jpeg" rel='shortcut icon'/> </head> |
↑ このような行を追記してやればOKです。
<head> : : <link href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNByCwJDjlBfcQ5NNij57f3D86KKsoE2MKJN_749xa7KbIWmxK8Ie7d4I_lFw6qTOgOHIvbjCGGlDAVXNgMcOPVGSUjFWHJTslIeKYmqntJiT4Oamh3brT81Flbj0gKn2aMIhA0lPHa6k/' type='image/jpeg' rel='shortcut icon'/> </head> |
↑ 実際にBloggerへ一旦投稿した後にURLを調べて貼ってみたのが、こんな感じです。
↓
<head> : : <link href='画像ファイルのURL' rel='shortcut icon'/> </head> |
↑ 普通のアイコンファイル(.ico)が設置可能なら、↑ こんな感じです。
(「 type='image/jpeg'」←が必要ないです。)
③修正が完了したら、プレビューで表示して確かめてみます。
④プレビューでうまく成功しましたら、保存して完了です。
================================================
※現在、↑ ここのBloggerのURLの横のアイコンは、こんなアイコンになっています。
※今、知ったのですが、IE7では、.icoファイル以外のファイルは開けないようなのです。
次のようにすると、いいようです。(FireFoxなどは、アニメーションGIFでも対応)
| <link rel="shortcut icon" href="ファビコンまでのパス/favicon.ico"> <link rel="icon" href="ファビコンまでのパス" type="image/gif" /> |
因みに、アイコンファイルの作成には、フリーソフトの「アイコンウィザード」を使用しています。
JPEGなどの画像ファイルを いろんなサイズのアイコンファイルへ変換してくれます。
Faviconファイル用には、16x16ピクセルと32x32ピクセルのサイズで256色に原色して作成すればいいみたいです。
※Googleアカウントが無い方は、コメントを入れる時に「名前/URL」を選んで下さいね^^


