ウェブサイトへの「apple-touch-icon.png」の設置
2016-10-25-1
[iPhone]
ホーム画面にウェブサイトへのショートカットを置くときのアイコンの設定。
下記を参考に「キンセリ」でやってみた。
手順:
これでOK。
iPhone のショートカットアイコンを見てみると……
出た出た、ちゃんと出た!
以上。
下記を参考に「キンセリ」でやってみた。
- apple-touch-icon.png をサイトに設定する意味のまとめ (drk7jp)
http://www.drk7.jp/MT/archives/001831.html
手順:
- (1) もともとのロゴ画像を各サイズのPNGに変換。
convert -geometry 120x120 logo-935x935.jpg icon-120x120.png convert -geometry 152x152 logo-935x935.jpg icon-152x152.png ...
- (2) ウェブページに下記を追加。
<link rel="apple-touch-icon-precomposed" href="/kndlsl/img/icon-152x152.png" sizes="152x152"> <link rel="apple-touch-icon" href="/kndlsl/img/icon-152x152.png" sizes="152x152"> <link rel="apple-touch-icon-precomposed" href="/kndlsl/img/icon-120x120.png" sizes="120x120"> <link rel="apple-touch-icon" href="/kndlsl/img/icon-120x120.png" sizes="120x120"> <link rel="apple-touch-icon-precomposed" href="/kndlsl/img/icon-114x114.png" sizes="114x114"> <link rel="apple-touch-icon" href="/kndlsl/img/icon-114x114.png" sizes="114x114">
これでOK。
iPhone のショートカットアイコンを見てみると……
出た出た、ちゃんと出た!
以上。