ChatGPTにサイト・アイコン(favicon)の設置方法を教わる

このウェブサイトは wordpressを使って構築しましたが、ブラウザーで開くとタブに favicon (サイト・アイコン）が表示されず、寂しいので早速FAVICONを設置しようと思い立ちました。過去に他のサイトを開設した時にも favicon は設置しており、確かfavicon.icoという画像ファイルをftpでアップロードしてヘッダーにそのファイルへのリンクを記載すればいいと記憶していました。

Googleで “favicon 設置方法”と検索すると多くの記事が表示され、トップ表示された記事に従って、favicon.icoファイルをウェブサイトのrootにアップロードし、ヘッダーファイルにリンクを記載しました。しかし、何が悪いのか、上手く行きませんでした。多分リンクの書き方が悪かったのだろうと他の記事を参考にして修正を試みましたが、たまたま私のバイオリズムが悪かったのか、半時間ほど格闘してもサイト・アイコンは表示されませんでした。

――そうだ、困った時にはChatGPTに相談しよう！

ということでChatGPTを開きました。

User: 私のWordpressのウェブサイトに favicon を設置する簡単な方法を教えてください

ChatGPT: WordPressのウェブサイトにFaviconを設置する方法は非常に簡単です。以下の手順に従って設定してください：

Faviconを用意する: まず、ウェブサイトに表示するFavicon画像を用意します。一般的に、16×16ピクセルまたは32×32ピクセルのPNGまたはICO形式の画像を使用します。
WordPressにログイン: WordPressの管理画面にログインします。
外観（Appearance）メニューを選択: 左側のサイドバーで「外観（Appearance）」メニューをクリックします。
カスタマイズ（Customize）を選択: 「外観（Appearance）」メニューの下に「カスタマイズ（Customize）」があります。それをクリックします。
サイトアイデンティティ（Site Identity）を選択: カスタマイズ画面が開かれたら、左側のパネルから「サイトアイデンティティ（Site Identity）」を選択します。
Faviconをアップロード: 「サイトアイデンティティ（Site Identity）」セクションには「Favicon」という項目があるはずです。ここでFaviconをアップロードします。クリックしてアップロードオプションを使い、先ほど用意したFavicon画像を選択します。
変更を保存: Faviconをアップロードしたら、「公開（Publish）」または「変更を保存（Save Changes）」ボタンをクリックして、設定を保存します。

以上の手順で、WordPressのウェブサイトにFaviconが設置されるはずです。設定を保存したら、ウェブサイトのタブやブラウザのブックマークバーでFaviconが表示されることを確認してください。また、ブラウザのキャッシュが残っている場合、変更が反映されるまで少し時間がかかることもあるので、しばらく待ってみてください。

【結果】ChatGPTの教えに従い、２分間で問題が解決しました。何が悪かったのだろうと、このサイトの画面を右クリップしてソースコードを表示させたところ、以下のように 32px, 192px, appleタッチの3種類のfaviconが（表示deviceにより選択されて）表示されるようになっていました。

私がアップロードした512pxのpngファイルが wp-content/uploadsに収納され、そのファイルへのリンクがwordpress.comのサーバーに登録されて、相手deviceにより適切なサイズに縮小されて表示されるようになっているようです。

結論として、wordpressサイトへのfavicon設置は、ChatGPTが教えてくれた方法がベストだと思います。そして、分からないことがあれば、何でもChatGPTに聞くのが時間の節約につながるかも、ということです。

コメントする コメントをキャンセル

コメントするコメントをキャンセル