WordPressブログでファビコン(タブの画像)を設定する方法!!

ブログ

こんにちは。ブロガーのしんごです。

ついにファビコンを作成する決断をしました!! どういう風に作ったのか、その過程ととともに手順をまとめておきます!!

まずは画像!!

デザインどうしよ?

なんといってもまずは画像がないと始まりません。ただ、デザインするのって、意外とアイディアが出なかったりします。

わたしの場合、このブログの題名からイメージからデザインを考えました。

このブログのコンセプトは3つのアイ。つまり、I (わたし)、愛、Eye (視点)を大切にしよう!! という想いでこのブログを運営しています。

するとパッと思いついたのが、こちらでした。

人が虫眼鏡で覗くとハートになっているというアイコンです!!

アイディアが浮かばない場合は一緒に考えましょう!! ぜひ連絡くださいね!!

何で描く?

わたしはiPad上で、Procreateというアプリを使って描いています。

procreateオリジナルブラシの作り方!シェイプとグレインって何?

使うソフトは何でもありです。わたしは個人的にProcreateはオススメです!! 今回作成したファビコン用の画像は64pxの正方形でpng形式で作りました。

.ico形式に変換しよう!!

画像が作れたら、最後に.ico形式にする必要があります。

変換するのに、わたしがお世話になったサイトはこちら!! とても使いやすくて便利なサイトでした。

ファビコン favicon.ico を作ろう! リアルタイム 5サイズ版
ファビコン favicon.ico を作ろう! リアルタイム版。16x16,24x24,32x32,48x48,64x64ピクセルのマルチアイコンが簡単に作れます。プレビューはリアルタイムに確認できます。

  1. 16×16用画像ファイルを選択のボタンをクリックして変換したい画像を選ぶ。
  2. favicon.ico作成のボタンをクリック。

これでもうファビコンはできあがりです。アップする際、favicon.icoというファイル名にする必要があるので、ファイル名もこの名前でできるのでありがたいです!!

WordPressにファビコンを設定しよう!!

いよいよ、ブログのファビコンが自分仕様になります。わくわく。

まず始めに、Wordpressのダッシュボードの左のメニューの中から、「外観」の「カスタマイズ」を選択しましょう。

続いて、外観のサンプルが表示されるので、その左のメニューの中から、「その他」を選択してください。

すると、ファビコンの設定項目が出てきます。

「テーマ側でファビコンを設定」にチェックをして、ファビコンのファイル (favicon.ico) を設定します。

たったこれだけです!! これでファビコンが設定されます。

このブログのファビコンもこれになっています。

まとめ

WordPressでのファビコンの設定方法をまとめました。

初めてファビコンを設定しましたが、デザインすることがとても楽しかったです!! ちょくちょく変えちゃうかもしれないです(笑)

また、ファビコンって想像以上に小さいので、こまごまさせrずにシンプルなデザインの方が良いなぁと思いました。インパクトもあるとなお良し!! ですね。

タイトルとURLをコピーしました