Liquid、JavaScriptなどに関する質問
Udemy(Build a Shopify Theme from scratch)https://www.udemy.com/share/1023tcAEIddF9bRn0D/
の教材に沿ってliquidのコード編集をしています。
【質問内容】
コレクションに追加した商品・画像・価格が反映されません。
商品登録はインポートでcsvから引っ張ってきております。
コードは教材と照らし合わせて問題ないかと思っているのですが、どういう問題が考えられますでしょうか。
初歩的な質問で申し訳ございませんが、アドバイス頂けるとありがたいです。
【画像1】
【画像2】
<section class="products section bg-gray">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="title text-center">
<h2>Trending Products</h2>
</div>
</div>
{% assign collection = collections[section.settings.collection] %}
<div class="row">
{% for product in collection.products limit: section.settings.product_limit %}
<div class="col-md-4">
<div class="product-item">
<div class="product-thumb">
{% if product.compare_at_price and product.compare_at_price != product.price %}
<span class="bage">Sale</span>
{% endif %}
<img class="img-responsive" src="{{product.featured_image.src | img_url: '1920x'}}">
<div class="preview-meta">
<ul>
<li>
<a href="{{product.url}}"><i class="fa fa-search"></i></a>
</li>
<li>
<a href=""><i class="fa fa-shopping-cart"></i></a>
</li>
</ul>
</div>
</div>
<div class="product-content">
<h4><a href="{{product.url}}">{{product.title}}</a></h4>
<p class="price">{{product.price | money}}</p>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
</section>
{% schema %}
{
"name": "Homepage Products",
"settings": [
{
"type": "text",
"id": "title",
"label": "Heading",
"default": "Tranding Products"
},
{
"type": "collection",
"id": "collection",
"label": "Collection"
},
{
"type": "range",
"id": "product_limit",
"label": "Product Limit",
"min": 3,
"max": 9,
"default": 6
}
]
}
{% endschema %}
解決済! ベストソリューションを見る。
成功
セクションのプレビューをみると、LiquidのObjectが、そのままテキスト処理されているように見えるので、 {{ product.url }} のように、括弧と変数の間にスペースを入れてみても同じでしょうか?
参考
https://www.shopify.jp/blog/partner-shopify-template-language-liquid-overview
https://shopify.dev/docs/themes/liquid/reference
成功
セクションのプレビューをみると、LiquidのObjectが、そのままテキスト処理されているように見えるので、 {{ product.url }} のように、括弧と変数の間にスペースを入れてみても同じでしょうか?
参考
https://www.shopify.jp/blog/partner-shopify-template-language-liquid-overview
https://shopify.dev/docs/themes/liquid/reference
junichiokamura様
ご連絡ありがとうございます。
早速、ご指摘いただいた所、修正いたしました。
{{ }}のところがうまく読み込めておらず、全て{{ }}を書き直したら直りました。
お忙しいところ、初歩的なミスにアドバイスいただきありがとうございました。
Shopify アカデミーの学習パスと認定スキルバッジExpanding Your Shopify Business Internationallyを活用して、国際的にビジネ...
By Shopify Feb 7, 2025Shopify アカデミーの学習パスB2B on Shopify:立ち上げとカスタマイズで卸売販売に進出しましょう。これら3つの無料コースは、ShopifyストアでB2B機能...
By Shopify Jan 31, 2025サポートの選択肢が増えていく中、最適となる選択の判断が難しくなっているかと存じます。今回は問題の解決に最適となるサポートの選択方法を、紹介させて頂きます。 選択肢のご紹介...
By Mirai Oct 6, 2024