お世話になっております。
商品ページに上記画像のようなカラーパレットを設置し、
・お客様に色を選んでいただく。
・カートに追加すると選んだ色のカラーコードの情報がカートに渡される
といった実装は可能でしょうか？
色々と調べたのですが、あまり該当する情報が見つからず途方にくれております。
お力を貸していただけると幸いです。
どうぞよろしくお願いいたします。
Topic summary
商品ページにカラーピッカーを設置し、選択した色のカラーコードをカートへ渡す方法の可否と実装案を相談。添付画像あり（参考イメージ）。
提案・選択肢:
- ブラウザ標準の入力要素（inputのtype=“color”）で実現可能。参照リンク（MDN、解説記事）が提示。
- より高機能なUIが必要ならJavaScriptライブラリの利用を検討。
- 実装にはHTML・Liquid（テンプレート言語）・JavaScriptの編集が必要。難しければ学習または専門家へ依頼を推奨。
現状・アクション:
- 質問者は提示資料をもとに試行する方針。
- 具体的なカートへのカラーコード受け渡し方法の詳細は未共有。
結末・ステータス:
- 解決は未確定。検証・実装結果の報告待ちで議論は継続中。
ブラウザごとに実装されている機能を用いるのであれば以下あたりを参考に type=“color” を使うことで実現できると思います。
https://developer.mozilla.org/ja/docs/Web/HTML/Element/input/color
https://note.com/tech_malin/n/nc25382597fa7
より高機能な方が良い場合はGoogleなどでJavaScriptのライブラリを調べれば概ね対応できるのではと思います。
以上ですがHTMLやliquidやJSの読み書きができない場合は、学ばれるかエキスパートやパートナーに依頼されることをお勧めします。
1 Like
回答いただきありがとうございます！
いただいた参考記事をもとに一度試してみます！