0
0

ホーム画面に追加でアイコンを指定する apple-touch-icon

Last updated at Posted at 2024-06-27

はじめに

ポートフォリオ作成一旦終わりました!
iphoneでホーム画面追加するときのアイコンってどうやって指定するんだ?
となり実装まで漕ぎ着けたのでアウトプットしておきます✍️

完成図

IMG_6629.jpg

簡単!

指定したい画像を用意し、サイズを180x180にリサイズしておきます
適当な変換サイトでOK!

application.html.erbのhead内に以下を記述します

application.html.erb
<head>
  <%= favicon_link_tag 'apple-touch-icon.png', rel: 'apple-touch-icon', type: 'image/png' %>
</head>

あとは該当の画像をapp/assets/imageに格納するだけ!

さいごに

ぜひやってみてください!

ブラウザタブの左上のアイコンを指定はこちら

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0