FROM CACHE - jp_header

外部からLINEアイコンが読み込めない。

解決済
kameon
新規メンバー
7 0 0

はじめまして、よろしくお願いいたします。

テーマ:Brooklyn

LINEアイコンを外部から読み込ませたいと思い、以下の手順を試しましたが、うまく読みこめません。
外部ファイルを読み込む方法、この他LINEアイコンを追加する方法がございましたらご教示ください。

1.IcoMoonというサイトでLINEアイコンを作成し、外部サーバーにアップロード。
https://icomoon.io/app/#/select

2.「theme.liquid」に外部サーバーにアップロードしたアイコン表示用のCSSを、直接URLを絶対パスにて読み込ませます。

3.「social-sharing.liquid」の表示させたい箇所にアイコン用のクラスを指定。

以上です。

アイコン表示箇所に□は表示されますが、画像が読み込まれてない状態になります。

修正方法や、他にLINEアイコンの表示方法がございましたらご教示くださいますようお願いいたします。
よろしくお願いいたします。

1 件の受理された解決策

ベストソリューション
Jizo_Inagaki
Shopify Partner
631 255 577

成功

一般的な方法ですが以下をお勧めします。

  • 開発者ツールでエラーを確認する
  • 画像自体が壊れていないか確認する
  • 画像のパーミッションを確認する
  • 画像を置いているサーバーが外部からのファイル呼び出しに対応しているか確認する
  • アイコンを作成したサイトのドキュメントを確認する
  • CSSの記述を確認する(他の画像名に変更して試すなども)

上記のいずれも問題ない場合は原因特定が難しいように思いますので、エキスパートや業者に依頼されることをお勧めします。

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
- DMや指名による対応はご依頼として有料でのみ承ります。

元の投稿で解決策を見る

2件の返信2
Jizo_Inagaki
Shopify Partner
631 255 577

成功

一般的な方法ですが以下をお勧めします。

  • 開発者ツールでエラーを確認する
  • 画像自体が壊れていないか確認する
  • 画像のパーミッションを確認する
  • 画像を置いているサーバーが外部からのファイル呼び出しに対応しているか確認する
  • アイコンを作成したサイトのドキュメントを確認する
  • CSSの記述を確認する(他の画像名に変更して試すなども)

上記のいずれも問題ない場合は原因特定が難しいように思いますので、エキスパートや業者に依頼されることをお勧めします。

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
- DMや指名による対応はご依頼として有料でのみ承ります。
kameon
新規メンバー
7 0 0

ありがとうございます!
また何かございましたらよろしくお願いいたします。