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

はじめに

今回は fumadocs で作成されてるこのブログで favicon の設定を行いましたので備忘録として残しておきます。 同じように fumadocs で favicon を設定したい方は参考にしてください。

画像配置場所

favicon の設定自体はあまり難しくなく、特定のファイル名で画像を入りするだけで設定できます。 配置場所としては、publicディレクトリにfavicon.icoというファイル名で画像を配置します。

public/favicon.ico

反映

画像を配置できたら、ブラウザでサイトを開いて確認します。 この段階で favicon が表示されていれば設定は完了です。 ただ、私の場合は反省されていなかったため、開発サーバーを再起動して再度確認しました。

npm run dev

私は再起動後にブラウザをリロードしたところ、favicon が正しく表示されました。

反映されない場合

これらの手順を踏んでも favicon が反映されない場合はブラウザのキャッシュが原因の可能性があるため、キャッシュのクリア、もしくはシークレットモードを使用して確認してみてください。 おそらく反映されてるはずです。

まとめ

今回は簡単ではありますが、fumadocs での favicon の設定方法について解説しました。 特定のファイル名で画像を配置するだけで設定できるので、手順自体は非常にシンプルでした！ 今後 fumadocs で疑問のあることがあれば、また記事にしていきたいと思います。