wordpress WEB制作

【WordPress】ファビコンを設定する方法と変わらない時の対策

2021年7月9日

こんにちは、よしです。

me
悩んでいる人

WordPressのファビコンを設定したのに変わらない!

今回はそんな悩みを解決する記事を書きました。

僕も以前WordPressデフォルトのファビコンが変わらなくて苦労しました、、

IMG 5924
よし

この記事で分かること

・WordPressでファビコンを設定する方法

・WordPressでファビコンが変わらない時の対処法

それではいきましょう!

チェック!
"独学でOK" 未経験でもWordPress案件を取れる学習方法
"独学でOK" WordPress案件を取れる学習ロードマップ

続きを見る

関連
WordPressの子テーマのメリットデメリット
【WordPress】子テーマの作成方法とメリットを解説

続きを見る

WordPressでファビコンを設定する方法

まずは簡単にWordPressでファビコンを設定する方法を画像と共に解説していきます。

PHPを直接いじる方法や、プラグインを使用する方法もありますが、管理画面で簡単に設定できるので、そちらを解説します。

WordPress ファビコン設定の手順1
WordPress ファビコン設定の手順1

WordPress管理画面の「外観」→「カスタマイズ」を選択。

WordPress ファビコン設定の手順2
WordPress ファビコン設定の手順2

この部分は使用しているテーマによって少し異なりますが、画像のような「サイト基本情報」を選択します。

WordPress ファビコン設定の手順3
WordPress ファビコン設定の手順3

画像を変更を選択し、ファビコンにしたい画像を選択しましょう。

以上です。

たったこれだけでファビコンを設定することが出来ました!

WordPressサイトのファビコンが変わらない時の対策

上で解説した方法でファビコンを設定すると、ホーム、タブのファビコンはすぐに変わるはずです。

WordPress ファビコン ホームタブ
WordPress ホームとタブのファビコン

しかし、うまく変わらない場合もあるようなので、少し解説します。

WordPress管理画面でファビコンを変更したにも関わらず変わっていない場合、大きく2つの原因があります。

チェック

・正しく設定されていない

・キャッシュが残っている

ファビコンが正しく設定されているかチェックする方法

まずはファビコンが正しく設定されているか、チェックツールを使用して確認しましょう。

Favicon checkerを使用するのがおすすめです。

ファビコンチェック手順
ファビコンチェック手順

使い方は簡単で、自分のサイトのURLを入力するだけです。

ファビコンチェック結果
ファビコンチェック結果

こちらは僕のチェック結果です。

エラーが起きている点もありますが画像のようになっていれば、Chromeの検索結果ホーム画面での表示ブラウザのタブには問題なく表示されています。

キャッシュを削除する方法

ファビコンが問題なく設定していることを確認できたら、キャッシュの問題の可能性が高いです。

キャッシュを削除してもう一度確認してみましょう。

キャッシュ削除方法

· WindowsCtrl + F5

· Mac :command + shift + R

また、検証ツール → Network のDisable cache にチェックを入れた状態でリロードしてもキャッシュをクリアできるので、念の為どちらも試してみましょう。

その後にタブが新しいファビコンに変わっていることを確認してみてください!

検索結果のファビコンが変わらない時の対策

WordPressでファビコンが正しく設定され、キャッシュが削除されていれば、タブやホーム画面のフォビコンはすぐに変わっているはずです

しかし、スマホのGoogle検索結果のファビコンはすぐに変わりません。

スクリーンショット 2021 07 09 19.11.44
スマホのGoogle検索結果のファビコン

自分もここにハマってしまい、「全然変わらないじゃん!!!」と一人で怒っていました。

検索結果のファビコンを変えるには、Googleにクロールされた結果変わるようです。

検索結果の横にファビコンを表示するには、次のガイドラインを遵守する必要があります。なお、すべてのガイドラインが満たされても、ファビコンが検索結果に表示されるかは保証されません。

・Google がファビコンのファイルとホームページをクロールできること(Google をブロックしないこと)。

・ファビコンがウェブサイトのブランドを視覚的に表したものとなっており、ユーザーが検索結果を見た際に一目でサイトを見分けられるようになっていること。

・ファビコンのサイズが 48 ピクセルの倍数になっていること(例: 48 x 48 ピクセル、96 x 96 ピクセル、144 x 144 ピクセルなど)。SVG ファイルの場合は、サイズに関して特別な指定はありません。有効なファビコン形式は、すべてサポートされています。Google では画像サイズを 16 x 16 ピクセルに変換するため、その解像度で適切に表示されるか、あらかじめご確認ください。注意: 16 x 16 ピクセルのファビコンは指定しないでください。

・ファビコンの URL は固定されている必要があります(URL は頻繁に変更しないでください)。

・わいせつな表現やヘイト表現に関連するシンボル(例: かぎ十字章)などの不適切なファビコンは表示されません。該当する表現がファビコン内で見つかった場合は、デフォルトのアイコンに置き換えられます。

Search Consoleヘルプ ファビコンに関するガイドライン

少しややこしいので、ポイントをまとめます。

ポイント

・サイトがnoindex設定になっていないかを確認、なっていたら変更する

・48ピクセルの倍数の正方形 or 512×512の画像にする

・画像は頻繁に変更しないで待つ

・適切な画像をファビコンにする

僕はこれらの対策をして、クロールが完了したのに、「変わらない!!!!」

更新日はファビコンを変更した後になっているのに、変わらない状態が続きました。

もう変わらなくてもいいや!と一旦放置することにしました。

結果的に2週間ほどした所で検索結果のファビコンも変わってくれました。

まとめ 検索結果のファビコンを変えるには、正しく設定して「待つ」

いかがでしたか?

タブやホーム画面のファビコンはすぐに変えることが出来たと思いますが、検索結果のファビコンが変わるのには時間がかかります。

正しく設定したら何度も変えずに放置してみてください!

そのうち変わってると思います。

それでは!

no image

NFT

2022/4/8

【OpenSea】Polygon(ポリゴン)NFTは売れない?デメリットはある?

no image

NFT

2022/4/16

OpenSeaで予約販売(List)する方法【自動で出品】

no image

NFT

2022/4/5

売れないNFTアートと売れたNFTアートを徹底比較【実体験】

no image

NFT

2022/3/3

【超簡単】OpenSeaのアイテムをコレクション移動させる方法【販売後も可能】

no image

NFT

2022/2/5

写真のNFT化・販売方法について徹底解説!

no image

NFT

2022/2/2

OpenSeaが突然の出品制限【50作品×5コレクションが上限に?】

no image

NFT

2022/1/26

【簡単】OpenSeaのアカウントを複数作る方法

no image

WEB制作

2022/4/3

テックアカデミー「はじめての副業コース」のLiteプランがヤバすぎる!

no image

仮想通貨 NFT

2022/1/5

【簡単】コインチェックで仮想通貨を購入・MetaMaskに送金する手順

no image

NFT 仮想通貨

2022/1/5

【2022年】メタマスクの使い方・送金方法を徹底解説【初心者でも簡単】

no image

仮想通貨

2022/1/24

【実体験】仮想通貨初心者にコインチェックがおすすめな理由

no image

仮想通貨

2022/1/24

【2022年】コインチェックの口座開設方法を5段階で解説

no image

NFT

2022/1/6

【バズるコツも紹介】NFTギブアウェイ(Giveaway)のやり方とメリット・デメリットを解説

no image

仮想通貨

2022/1/6

Hi Dollars(ハイダラーズ)アプリのマイニングで仮想通貨を貰おう【無料でゲット】

no image

NFT

2021/12/30

NFTエアドロップの受け取り方・送り方を解説【初心者でも簡単】

no image

NFT

2021/12/26

NFTアートが売れないときの対処法と稼ぐコツ【今すぐできる】

no image

NFT

2022/1/5

OpenSeaでのNFTアートの作り方【出品手数料やガス代も解説】

no image

WEB制作 プログラミング

2021/12/21

分割払いできる?デイトラの支払い方法を解説!【結論:カード使えば分割可能】

no image

プログラミング

2021/12/7

【退会料はかかる?】レバテックルーキーの退会方法【他のIT就活サービスも紹介】

no image

WEB制作

2021/12/5

デジタルハリウッドSTUDIO by LIG(Webデザイナー専攻)の学習内容と評判【2021年最新】

-wordpress, WEB制作

© 2022 よしブログ Powered by AFFINGER5