FROM CACHE - jp_header

セクションの作成について

s_yamaoka
Shopify Partner
15 0 1

下記のようなセクションを自作して、HOMEページ(TOPページ)に組み込みたいのですが、一部(img部分)がなぜか表示されません。

テキスト部分(SAMPLEなど)は表示され、さらにtheme.liquidに読み込ませたCSSも効いているような感じですが、img部分は全く表示されません。

原因がわかれば教えてください。

 

<div class="about">
  <p class="sectionHeding">
    SAMPLE
    <br>
    <small>sample</small>
  </p>
  <div class="about-img">
    <div class="about-slider">
      <div class="item slick-slide">
        <a href="XXX">
          <img src="XXX" alt="sampleについて">
        </a>
      </div>
    </div>
  </div>
</div>

{% schema %}
  {
"presets": [
    {
      "name": "ABOUT",
      "category": "image"
    }
  ]
  }
{% endschema %}

{% stylesheet %}
{% endstylesheet %}

{% javascript %}
{% endjavascript %}

 

 

1件の返信1

Jizo_Inagaki
Shopify Partner
1006 380 697

単純に考えれば画像のパスが間違っているのではと思いますので確認されることをお勧めします。

画像の置き場所がわからないのでなんとも言えませんが、assetsディレクトリ内に入れているのであれば以下のドキュメントなどを参照ください。

https://shopify.dev/api/liquid/filters/url-filters#asset_img_url

なお「slick-slide」というクラス名が少々気にはなりますので、画像が本当にブラウザで取得できていないかを開発者ツールで確認されることもお勧めします。
JSやCSSの影響で非表示になっているだけの可能性もありますので、Slickを使われている場合はSlickのドキュメントも参照ください。

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