ファビコンの作成方法

【スポンサーリンク】

LINEで送る
Pocket

ファビコン
自分のブログにファビコンを 表示させてみませんか?
2010/05/11 に 紹介したファビコンですが、今回は、これの作り方を紹介します。
まずは、画像ソフトで 自分のロゴマークをデザインします。
この時に ロゴマークデザインは、正方形で作ります。
デザインが、完成したら 16×16のサイズに縮小します。
次に、作成した画像をファビコン用のファイル形式に変換します。
ファイル形式の変換は、//www.html-kit.com/favicon/のサイト(英語のサイト)で行うことができます。
参照ボタンを 押してデザインしたロゴマークファイルを選び下のボタンを押したらファビコン用のファイルに変換されます。
操作1
操作2
次にDownload FavIcon Package を クリックしてダウンロード任意のフォルダに保存してください。
ダウンロードしたファイルはzip形式なので、解凍ソフトを使ってこのファイルを解凍します。
解凍したファイルの中に favicon.ico というファイルがあります。これがファビコンですので、任意のフォルダに保存します。
次に ファビコンファイル(favicon.ico)をサーバーにアップロードします。
宇和島本舗では、「.ico 」のファイル形式は、受け付けませんので 他のホームページを置けるサーバーへアップロードして下さい。
アップロードが、出来ましたら 宇和島本舗ブログの管理画面よりタグの設定をします。
管理画面の左サイドバーの 「テンプレート」→「カスタマイズ」ページへ移ります。
そのページの「トップページ、個別記事、アーカイブ」ソースの <HEAD> ~</HEAD> 内に、下記のLINKタグを設定します。
<link rel=”shortcut icon” href=”favicon.ico>
(↑このタグを貼り付ける)
HREF=”” に、favicon.ico ファイルへのパスを指定します。ファビコンファイルを 他サーバーにアップしているので// で始まる絶対パスで記述します。
記述できましたら登録ボタンを押して完了です。
これで ちゃんと表示されてるか確認下さい。

LINEで送る
Pocket

にほんブログ村 地域生活(街) 四国ブログ 愛媛県情報へ にほんブログ村 美容ブログ 理容室・床屋へ

スポンサーリンク
スポンサーリンク

「ファビコンの作成方法」への4件のフィードバック

  1. なるほど。よく解りました。簡単やね。
    でも、どんなファビコンにしようかなあ~。
    写真・音楽・たこ焼き?誰か作ってくれ~。

  2. 画像が小さいので超シンプルな絵じゃないとわかりませんね。
    まだブログのアイコンをどうしようかと考え中なのでHPだけ作りました。

  3. issyooさんへ
    けっこう簡単ですよ。
    デザインは、小さく縮小しますからシンプルな方が、わかりやすいです。(^^)

  4. ケース家さんへ
    そうそう 忘れてた。
    私もHPの方にもつけなくては(^^;)A

※コメントを残すには、枠内をクリックしてください!