# 商品ページで商品写真の下に商品説明文を表示させたい **URL:** \ **Category:** 技術的なQ＆A\ **Created:** [October 10, 2022, 5:42pm UTC](https://community.shopify.com/t/topic/158591 "2022-10-10T17:42:29Z")\ **Posts on this page:** 5\ **Page:** 1 ## AI-generated summary 商品ページの「商品画像」の下に説明テキストを表示したいという要望。現状（例：Dawnテーマ）は画像と商品情報が横並びで、画像下へ任意テキストを入れるのはテーマエディタ（ノーコード）だけでは難しい。 提案・選択肢: - ノーコード寄り: テーマを変更する／商品用メタフィールドを作成しブロックで表示。ただしエディタでは画像（メディア）領域の直下に差し込めない場合が多い。 - コード編集: 作成したメタフィールドの出力タグを該当のproductテンプレート（.liquid）のメディア出力部分直下に貼り付けて表示。初心者でも比較的容易な軽作業とされる。 補足用語: - メタフィールド: 商品に任意の追加情報を持たせるカスタム項目。 - Liquid: Shopifyのテンプレート言語で、テーマの表示位置や内容を制御。 質問への回答要旨: 1～2行の短文でも、画像直下に置く場合は基本コード編集が必要（テーマが対応していない限り）。 進捗・結論: 参考リンクが提示され、実装方針（Liquidでメタフィールドを画像直下に出力）が示されたが、実装完了報告はなく議論は実質未解決。
**Author:** ![Anonymous\_f3904c962f1f4025a9649d0e22fc8a10](https://avatars.discourse-cdn.com/v4/letter/a/65b543/32.png) [@Anonymous\_f3904c962f1f4025a9649d0e22fc8a10](https://community.shopify.com/u/Anonymous_f3904c962f1f4025a9649d0e22fc8a10)\ **Post date:** [October 10, 2022, 5:42pm UTC](https://community.shopify.com/t/topic/158591/1 "2022-10-10T17:42:29Z")
お世話になっております。 商品ページで商品写真の下に商品説明文を表示させたいです。 もし方法をご存じの方がいらっしゃいましたら、教えていただきたいです。 よろしくお願いいたします。 ---
**Author:** ![Anonymous\_3669bb4b7b6a3471042090ac49b19f2c](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/anonymous_3669bb4b7b6a3471042090ac49b19f2c/32/2990_2.png) [@Anonymous\_3669bb4b7b6a3471042090ac49b19f2c](https://community.shopify.com/u/Anonymous_3669bb4b7b6a3471042090ac49b19f2c)\ **Post date:** [October 11, 2022, 2:29am UTC](https://community.shopify.com/t/topic/158591/2 "2022-10-11T02:29:32Z")
こんにちは！ 商品ページのカスタマイズということで、下記の記事など参考になりませんでしょうか？ [https://ichyaku.com/shopify-customize-product-page/](https://ichyaku.com/shopify-customize-product-page/) どのテーマを使用されているかにもよるのですが、例えばDawnの場合の商品ページですと、商品画像と説明文は横並びのレイアウトになっています。 ![スクリーンショット 2022-10-11 11.13.11.png](https://canada1.discourse-cdn.com/shopifyforum/original/3X/8/1/815cb2cbc3b824bfde68c9d9136577278568f4d5.jpeg) あこさん様のご希望が、左「商品画像」と右「商品情報エリア」の位置を横並びから縦並びにする、というイメージの場合ですとコードの編集が必要になってくるかと思います。 コードの編集を行わない方法だと ・テーマを変更する ・商品説明のテキストとして商品ページ用のメタフィールドを新規作成し、テーマの「カスタマイズ」からブロックを追加し、任意の場所に表示させる などの方法が考えられます。 参考： [https://homupedia.com/shopify-customize-product-page.html](https://homupedia.com/shopify-customize-product-page.html) いかがでしょうか。 何か少しでもお力になりましたら幸いです！よろしくお願いします！ ---
**Author:** ![Anonymous\_f3904c962f1f4025a9649d0e22fc8a10](https://avatars.discourse-cdn.com/v4/letter/a/65b543/32.png) [@Anonymous\_f3904c962f1f4025a9649d0e22fc8a10](https://community.shopify.com/u/Anonymous_f3904c962f1f4025a9649d0e22fc8a10)\ **Post date:** [October 11, 2022, 2:52am UTC](https://community.shopify.com/t/topic/158591/3 "2022-10-11T02:52:20Z")
株式会社おいかぜ様 ご返答ありがとうございます。 やはりコード編集が必要ですよね・・・ レイアウトはそのままで、「商品画像」の下に1、2行の「テキスト」でもコード編集は必要でしょうか？ 当初、株式会社おいかぜ様が教えてくださった［・商品説明のテキストとして商品ページ用のメタフィールドを新規作成し、テーマの「カスタマイズ」からブロックを追加し、任意の場所に表示させる］をと思っていたのですが、テーマのカスタマイズ上では商品画像そのものが編集できずでして(T T) イメージをhtmlで表記すると ![Tシャツ背面]() Tシャツ背面 なのですが・・・ ※imgは商品ページの「メディア」 よろしくお願いいたします。 ---
**Author:** ![Anonymous\_3669bb4b7b6a3471042090ac49b19f2c](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/anonymous_3669bb4b7b6a3471042090ac49b19f2c/32/2990_2.png) [@Anonymous\_3669bb4b7b6a3471042090ac49b19f2c](https://community.shopify.com/u/Anonymous_3669bb4b7b6a3471042090ac49b19f2c)\ **Post date:** [October 11, 2022, 3:34am UTC](https://community.shopify.com/t/topic/158591/4 "2022-10-11T03:34:17Z")
> レイアウトはそのままで、「商品画像」の下に1、2行の「テキスト」でもコード編集は必要でしょうか？\> \> 当初、株式会社おいかぜ様が教えてくださった［・商品説明のテキストとして商品ページ用のメタフィールドを新規作成し、テーマの「カスタマイズ」からブロックを追加し、任意の場所に表示させる］をと思っていたのですが、テーマのカスタマイズ上では商品画像そのものが編集できずでして(T T) 結論から言いますと、基本的にエディタで可能なカスタマイズ以上の変更となると、コードの編集が必要になるかと思います。。 メタフィールドを作成し、任意の場所に出力するといった作業自体は、メタフィールドの出力タグを表示させたいページのliquidファイルの該当箇所にコピペするだけの軽作業なので、初心者の方やコードの知識がそれほど無い方でも、まだ難易度は低いのかなあと思います。 参考になりそうなサイトをいくつかぶら下げておきます！ [https://zenn.dev/airi/articles/fc2c9e75da2fb0](https://zenn.dev/airi/articles/fc2c9e75da2fb0) [https://100webdesign.jp/services/web\_knowhow/shopify-customize/web\_knowhow-23574/](https://100webdesign.jp/services/web_knowhow/shopify-customize/web_knowhow-23574/) ---
**Author:** ![Anonymous\_f3904c962f1f4025a9649d0e22fc8a10](https://avatars.discourse-cdn.com/v4/letter/a/65b543/32.png) [@Anonymous\_f3904c962f1f4025a9649d0e22fc8a10](https://community.shopify.com/u/Anonymous_f3904c962f1f4025a9649d0e22fc8a10)\ **Post date:** [October 11, 2022, 3:45am UTC](https://community.shopify.com/t/topic/158591/5 "2022-10-11T03:45:55Z")
ご迅速なご返答、ありがとうございます。