『Jazzy Forms』のラジオボタンの使い方・作成方法

ラジオボタン

WordPressで計算フォームを設置できるプラグイン『Jazzy Forms』で出来ることを色々紹介して行きます。【Radio Buttons】を使った簡単な計算について説明して行きます。

『Jazzy Forms』の【Radio Buttons】の使い方

新しく計算フォームの名前をつけますので【new】をクリックしてここでは【TEST7】としています

ラジオボタン

まずは管理画面で以下の4つのフォームを右にドラッグ アンド ドロップします

ラジオボタン

使用するフォームとタイトル
  • 【Free HTML】:果物を選んで購入個数を決めてください
  • 【Radio Buttons】:果物を選んでください
  • 【Input】:購入する個数を入力して下さい
  • 【Output】:購入金額は以下の通りです

では1つずつ見ていきます。

Jazzy Formsで【Radio Buttons】を使った計算表の作成

ラジオボタンは色んな使い方がありますが、ここでは単純な計算をラジオボタンを使って行います。

Jazzy Forms【Free HTML】フォームの作成

【Free HTML】フォームの入力内容
  • HTML codeを入力します。(文字だけでもいいですし私は自分のブログの見出し(h4)を使っています)

ラジオボタン

Jazzy Forms【Radio Buttons】フォームの作成

【Drop-down Menu】フォームの作成内容
  • ①タイトルを入力します(任意)
  • ②計算する為に使うIDを入力(任意)
  • ③【Add】をクリックすると項目が増えます
  • ③計算したいタイトル(左)とその値段(右)を入力します

ラジオボタン

Jazzy Forms【Input】フォームの作成

【Input】フォームの作成内容
  • ①タイトルを入力します(任意)
  • ②計算する為に使うIDを入力(任意)
  • ③Defaultは最初に表示したい値なので0なら0もしくは空欄でいいですがアレンジして使って下さい

ラジオボタン

Jazzy Forms【Output】フォームの作成

【Output】フォームの作成内容
  • ①タイトルを入力します(任意)
  • ②さらに計算を続ける場合は計算する為に使うIDを入力(任意)
  • ③Formulaには上記のIDを使い計算を入力します(ここではA*B)

ラジオボタン

記事にショートコードをコピーして挿入する

ラジオボタンの計算のシヨートコード
  • ①【General】:【General】タブをクリック
  • ②【Shortcode】:ショートコードをコピー
  • ③【Save】:保存します
  • あとはコードを記事のお好きな場所に張り付ければ終了です

ラジオボタン

以下が出来上がった計算表です
  • 果物を選んで購入個数を決めてください

Jazzy Formsの【Radio Buttons】のまとめ

【Radio Buttons】は決められた項目に対して値を設定して他の値との計算などに使えます。例えばお店のメニューが決まっていて料金も決まっていて後は個数が分かれば代金が分かるわけです。

ラジオボタンはドロップダウンメニューよりも選択項目が少ない場合などに適していると思います。使い方はアレンジ次第で広がると思います。