FROM CACHE - jp_header
解決済

商品ページにカラーピッカーを設置してユーザーが色を選べるようにしたい

tatsu
Shopify Partner
4 0 1

お世話になっております。

 

スクリーンショット 2022-06-10 19.51.14.png

商品ページに上記画像のようなカラーパレットを設置し、

・お客様に色を選んでいただく。

・カートに追加すると選んだ色のカラーコードの情報がカートに渡される

といった実装は可能でしょうか?

 

色々と調べたのですが、あまり該当する情報が見つからず途方にくれております。

お力を貸していただけると幸いです。

どうぞよろしくお願いいたします。

 

1 件の受理された解決策

Jizo_Inagaki
Shopify Partner
1006 380 697

成功

ブラウザごとに実装されている機能を用いるのであれば以下あたりを参考に 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の読み書きができない場合は、学ばれるかエキスパートやパートナーに依頼されることをお勧めします。

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
- DMや指名による対応はご依頼として有料でのみ承ります。

元の投稿で解決策を見る

2件の返信2

Jizo_Inagaki
Shopify Partner
1006 380 697

成功

ブラウザごとに実装されている機能を用いるのであれば以下あたりを参考に 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の読み書きができない場合は、学ばれるかエキスパートやパートナーに依頼されることをお勧めします。

Jizo_Inagaki | フリーランスのwebデザイナー
- テーマのカスタム承れます。
- 記載した回答で解決できましたらベストソリューションの承認をお願いします。
- DMや指名による対応はご依頼として有料でのみ承ります。
tatsu
Shopify Partner
4 0 1

回答いただきありがとうございます!

いただいた参考記事をもとに一度試してみます!