from :: Asahikawa Hokkaido

passer-by198

primetime pencil

2010/05/22


Posted

Google Bloggerでオリジナルのファビコン画像を使う記述

favicon 当サイトのファビコンです…

ブラウジング中に…

タブやブックマークに表示されたり…

レンダリングエンジンにもよりますが…

アドレスバーにも表示されたりします…

タブブラウジングが主流でしょうから…

タブの中で埋没しないためにも…

自サイトオリジナルのファビコンを使いましょッ…

しかしながら…

ココログなどのように…

ルートディレクトリに画像を直アップロードできるサービスならば…

なんら問題ありませんが…

Blogger ではルートディレクトリには置けません…

…なので…他サービスに画像をホストして…

HTML で favicon.ico のホスト先を指定する…

…といった手法をとります…

では…いきますッ

ファビコンは各自ご用意くださいな…

ソフトをダウンロードするより…

ブラウザ上で完結した方が面倒じゃないので…

お奨めは…

エーオーシステム 


20165月の時点で暗号化接続に未対応なのでリンクを削除


さんです…

16x16pix 32x32pix 48x48pix のマルチアイコンを作成できます…

オイラの場合…記事頭の 16pix と…

32 32pix のマルチアイコンにしています…

32pix を 16pix にすると…

16 こんな感じでチト見づらいので別画像を使っています…

…ってか…16pix だけでも良いんですが…

ちょっとしたこだわりです…

画像のホストも各自お好きに…( ̄ー ̄)邪笑

 Blogger用の外部ファイル保存場所として「GitHub」の「GitHub Pages」を活用しよう


 Blogger用のファイル保存場所としてのクラウド型オンライン ストレージ「Google Drive」


 Blogger用のファイル保存場所としてのクラウド型オンライン ストレージ「Dropbox」


 Google Blogger用のファイル保存場所としてのGoogle sites/Picasa



Blogger の HTML は …

「カスタマイズ」「HTMLの編集」から…

<head></head> の間の任意の場所に…

下記のタグを書くだけです…

ご自身でホストしたファビコンのURLに変えて下さいね…

「テンプレートを保存」して完了です…
  1. <!-- 挿入する文字列 -->
  2. <link href='ファビコンのURL' rel='icon' type='image/x-icon'/>  
  3. <link href='ファビコンのURL' rel='Shortcut Icon' type='img/x-icon'/>

デフォルトの機能で追加されました…

「レイアウト」から設定出来ます…
用意した画像をローカルから選択するだけで OK です…


0 Comments :

「jQuery」と「jQuery UI」で HTML に彩りを添えよう…


「導入」「Button」「Accordion」「Tabs」「Effects/Slide」
「Progressbar」「Dialog」「Tooltip」「Menu」
「Extra」 / 公式「Widgets」以外の「jQuery UI」スクリプト
Blogger Template Customize Universal / INDEX

Blogger テンプレート・カスタマイズ / 全般を解説
高速化・最適化対策の結果と備忘録