More than 3 years have passed since last update.

【Rails】ファビコンの設定

Last updated at 2021-06-10Posted at 2021-06-10

目的

Railsで作成したアプリにファビコンを設定する。

macOS: Big Sur
Rubyバージョン: 2.6.5
Railsバージョン: 6.0.0

今回はファビコンの設置を行っていきます。
ファビコン作成から設定まで簡単な方法で行っていきます。

まずは画像を作成していきます。

こちらのサイトからロゴ作成を選択し、ファビコンとなるデザインを作成していきます。
会員登録は必要ですが、無料で使えます。

作成できたら画像をダウンロードして次へ進みます。

次に画像の編集を行います。（画像の編集が必要ない方は飛ばして頂いて構いません。あくまで見た目の修正です。）
今のままですと、ピン角になっているため、角Rを付けます。
BANNERKOUBOU
こちらのサイトから画像を加工します!
加工が完了したらダウンロードしてください。

先程ダウンロードした画像をファビコン化していきます。
Favicon ジェネレーター
こちらのサイトから画像サイズを選択し、画像拡張子を「.ico」に変更します！

今回は「16x16」と「32x32」を選択しました。

最後に作成したファビコンをアプリに設定していきます。

まず先程ダウンロードしたファビコンをアプリimagesフォルダー下に配置します。

assets/assets/images/favicon.ico

次に配置したファビコンを読み込ませます。

app/views/layouts/application.html.erb

<!DOCTYPE html>
<html>
  <head>
<!-- 省略 -->
    <%= favicon_link_tag('favicon.ico') %>
<!-- 省略 -->
  </head>
<!-- 省略 -->

これで、ファビコンの設定ができました！

以上で設置できたはずなので、サーバーを起動し確認してみてください！

以上でファビコンの設定は完了です。
簡単に設定できるので、ぜひ試してみてください。
では。