WP・stingerのファビコンを変えるには

昨年後半に新しくWP(ワードプレス)でブログを作りました。

今まではファーストサーバが無料で提供しているテンプレートキングのテーマ(テンプレート)を使っていました。(八木ラボはテンプレートキングを使用しています。)

昨年後半、ブロガー仲間に「Stinger(スティンガー)っていうテーマがいい」と聞き、初めて導入しました。

stinger-rogo07

Stingerの詳細はこちら→WordPressテーマのSTINGER3公式サイト

公式サイトの説明にあるとおりにカスタマイズもしましたが、

公式サイトに説明がなかったのがファビコンの変更方法です。

やっとファビコンを変更することができました。

 

ファビコンというのはコレです。

下の赤枠で囲っている部分のアイコンのことです。

stinger-rogo01

このファビコンはStingerにデフォルトで入っているものです。

Stingerを使う人が増えて、同じファビコンだらけになってきたような気がするので、変更したくてしかたありませんでした。

CSSを見ても、ファビコンの表記がなく・・・

ファビコンの表記は「外観」→「テーマ編集」→「ヘッダー」の中にありました。

stinger-rogo02

<!—CSSの切り替え—>の上で指定されていました。

「rogo.ico」は16px(ピクセル)四方の正方形で作られていたので、ホームページビルダーウェブアートツールで同じ大きさのオリジナルファビコン画像を作成。

 

stinger-rogo03

サーバーに「rogo.bmp」をアップロードして、「ヘッダー」のファビコン表記を「rogo.ico」から「rogo.bmp」 に変更しました。

が。

ファビコンに変化なし・・・

 

ファビコンの画像がbmp(ビットマップ)形式だからだめなのかな、と思いました。

でも、ウェブアートツールやペイントでは「ico」形式で画像を保存できないんです

しかたなく、「ICO 画像」で検索すると、

アイコン(icon)変換ツール – Favicon Converter

というダウンロード不要の画像変換ツールを発見!

さっそく、アイコン変換ツールで画像を変換して保存。

ばっちり、「ico」形式で画像を保存できました。

 

「ico」形式のファビコン画像「rogo02.ico」をサーバにアップロード。

stinger-rogo04

Stingerデフォルトのファビコンと区別するために、「02」の数字をつけました。

 

WPのテーマ編集画面に戻り、ファビコンの記述を「rogo.ico」から「rogo02.ico」に書き換えて、更新。

stinger-rogo05

 

すると、ファビコンの画像が変わりました!

stinger-rogo06

 

ファビコン自体はホームページビルダーを使っていたころに、作ったことがあるのですが、「ico(アイコン)」形式という画像の形式を知らなかったので、ちょっと時間がかかってしまいました。

 

ちょっとずつでも自分でカスタマイズできるのは楽しいですね。

Related Posts Plugin for WordPress, Blogger...
| WordPressのこと |

前の記事«

次の記事 »

トラックバック

このブログ記事に対するトラックバックURL:

コメント & トラックバック

No comments yet.

Comment feed

コメントする

QLOOKアクセス解析

プロフィール

八木ラボ研究員のむつきです。神奈川県横浜市のアラフォー。ブログを書いたりしています。詳しいプロフィールはこちら→管理人プロフィール

広告

ASP一覧

日本最大級のASP
A8.net
バリューコマースだけの広告主も多いのでチェック
バリューコマース
スマホ対応しているなら!クリック課金型広告

有名広告主多数・リンクシェア
リンクシェア リンクシェア アフィリエイト紹介プログラム
ドロップシッピングも同時に登録可能
もしもアフィリエイト
ユニークな広告主が多い大阪本社のASP
イークリック アフィリエイトならイークリック

アンケート作成ツール