ブックマークアイコン(ファビコン)をココログで表示する方法
2014/11/22
ココログでブックマークアイコン(ファビコン)を追加する方法が、
検索であまり出てこなかったこともあって、
簡単に表示ができたので投稿しておきます。
本投稿は以下投稿の詳細ページになります。
もしお時間があれば本編もどうぞ。
はじめに
他の無料ブログで試した際にちょっと苦労したこともあり、
ココログでブックマークアイコン(ファビコン)を表示する方法を投稿しておきます。
概略
アイコン画像の作成
アイコン画像からのicoファイル生成
icoファイルのアップロード
正直ココログの仕様が一番ベーシックで、
簡単だったという事実にちょっとココログを見直してしまいました^^
アイコンファイルの準備
アイコン画像の作成
まずアイコンに割り当てたい画像を用意する必要があります。
画像の作成方法等に関しては以下の投稿を参照願います。
Internet Explorerによる表示を除けば、
16pxサイズのGIFやPNG画像を用意し、
割り当てることで表示が可能なのですが、
多くの方が利用されているであろうInternet Explorerで、
表示されないのではあまり意味がありません。
その為、16px、32px、48pxで作成した画像を、
ico形式のファイルに割り当てることで、
一般的なブラウザで表示されるようになります。
画像のicoファイル化
今回は、以下の画像を利用してicoファイルを生成しています。
この3サイズの画像をico作成サイトにて、icoファイル化を行います。
実際のアイコン(ico)ファイルは以下のファイルです。
テスト確認用などにはご利用いただいて構いません。
ファイルのアップロード
ココログではブログのトップディレクトリに対して、
ファイルマネージャからファイルをアップロードすることができます。
コントロールパネルの表示
管理画面のトップからコントロールパネルをクリックします。
ファイルマネージャの表示
コントロールパネルでファイルタブをクリックします。
ファイルアップロード
ファイルマネージャで以下の3点を確認して、
ファイルをアップロードします。
- 現在のフォルダ: 「ホーム/」と表示されている。
- アップロードするファイルのファイル名が「favicon.ico」になっている。
- 新しいフォルダの作成でフォルダ名が「空白」になっている。
確認して問題がなければ[アップロード]をクリックして、
ファイルのアップロードを行います。
アップロードの確認
アップロードが完了したら、アップロードされたファイル名が、
「favicon.ico」と表示されていることを確認する。
以上で設定は完了です。
ブラウザで確認すると、ファビコンが表示されているはずです。
ブラウザ表示の確認
各社ブラウザの表示を確認すると、
アイコンが表示されています。
以上で設定は終了です。
表示できた方も表示できなかった方もお疲れ様でした。
最近ブログで主流になっているwordpressで作るブログの場合に、
ファビコンの設定がどんな感じで行えるのかなどは、
この投稿でご紹介しています。
関連記事
-
-
ブックマークアイコン(ファビコン)をwordpress.comで表示する方法
Google or AdMax Promotion(it) 禁断の機能がau公式 …
-
-
Seesaa™ブログでHTMLの修正を行う方法
Google or AdMax Promotion(it) 禁断の機能がau公式 …
-
-
無料ブログ各社のGoogle™ Analytics利用可否と方法
Google or AdMax Promotion(it) 禁断の機能がau公式 …
-
-
1投稿(ページ)内に対して複数AdSenseアカウント(別ユーザ)を設定して運営が可能か
Google or AdMax Promotion(it) 禁断の機能がau公式 …
-
-
Google Analyticsアクセス解析をFC2で利用する方法(HTML)
Google or AdMax Promotion(it) 禁断の機能がau公式 …
-
-
Seesaa™ブログでテンプレートをコピー(複製)する方法
Google or AdMax Promotion(it) 禁断の機能がau公式 …
-
-
Google™AdSense広告をSeesaaブログに設置する方法(モバイルは無理)
Google or AdMax Promotion(it) 禁断の機能がau公式 …
-
-
無料ブログサービスのHTMLをEclipseで見やすく修正する(4.3.1 Kepler:日本語)
Google or AdMax Promotion(it) 禁断の機能がau公式 …
-
-
無料ブログサービスのHTMLタグ構造とコンテンツ挿入位置の割り出し方法
Google or AdMax Promotion(it) 禁断の機能がau公式 …
-
-
Google Analyticsアクセス解析をJugemブログで利用する上の規約確認
Google or AdMax Promotion(it) 禁断の機能がau公式 …