ドロップダウンメニューをボタンに変更

今まで「豆or粉」「挽き具合」を選択する場合にドロップダウンメニューを使っていました。

「豆or粉」の場合は単に選択するだけですが、困ったことに「挽き具合」は選べる数が多いため、検索用のボックスが表示されるようになっていました。

PCの場合はあまり問題にならないのですが、スマホを使用するときはIMEが起動して画面を覆ってしまい見辛くなっていました。

そこでドロップダウンメニューをやめてボタンを並べる方法に変更しました。


function.phpにちょっと追加して…..という方法も公開されているのですが、ボタンのデザインを調整する手間がかかりすぎます。プラグインを探して選んだのが”Variation Swatches for WooCommerce” by ThemeHigh

https://ja.wordpress.org/plugins/product-variation-swatches-for-woocommerce/