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

sinta
新規メンバー
1 0 0

下記のようなセクションを自作して、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 %}

 

 

0 件の「いいね!」
Jizo_Inagaki
航海者
441 162 445

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

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

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

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

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
0 件の「いいね!」