Liquid、JavaScriptなどに関する質問
テーマDawnを使用しています。
商品一覧ページの、商品名の下に商品説明文を追加したいです。商品説明から引っ張ってくるのではなく、この部分を個々に文章の設定は可能でしょうか?
解決済! ベストソリューションを見る。
成功
ご質問拝見しました。
まず商品説明は以下コードで出力が可能でございます。
{{ product.description }}
こちらを商品一覧ページなので、このコードをコレクションテンプレート(collection.liquid)や商品一覧テンプレートに追加することで、各商品の説明が一覧に表示されます。
挿入時は商品によって挿入する文章を変更することになるので、もう少しコードを編集していかが具体的な挿入方法になります。
{% for product in collection.products %}
<div class="product-item">
<h2>{{ product.title }}</h2>
<div class="product-image">
<a href="{{ product.url }}">
<img src="{{ product.featured_image | img_url: 'medium' }}" alt="{{ product.title }}">
</a>
</div>
<div class="product-description">追加部分ここから
{{ product.description | strip_html | truncate: 100 }}
</div>ここまで
<a href="{{ product.url }}" class="product-link">商品詳細を見る</a>
</div>
{% endfor %}
strip_html | truncate: 100 こちらに関しては説明に入っているHTMLを除いて文字数を100文字に制限しております。
こちらの有無や表示位置に関しては適宜編集していただければと思いますのでよろしくお願いいたします!
ご参考までにしていただけますと幸いです。
なにかご質問があれば、お気軽にご相談ください。
お悩み解決できましたら、ベストアンサー、いいねいただけると励みになります。
何卒よろしくお願いします。
株式会社フルバランス
成功
ご質問拝見しました。
まず商品説明は以下コードで出力が可能でございます。
{{ product.description }}
こちらを商品一覧ページなので、このコードをコレクションテンプレート(collection.liquid)や商品一覧テンプレートに追加することで、各商品の説明が一覧に表示されます。
挿入時は商品によって挿入する文章を変更することになるので、もう少しコードを編集していかが具体的な挿入方法になります。
{% for product in collection.products %}
<div class="product-item">
<h2>{{ product.title }}</h2>
<div class="product-image">
<a href="{{ product.url }}">
<img src="{{ product.featured_image | img_url: 'medium' }}" alt="{{ product.title }}">
</a>
</div>
<div class="product-description">追加部分ここから
{{ product.description | strip_html | truncate: 100 }}
</div>ここまで
<a href="{{ product.url }}" class="product-link">商品詳細を見る</a>
</div>
{% endfor %}
strip_html | truncate: 100 こちらに関しては説明に入っているHTMLを除いて文字数を100文字に制限しております。
こちらの有無や表示位置に関しては適宜編集していただければと思いますのでよろしくお願いいたします!
ご参考までにしていただけますと幸いです。
なにかご質問があれば、お気軽にご相談ください。
お悩み解決できましたら、ベストアンサー、いいねいただけると励みになります。
何卒よろしくお願いします。
株式会社フルバランス
商品一覧ページ用の説明文は、メタフィールドを追加することで設定が可能です。
具体的な方法は、こちらの記事にまとめました。
2023年初頭、Shopifyペイメントアカウント、及びShopifyアカウント全体のセキュリティを強化する為の変更が適用されました。ユーザーのアカウントセキュリティを強化す...
By Mirai Sep 29, 2024概要: 年末/年明けは、消費者が最もショッピングを行う時期の一つです。特に、ブラックフライデー・サイバーマンデー(BFCM)は、世界中で注目される大規模なセールイベントであ...
By JapanGuru Sep 25, 2024APIに関するShopifyサポートShopifyのデフォルト機能では特定の目標を達成するために外部アプリケーションの使用を検討していますか? そんな時はプログラミングの専...
By JapanGuru Sep 22, 2024