頑張らない!でも諦めない!必死にならずにええかげん

ブックマークアイコン(ファビコン)をはてなブログで表示する方法

      2014/11/22

はてなブログでブックマークアイコン(ファビコン)を追加する方法を、
あまりに簡単すぎて投稿する意味さえなさそうですが、
念のため投稿します。

本投稿は以下投稿の詳細ページになります。


もしお時間があれば本編もどうぞ。

はじめに

他の無料ブログで試した際にちょっと苦労したこともあり、
はてなブログでブックマークアイコン(ファビコン)を表示する方法を
投稿しようと思いましたらあまりにもあっけなく、
投稿する気さえなえてしまうような簡単さでした。

01_ファビコンイメージ

ファビコンイメージ

一応、ブログサービスの検討という意味で、
投稿をさせてもらってますので一応書き残します。

おそらくこの「はてなブログ+ファビコン」で検索をされる方は、
ほとんどいないんでしょうね・・・。

概略

アイコン用画像ファイルを用意し、はてなブログの管理ページを開き、
[設定]-[詳細設定]と表示されている部分で画像を指定して終了です・・・。

表示するアイコンの準備

まずアイコンに割り当てたい画像を用意する必要があります。
画像の作成方法等に関しては以下の投稿を参照願います。

 

はてなブログではico形式のファイルはみとめられていないようで、
画像ファイルをブログ画像に設定すれば表示されます。
今回は以下の72px画像を利用しています。
favicon_hatena_logo_p01-72px_hatena

はてなブログの画像アップロードに対して、
icoファイルをアップロードすると、
アップロードプログレスバーが止まってしまいアップロードが完了できませんでした。

おそらくicoを認めていないということなのだと思います。
しかしはてなブログの場合、icoファイルを画像としてUPする必要はありません。
画像形式のファイルをファビコン用の設定画面で設定を行うだけです。

ファビコン設定

ダッシュボードから設定したいブログを選択します。

02_ダッシュボードからブログの選択

ダッシュボードからブログの選択

はてなブログの管理画面より[設定]をクリックします。

03_ブログの設定

ブログの設定

表示された画面のタブの中から[詳細設定]を選択します。

04_詳細設定

詳細設定

ファビコンを設定の画面より、先ほど作成したアイコン画像を指定します。
指定されると横にファイル名が表示されます。

05_ブログアイコンの設定

ブログアイコンの設定

ico形式のファイルをアップロードすると、以下のようにエラーが表示されます。

06_ico形式指定エラー

ico形式指定エラー

アイコンファイルの選択が終わりアップロードされると、
アップロードしたファイルが表示されます。

07_アイコン設定確認

アイコン設定確認

以上で設定は完了です。

各ブラウザの表示確認

今設定したファビコンが設定されているかを各ブラウザで確認します。

08_ブラウザ表示確認

ブラウザ表示確認

簡単すぎるほど簡単に設定を行うことができました。
wordpressで構築したサイトよりも、この点でははるかに簡単に設定を行うことができました。


 

はてなブログでこんな簡単なことでさえ、
無料ブログサービスでは苦悩させられてしまったりするものです。

ブログサービスをどこにするかを考えるときに、
こんなちょっとしたことでも、検討の材料にすることは大切なことだと思います。

*本ページ内に記載されされた各社ブランド、サービス名、商標、登録商標については、
各社ブランドのロゴや商標等に関する帰属についてをご確認ください


最後までお読みいただきありがとうございました。

アイキャッチ画像に利用させて頂いております、各社ブランドのロゴやシンボルに関しては、
各社ブランドのロゴや商標等に関する帰属についてをご確認頂けますようお願い致します。

AdMax Promotion

ブログ記事のご紹介
すべて展開 | すべて省略

Rakuten Promotion

ページ
すべて展開 | すべて省略

プロモーション(btm)

Google or AdMax Promotion (it)

 - はてなブログ, 無料ブログ , , , , ,

  関連記事

eye_dti
dtiブログ終了前に引っ越し先のブログへ転送(リダイレクト)する

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_fc2
FC2ブログの利用登録

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_cocolog
Google™ Analyticsアクセス解析をココログで利用する方法(項目)

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_seesaa
Seesaa™ブログでHTMLの修正を行う方法

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_dti
dtiブログでテンプレートをコピー(複製)する方法

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_ninja
Google Analyticsアクセス解析を忍者ブログで利用する方法

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_cocolog
ブックマークアイコン(ファビコン)をココログで表示する方法

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_livedoor
ブックマークアイコン(ファビコン)をlivedoorブログで表示する方法(head)

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_seesaa
Seesaa™ブログでGoogle™ AdSense二次審査落ち理由の/auth/article_preview/を考えてみる

Google or AdMax Promotion(it) 禁断の機能がau公式 …

eye_seesaa
Google™AdSense広告をSeesaaブログで利用する上の規約確認

Google or AdMax Promotion(it) 禁断の機能がau公式 …