メタフィールド(リッチテキスト)を商品ページに表示させたい

Topic summary

商品ページにメタフィールド(リッチテキストタイプ)を使って、画像やリンクを含む商品説明文を表示しようとしている。

現状の問題:

  • メタフィールド自体は出力できているが、リンクや画像がフロントエンドに表示されない
  • Dawnテーマのmain-product.templateにコードを記述している

提案された解決策:
Qcoltdから、リッチテキストの内容を正しく表示するためのコード修正案が提示された。具体的には:

  • {{ product.metafields.asweq.test.value | metafield_tag }} のように metafield_tag フィルターを使用する方法
  • これにより太字やリンクなどの書式が正しく表示される

注意点:
複雑な構造の場合は提案されたコードでは対応できない可能性があるとの補足あり。

添付画像やコードスニペットが議論の理解に重要な役割を果たしている。

Summarized with AI on November 16. AI used: claude-sonnet-4-5-20250929.

メタフィールドを利用して、商品説明文の入力欄を複数商品ページに用意しようと思っています。

入力欄には画像やリンクを含む文章を入力する予定であるため、メタフィールドのリッチテキストタイプを利用して実現しようと考えています。

メタフィールドを商品ページに出力することはできたのですが、リンクや画像についてはフロントに出力されませんでした。出力されたフロントの画像を添付します。

ちなみに、メタフィールドをフロントに出力するためのソースコードは下記です。

Dawnのmain-product.templateに記述しています

<section>
 <div>
  {% assign data = product.metafields.asdqwe.test.value %}
   {% for child in data.children %}
    {% if child.type == "heading" %}
     <h{{ child.level }} class="title{{ child.level }}">{{ child.children[0].value }}</h{{ child.level }}>
     {%  elsif child.type == "paragraph" %}
      <p>{{ child.children[0].value }}</p>
       {% endif %}
     {% endfor %}
 </div>
</section>

@knt1

ご質問いただいている、リッチテキストの出力についてですが、下記画像のメタフィールドリッチテキストを利用し登録した内容を表示したいという認識で回答させて頂きます。

記載いただいていたコードを下記のように変更いただければ、太字やリンクなども表示できるかと思います。
複雑な構造になっている場合は、下記コードで対応できない場合もありますので、その際はご了承ください。


ご参考まで
(キュー小坂)