# 各商品ページ毎にカラバリ表示

**URL:** <https://community.shopify.com/t/topic/72573>\
**Category:** 技術的なQ＆A\
**Created:** [October 18, 2021, 7:08am UTC](https://community.shopify.com/t/topic/72573 "2021-10-18T07:08:38Z")\
**Posts on this page:** 3\
**Page:** 1

## AI-generated summary

BoundlessテーマのShopify商品ページをLiquidからJSONテンプレートへ移行後、各カラーごとに個別ページを作り、ZOZOTOWNのように色展開を一覧表示・相互リンクしたいが、セクション設定が他商品に連動してしまい個別化できない課題。

- 技術背景: LiquidはShopifyのテンプレート言語。JSONテンプレートはセクション構成をJSONで管理し、同一テンプレートでは設定が共有されやすく、商品ごとの独立編集が難しい。メタフィールドは商品固有のカスタムフィールド。
- 現状: 「他カラーはこちら」のaタグで手動リンク。
- 提案: セクションブロックでメタフィールド（テキスト）からHTMLを出力し、商品単位で色バリエーションリンクを個別管理。より高度には、Liquidで関連アイテムを動的に出力するセクションブロックを作成。
- 進捗・結論: 提案は受け入れられ、メタフィールド活用で検討継続。具体的な実装や最終解は未確定で、議論は継続中。画像は参考で、理解の中心ではない。

<div class="post-metadata">

**Author:** ![Meow25](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/meow25/32/237835_2.png) [@Meow25](https://community.shopify.com/u/Meow25)\
**Post date:** [October 18, 2021, 7:08am UTC](https://community.shopify.com/t/topic/72573/1 "2021-10-18T07:08:38Z")

</div>

現在テーマでBoundlessを使っております。

商品ページは下記サイトを参考にliquidからjsonに切り替えしました。

[https://rewired.cloud/how-to-migrate-your-theme-to-json-templates/](https://rewired.cloud/how-to-migrate-your-theme-to-json-templates/)

全てのカラーをフェイスで見せるために今はカラー毎に商品ページを作っております。

ZOZOタウンみたいに表示させるためです。

 ![スクリーンショット 2021-10-18 15.39.40.png](https://canada1.discourse-cdn.com/shopifyforum/original/3X/5/7/5756c8a6ce2f75719d15d3b11ba43f12ac80cc14.png)

商品ページで他カラーの商品ページに推移させたいと思っており、jsonにすればそれぞれのページを編集してカラバリ見せられるかなと思っていたのですがうまくいかず、、（商品ページのセクションってそれぞれ独立しておらず1つ設定したら他商品ページも連動してしまうのですね、、）

何かいい方法ありませんか？

現状では『他カラーはこちら』という感じでaタグ使って飛ばしています。

セクションをそれぞれの商品ページで独立させる方法

もしくはそれに近い方法でアイデアがあればご教示いただきたいです。

---

<div class="post-metadata">

**Author:** ![mrtc](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/mrtc/32/109726_2.png) [@mrtc](https://community.shopify.com/u/mrtc)\
**Post date:** [October 18, 2021, 9:14am UTC](https://community.shopify.com/t/topic/72573/2 "2021-10-18T09:14:19Z")

</div>

セクションブロックで実装するなら、メタフィールドのテキストフィールドを使ってHTMLを出力すれば、個別に対応できるかと思います。

また、難易度が高くなりますがLiquidを駆使すれば動的に関連アイテムを出力させるセクションブロックを作ることも可能です。

---

<div class="post-metadata">

**Author:** ![Meow25](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/meow25/32/237835_2.png) [@Meow25](https://community.shopify.com/u/Meow25)\
**Post date:** [October 18, 2021, 9:44am UTC](https://community.shopify.com/t/topic/72573/3 "2021-10-18T09:44:55Z")

</div>

ありがとうございます！！！！！

メタフィールドうまく使ってできないものかと思考しておりました！

いつも他の方へのアンサー拝見しております！

サイトのブログもすごく勉強になります！

本当にありがとうございます！！！！！！