AFFINGER5のファビコン(サイトアイコン)の設定方法【AFFINGER6(アフィンガー6)も対応】

悩む人

サイトタブに表示されるファビコンを設定したい
AFFINGER5(アフィンガー5)とAFFINGER6(アフィンガー6)でファビコンの設定方法を教えてほしい
ファビコンの画像サイズを教えてほしい

こういった疑問に答えします。

結論、AFFINGER5もAFFINGER6(アフィンガー6)もファビコン(サイトアイコン)は下の流れで設定します。

ファビコン(サイトアイコン)用512×512px画像を用意する
カスタマイズ『サイト基本情報』→『サイトアイコン』に画像をアップロードして保存

サイトアイコンを軽んじているあなた。実はサイトアイコンは読者にサイトのイメージやサイト名を覚えてもらうために重要です。

アフィハチのファビコン

テキトーに設定するのではなく、印象に残るファビコン(サイトアイコン)を設定してサイト名を覚えてもらい読者に帰ってもらいましょう。

サイト名を覚えて貰えれば、指名検索でまた来てくれてSEO的にも有利に働きますよ。

AFFINGER(アフィンガー)の初期設定やカスタマイズ方法を知りたい人は『アフィンガーの完璧なる初期設定』『アフィンガーのカスタマイズや使い方』の記事が参考になります。

AFFINGER5とAFFINGER6ファビコン(サイトアイコン)の設定方法
- ファビコン(サイトアイコン)用512×512px画像を用意する
- カスタマイズ『サイト基本情報』→『サイトアイコン』に画像をアップロードして保存
【まとめ】AFFINGER(アフィンガー)でファビコン設定してサイトを覚えてもらおう

＼当サイト限定豪華7特典／

AFFINGER6(アフィンガー6)を購入する

／今すぐゲット＼

AFFINGER5とAFFINGER6ファビコン(サイトアイコン)の設定方法

AFFINGER(アフィンガー)シリーズのファビコン(サイトアイコン)の設定方法は下の手順です。

ファビコン(サイトアイコン)用512×512px画像を用意する
カスタマイズ『サイト基本情報』→『サイトアイコン』に画像をアップロードして保存

ファビコン(サイトアイコン)用512×512px画像を用意する

初めにあなたのサイトのファビコンに設定する画像を用意しましょう。

用意する方法は下の2つの方法があります。

自作する(Canvaがおすすめ)
クラウドソーシングで作ってもらう

画像を自分で作るのが難しい、資金面で余裕がある場合にはクラウドソーシングサイトでアイコンを含めてプロフィール画像を作成してもらうのがいいです。

今回は自作する方法を簡単に紹介していきます。

ファビコン(サイトアイコン)を自作する場合に使うツールはCanvaがおすすめです。

Canvaへアクセスする

Canvaは無料で使えるうえに豊富な素材が用意されています。

ハチ

私はCanva Proという月額1,000円の有料会員になっていますが、無料会員でも高品質な画像を作れるので安心して下さい。

CanvaでAFFINGER(アフィンガー)のファビコン(サイトアイコン)を自作する手順は下のとおり。

Canvaへアクセスする(無料会員登録してください)
『ホーム』→『テンプレート』→『Instagram投稿』→『空のInstagramの投稿を作成』を開く
左側のタブ『素材』で任意のキーワードでアイコン素材を探す
左側テキストでサイト名を入力する
JPGでダウンロードする
iLoveIMGで画像サイズを512×512pxへサイズ変更する
iLoveIMGで画像を圧縮する
ファビコン(サイトアイコン)画像完成

ハチ

ちなみに有料会員のCanva Proなら512×512pxの画像を自分でカスタマイズして作れるので画像圧縮まで簡略化できます

Canva Proの無料トライアルを試す

Canvaへアクセスする(無料会員登録してください)

まずはCanvaへアクセスして無料会員登録して下さい。

Canvaへアクセスする

ちなみにCanva Proではカスタムサイズで最初から512×512pxの画像を作れるので最高です。ファビコンに限らずAFFINGER(アフィンガー)ではヘッダー画像などもカスタムサイズを使って作成すると大幅な時間短縮ができて、有料の高品質素材も使いたい放題なので気になる方は下のリンクから。

Canva Proの無料トライアルを試す

Canvaテンプレート『Instagram投稿』を開く

Canvaにアクセスしたらまずは正方形のテンプレートの『Instagram投稿』でデザイン作成しましょう。

適当なテンプレートを開いて初めに入っている画像や素材を削除すると下のように正方形のデザインができます。

Canva『素材』や『テキスト』で画像作成

あとは左側のタブから素材やテキストを使ってファビコン(サイトアイコン)を作成するだけです。

無料素材でいいので作成すると下のようなサイトアイコンができます。

JPGでダウンロードする

あとは右上の『ダウンロード』から『JPG』か『PNG』で保存しましょう。

ちなみにJPG画像のほうがデータが軽いので私は『JPG』で保存しています。

iLoveIMGで画像サイズ変更と画像圧縮

このままファビコン(サイトアイコン)に設定してもいいのですが、できる限り画像データを軽くしてサイトスピードに影響しないようにしたいので、画像サイズ変更と画像圧縮をしていきましょう。

画像サイズ変更と画像圧縮を簡単にできるのがiLoveIMGというブラウザサービス。

iLoveIMGにアクセスする

面倒なダウンロードやインストールせずにブラウザ上で使えるのでおすすめです。

ただiLoveIMGは画像圧縮するとやや画像の品質が落ちます。

画像自体の品質を落としたくないあなたは、『Voralent Antelope』がおすすめです。

Voralent Antelopeをダウンロードする

画像のサイズを512×512pxへサイズ変更し、画像圧縮が終了したらいよいよサイトにファビコンを設定していきましょう。

カスタマイズ『サイト基本情報』→『サイトアイコン』に画像をアップロードして保存

AFFINGER5(アフィンガー5)もAFFINGER6(アフィンガー6)もカスタマイズから簡単にファビコンの設定ができます。

AFFINGER(アフィンガー)のファビコン(サイトアイコン)の設定手順は下の手順です。

WordPressダッシュボード『外観』→『カスタマイズ』→『サイト基本情報』→『サイトアイコン』

最後にサイトのタブの部分を確認してファビコン(サイトアイコン)がしっかり表示されているか確認できたら終了です。