Liquid、JavaScriptなどに関する質問
下記のようなセクションを自作して、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 %}
単純に考えれば画像のパスが間違っているのではと思いますので確認されることをお勧めします。
画像の置き場所がわからないのでなんとも言えませんが、assetsディレクトリ内に入れているのであれば以下のドキュメントなどを参照ください。
https://shopify.dev/api/liquid/filters/url-filters#asset_img_url
なお「slick-slide」というクラス名が少々気にはなりますので、画像が本当にブラウザで取得できていないかを開発者ツールで確認されることもお勧めします。
JSやCSSの影響で非表示になっているだけの可能性もありますので、Slickを使われている場合はSlickのドキュメントも参照ください。
YouTubeは世界で2番目にアクセス数の多いウェブサイトであり、80カ国語、100カ国以上からのアクセスがあります。米国では、1日で10億時間以上のコンテンツが視聴されているそう...
By rinaflora Jun 4, 2023ゴムの街とも呼ばれる久留米の老舗工場で作成されたスニーカーを販売しているPERSICAストア。Shopifyを選ぶ理由と商品への思い。
By Mirai May 29, 2023EコマースのEメールマーケティングは適切なタイミングで、適切にパーソナライズされたメッセージを顧客に届ける方法であり、厳しさを増すインターネットの規制を受ける必要もありません。こ...
By Nanami May 21, 2023