ファビコン(favicon)の作成
正方形のPNG形式の画像を作成して、icon変換するサイトでfavicon.icoを作成してください。【icon変換するサイト】
・アイコン(icon)変換ツール - Favicon Converter
・Favicon Japan!! -16×16の小宇宙ファビコン-
・ファビコン作成。favicon.ico 無料で透過マルチアイコンが作れます。
・X-Icon Editor
いろいろありますが、X-Icon Editorが一番簡単だと思います。
参考:1つのPNG画像から、ファビコン(favicon)を簡単に作る方法 【マルチアイコン】
favicon.icoのアップロード
私の場合は、ファイルはDropboxにおいてそこのURLを指定しています。参考:
・DropboxにJavascriptファイルを置く方法
アメブロはico形式の画像ファイルをアップロードできないようなので、適当なところに置く必要があります。
HTMLタグの設置
<link rel="shortcut icon" href="ファイルを置いているURL/favicon.ico" />
<link href="ファイルを置いているURL/favicon.ico" rel="icon" type="image/x-icon" />
フリープラグインかフリースペースに上記を配置してくださいもちろん、「ファイルを置いているURL」の部分は書き換えてください。favicon.icoという名前でアップロードしてることを想定しています。
設置したのに表示されない?!
以下のブラウザで確認しました。× IE9
× IE11
○ Chrome
○ Safari
○ FireFox
○ Opera
○ SeaMonkey
おそらくIE系のブラウザでは無理だと思います。
<link rel="shortcut icon" href="http://stat100.ameba.jp/common_style/img/favicon.ico" />
理由は、新スキンの場合?はすでにheadタグで上記のようにfavicon.icoの定義がされているからです。フリープラグインやフリースペース(headタグ出ないところ)に定義して反映されることのほうがありがたい現象だと思います。フリープラグインやフリースペースはBodyタグの中になります。
スポンサーリンク