お客さんの書いた赤色ってどの赤色なのか、カラーコード書いてもらうのも大変だし、う～ん悩む…！！
お客様の希望を入力してもらって送信するような使い方をする場合に、カラーピッカーを使った色選択をして送信する方法をご紹介します。
「Color Picker for Contact Form 7」プラグインを使う方法
ContactForm7自体に、カラー選択できる機能はありませんが、プラグインを使うことで解決できます。
※実際に使用したのはWordpress5.3ですが、利用できました。未検証が気になる方は後述するjsでの実装をお試しください。
使い方はカンタン！
プラグインを有効化してから、ContactForm7のフォームを見ると「color」が選べるようになっているので、テキストやテキストエリアのように表示させたいところにポチッと入れるだけ。
これで、お客様はカラーピッカーで色を選択でき、受け取り側はカラーコードで内容を受け取れるようになります。
「jscolor.js」をContact Form7で使う
あまりプラグインを増やしたくない方は、こちらのjscolor.jsを使う方法がおすすめです。
こちらでは実装していないので、紹介だけになりますが、こちらの記事を参考にしてみてください。
Integrating color picker to contact form 7 plugin（英文）
※画像はGoogle Chromeで翻訳したものになります。
オーダーメイド型の商品の申し込みフォームとかに、便利なのでぜひ使ってみてくださいね！
