Pocket

favicon.ico設置

  • add this entry to hatena bookmark

favicon.ico を設置したので、記録しておきます。

概要としては、favicon.icoを「favikon」で作成し、Webサイト(WordPress)に設置・設定する、という内容になります。

favicon.icoの作成

まず、favicon.ico の元となる画像を作成する必要があるのですが、凝った画像を作るつもりがなかったので、簡単な文字列で組み立てる事にしました。

Office(今回はPowerPoint)を用いて、3文字の文字列を大きなフォントで組み立て、PNG画像で保存し、元となる画像を作成完了。

作ったPNG画像ファイルを元に、ICOファイルを作成する事になりますが、今回は上述のとおり、favikon を利用させていただきました。作ったPNG画像ファイルをサイト上で読み込ませて、ICOファイルにしたい部分だけを指定できる機能が良く、意図したICOファイルが作成できました。

Webサイトに設置・設定

WebサイトはWordPressを使っています。作成したfavicon.icoファイルを、WordPressで使っているテーマのディレクトリに配置しました。(wp-content/themes/テーマ名/ に配置)

配置したfavicon.ico を表示させる為に、該当するテーマの header.php ファイルにて、headタグの中に以下の1行を追加しました。

<link href="<?php bloginfo('template_directory'); ?>/favicon.ico" rel="shortcut icon" />

以上の設定で、favicon.ico が表示されるようになります。

Pocket

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*

チェックサイト RSS Feed読者登録はいかがでしょうか?RSS配信中です。