Faviconファビコンとは、ブラウザーのタイトルの部分に表示されるアイコンのことです。
ブランディングには欠かせないシンボルです。
ファビコン変更については、すでに多数のブログやサイトで紹介をされていましたが、どれもうまくいきませんでした。
自分なりに解決方法を考え、1時間後にやっと変更ができたので、今回はその紹介します。
【1】まずファビコンを作成する
作成に一番いい方法は、ウェブサイト上ですべて完結することです。
非常に優れたファビコン作成サイトを見つけましたので、紹介します。
使い方は、簡単でしたのでここで説明する必要はないでしょう。
Favicon.com - custom icons for your website!
- [ このページを訳す ]create favicon.ico files to customize the marketing logo in Internet Explorer's favorites/bookmarks using our free online java icon editor.
www.favicon.com/
【2】作成したファビコンをgoogle siteにアップする。
ファビコンの拡張子は.icoのため、残念ながらBloggerではアップすることができません。
そこでgoogle siteというサービスを利用して、ファビコンをアップロードします。
適当にサイトを作成し、「挿入」ボタンをクリックして、ファビコンを挿入します。
挿入後、表示されたファビコンにマウスカーソルを合わせて、”画像のプロパティ”を確認すれば、
ファビコンのURLがわかります。
※ファビコンの名称を、favicon.ico以外に変更してください。例)favicon2.icoなど
favicon.icoのままだと、google siteのファビコンと対立してアップロードできない場合があります。
【3】Bloggerにファビコンの表示を指定する
Bloggerの「レイアウト」→「htmlの編集」にある”テンプレートの編集”内にある の真下に、以下のHtmlを挿入して保存します。
※href=以下は、実際のファビコンのURLに変更してください。
///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
<link rel="icon" href="http://example.com/favicon.ico" type="image/x-icon" />
<link rel="Shortcut Icon" type="img/x-icon" href="http://example.com/favicon.ico" />
///////////////////////////////////////////////////////////
以上で、ファビコンが変更されていると思います。
この件に関する質問などは、一切受け付けておりません。
くわしくは、他のサイトでご確認ください。