*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+

お知らせ


PB116274.JPG

クオンのオリジナルペット兼用クッション! 大好評発売中! 


*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+*+


2007年08月02日

オリジナルのファビコンはいかが?

かいママさんのブログで以前紹介されていた「ファビコン」


00000.bmp



↑の音符マークが「ファビコン」と言われるもので
サイトのマークみたいなものです。


タブ、お気に入り、アドレスバーなどの先端に表示されます。


私も来夢のファビコンを作ってみましたハートたち(複数ハート)


TOPページ.bmp


やり方さえ、覚えてしまえばとっても簡単ですひらめき


みなさんにもわかりやすく画像を使ってご説明しますね!


* ファビコンはすごく小さいので、本来ならかいママさんのように
 イラストの方がいいかもしれません。


私は試しにチャッピーの画像を使ってやってみますね手(グー)



1.画像を用意します。


画像の大きさですが、あえて小さくする必要もないかと思いますが
あまり大きい画像だと小さくしたときにボケてしまうと思います。


私はコレ↓を使ってやってみます。


P1060467_1.jpg



2.ファビコン作成サイトを出します。


ファビコン作成サイト.bmp
 
 上     画像をクリックしてください。    上


ファビコンのサイト(英語)が立ち上がりましたか?


3.画像ファイルを入力します。


サイトの入力方法.bmp


@の「参照」をクリックしてお気に入りの画像を入力します。

次にAをクリックします。

そうすると自動でBにファビコンになったチャッピーの画像が
出てきます。


ヲされたら・・.bmp


Bに画像が表示されましたか?

そうしたら、そのままの状態で「Download FavIcon」をクリック。




保存の仕方_1.bmp


保存をクリックすると、保存先を選ぶダイヤログがでます。




保存場所選択.bmp




デスクトップでもマイドキュメントなどどこでもいいです。



ZIPファイル完成.bmp


解凍前のアイコンは、こんな感じでしょうか。

この表示を「右クリック」して“解凍”を選びます。
さらにそこから“デスクトップに解凍”をクリックします。
(解凍場所はどこでも構いません。)




チャッピーファビコン完成.bmp


チャッピーのファビコンがパソコンに取り込まれましたグッド(上向き矢印)


ココまでくればあともう一息ですダッシュ(走り出すさま)


4.アセラに取り込みます。


まずは、画像を取り込む前に【コンテンツの追加】を行うといいです。



コンテンツの追加.bmp


種類は  「ブログロゴ画像」 というのがすでにありますので
それを選びます。

そのまま「全ページ」「ヘッダー」「1」と入力。

そして「コンテンツの追加」を押してください。


ブログロゴ画像がコンテンツに追加されましたか?

次にファビコン画像をアップロードします。




@  さっき取り込んだ画像「ココで言うならチャッピーの画像」を
   参照から探してきます。




画像の選択(アセラ内).bmp




A  画像をアップロードします。


B  アップロードができたら、「テキスト上部」に
   画像のHTMLをコピーして挿入します。




ファビコン画像取り込み(アセラ内).bmp







コピーの仕方_1.bmp


HTMLコピーボタンをクリックすると
赤い四角部分が挿入されます。


この一部分を使います。



コピーの仕方_2.bmp


<a  href="http://ekorin-chappy122.a-thera.jp/image/favicon.ico" alt="favicon.ico" target="_blank">favicon.ico</a>


↑↑  これがコピーされたもの。  ↑↑


あえて最初と最後の<>を全角でココでは表示させました。
本来は半角です。


このうちの

「="http://ekorin-chappy122.a-thera.jp/image/favicon.ico" 」


だけを取り出します。


* ↑の画像では“alt="favicon.ico"”も青くなっていますが
 ここは不要です。ごめんなさい・・。


コピーの仕方_3.bmp



『<link rel="shortcut icon"href="http://ekorin-chappy122.a-thera.jp/image/favicon.ico">』


この形がファビコンを表示するために必要なタグです。


<link rel="shortcut icon"href="アセラブログのアドレス/image/ファビコンを作ったアイコンファイルの名前">

になります。(すべて半角英数です。)


コピーの仕方_3.bmp


最後に「保存」して

「すべて」を「再構築」すれば、完了です。


IE7では比較的スムーズに表示されますが、IE6などは
たまに表示されないことがあります。


* 一度アップロードして表示された画像をやめて
 他の画像に変えたときは、再構築はもちろんですが、
 パソコンの再起動もあわせてするとスムーズにいくと思います。


-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*


一見、面倒だし難しそうにも見えますね〜。
でも、パソコン音痴な私でもできましたから、
お時間があるときに是非チャレンジしてみてください。


そうそう。
私が来夢のファビコンにしたのでアップルに言われちゃいました。

「これはチャッピーのブログだよ!
 だからチャッピーのファビコンにしてよ!!」
 来夢のファビコンは私(アップル)にちょうだいね!!」ってね顔(ペロッ)


『ふぁ〜い。わかりました〜。。。』

(チャッピーの画像にしましたよ〜〜)





◆夏休み◆

ニックネーム えこりん♪ at 14:22| Comment(32) | TrackBack(0) | 日記 | このブログの読者になる | 更新情報をチェックする