スマホのホーム画面に追加したときに表示されるファビコンを自前の画像にしたい

jy3 · ‎07-02-2023

iPhoneやアンドロイド端末のホーム画面にショップページのショートカットを追加したときに表示されるファビコンに、予め用意したロゴ等の画像を使いたいのですが、具体的にどのようにすればよろしいでしょうか？　他の方の質問で「head要素内にlink要素を使って設置します。コード例として<link rel="shortcut icon" href="./images/favicon.ico" type="image/x-icon">
<link rel="apple-touch-icon" href="./images/apple-touch-icon.png" sizes="180x180">
<link rel="icon" type="image/png" href="./images/android-touch-icon.png" sizes="192x192">」という解答がありましたが、liquidに詳しくないため、どこにどのように設置するかをもう少し分かりやすく教えていただけると助かります。ちなみに当方のテーマはdawnとなります。

株式会社フルバランス · ‎07-04-2023

Jy3さま

ご質問拝見しました。Shopifyのコード編集はどこから始めていいか迷いますよね、、、

アップルタッチアイコンの設定は以下手順で可能かと存じます。

1. アセットもしくはファイルに画像データをアップロード

2. theme.liquidの<head>タグ内に以下コードを設置

　アセットから参照する場合：

　ファイルから参照する場合：

参考：https://qiita.com/eijiSaito/items/70aad4d59cc5427981e1

ご参考になりましたら幸いです。

私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

分からない点があれば、またいつでもご連絡ください。

フルバランス　渡邉

jy3 · ‎07-04-2023

ご担当者さま
この度はご丁寧にご指導くださり誠にありがとうございました。
ご指示の通り（だと思います）設置してみたのですが上手くいきません。

[image: アイコン.jpg]
スマホで試してみたのですがファビコン画像は変わりません。
ちなみにショップファイに画像をアップロードすると勝手にjeg変換されてしまうようです。
お手数ですがよろしくお願いいたします。