# 商品一覧ページの商品名の下に、商品説明を、追加したい

**URL:** <https://community.shopify.com/t/topic/352177>\
**Category:** 技術的なQ＆A\
**Tags:** css, html\
**Created:** [August 26, 2024, 12:38pm UTC](https://community.shopify.com/t/topic/352177 "2024-08-26T12:38:20Z")\
**Posts on this page:** 3\
**Page:** 1

## AI-generated summary

ユーザーはShopifyのDawnテーマで、商品一覧ページの商品名の下に商品説明を追加する方法を質問しています。

**提案された解決策:**

1. **Liquidコードの使用**
   - `{{ product.description }}` をコレクションテンプレート（collection.liquid）に追加
   - 商品ループ内で `{% for product in collection.products %}` を使用し、各商品の説明を表示
   - `{{ product.description | strip_html | truncate: 100 }}` で説明文をHTML除去し100文字に制限可能

2. **メタフィールドの活用**
   - 商品一覧ページ専用の説明文として、メタフィールドを追加する方法が提案されました
   - 具体的な設定方法は外部記事で解説されています

表示位置や文字数制限は、コードを適宜編集することで調整可能です。

<div class="post-metadata">

**Author:** ![mira0](https://avatars.discourse-cdn.com/v4/letter/m/e68b1a/32.png) [@mira0](https://community.shopify.com/u/mira0)\
**Post date:** [August 26, 2024, 12:38pm UTC](https://community.shopify.com/t/topic/352177/1 "2024-08-26T12:38:20Z")

</div>

テーマDawnを使用しています。

商品一覧ページの、商品名の下に商品説明文を追加したいです。商品説明から引っ張ってくるのではなく、この部分を個々に文章の設定は可能でしょうか？

---

<div class="post-metadata">

**Author:** ![Anonymous\_44fbe07fc59d9ccaacd70575fd5a5155](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/anonymous_44fbe07fc59d9ccaacd70575fd5a5155/32/194200_2.png) [@Anonymous\_44fbe07fc59d9ccaacd70575fd5a5155](https://community.shopify.com/u/Anonymous_44fbe07fc59d9ccaacd70575fd5a5155)\
**Post date:** [August 27, 2024, 12:33am UTC](https://community.shopify.com/t/topic/352177/2 "2024-08-27T00:33:06Z")

</div>

ご質問拝見しました。

まず商品説明は以下コードで出力が可能でございます。

```markup
{{ product.description }}

```

こちらを商品一覧ページなので、このコードをコレクションテンプレート（collection.liquid）や商品一覧テンプレートに追加することで、各商品の説明が一覧に表示されます。

挿入時は商品によって挿入する文章を変更することになるので、もう少しコードを編集していかが具体的な挿入方法になります。

```markup
{% for product in collection.products %}
  
    ## {{ product.title }}
    
      
        
      
    

    追加部分ここから
      {{ product.description | strip_html | truncate: 100 }}
    
ここまで
    商品詳細を見る
  

{% endfor %}

```

strip\_html | truncate: 100 こちらに関しては説明に入っているHTMLを除いて文字数を100文字に制限しております。

こちらの有無や表示位置に関しては適宜編集していただければと思いますのでよろしくお願いいたします！

ご参考までにしていただけますと幸いです。

なにかご質問があれば、お気軽にご相談ください。  
お悩み解決できましたら、ベストアンサー、いいねいただけると励みになります。  
何卒よろしくお願いします。

株式会社フルバランス

---

<div class="post-metadata">

**Author:** ![Anonymous\_5168086324d6fa4637c896de39bb248c](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/anonymous_5168086324d6fa4637c896de39bb248c/32/28647_2.png) [@Anonymous\_5168086324d6fa4637c896de39bb248c](https://community.shopify.com/u/Anonymous_5168086324d6fa4637c896de39bb248c)\
**Post date:** [August 29, 2024, 3:01am UTC](https://community.shopify.com/t/topic/352177/3 "2024-08-29T03:01:48Z")

</div>

商品一覧ページ用の説明文は、メタフィールドを追加することで設定が可能です。

具体的な方法は、こちらの記事にまとめました。

[https://knowledge-service.net/card-product-introduction/](https://knowledge-service.net/card-product-introduction/)