WordPressでお問い合わせフォームを簡単に作れるプラグインです。
Contact Form 7は簡単に導入でき、HTMLやCSSの専門的な知識がなくてもお問い合わせフォームが作れます。このサイトではデフォルトのまま使用しています。
他のサイト制作でプルダウン（ドロップダウンメニュー）、電話番号などを追加したので、忘備録としてアレンジ方法を説明します。
ドロップダウンメニューの作成方法
左側の「お問い合わせ」をクリック、次に「コンタクトフォーム」の編集をクリックします。デフォルトは名前、メールアドレス、題名、メッセージ本文のみのシンプルな文面です。
「ドロップダウンメニュー」をクリックします。
- 項目タイプに必須にする場合はチェックを入れます。
- 名前はmenu-areaと入力。
- オプションに大阪府、京都府、兵庫県と1行ことに入力。
- 空の項目を先頭に挿入するにチェック。（空の項目が要らない場合はチェックを外す。）
タグを挿入をクリックするとプルダウンメニューができます。
記述は <label>[select menu-area include_blank “大阪府” “兵庫県” “京都府”]</label>
メニューをクリックしたら他のメニューが出る分岐作成方法
上記で作成したプルダウンメニューをクリックすると、さらにメニューが出てくると活用も増えますし、スッキリとしたレイアウトが作成できます。
Contact Form 7 – Conditional Fieldsをインストール
プラグインの新規追加から「Contact Form 7 – Conditional Fields」をインストールします。有効化をクリック。
グループを作成
有効化すると項目が増えています。「Conditional Fields Group」をクリックします。
グループ名はosakaにしています。タグを挿入をクリックします。
分岐するドロップダウンメニューの作成
[group osaka]と[/group]の間にカーソルを入れて「ドロップダウンメニュー」クリックします。
- 名前はmenu-osakaと入力。
- オプションに大阪市、堺市、豊中市と1行ことに入力。
タグを挿入をクリック、保存します。記述は[group osaka][select menu-osaka “大阪市” “堺市” “豊中市”][/group] です。
プルダウンメニュー条件の設定方法
「Conditional fields」をクリックし、グリーンの「add new conditional rule」をクリックします。
もし「menu-area」で「大阪府」を選択したら「group osaka」が出現しますという意味です。
保存をクリックします。
このように、「大阪府」を選択した時に、「大阪市・堺市・豊中市」のプルダウンメニューが新たに出現します。
京都府・兵庫県も作成
大阪府と同様にグループ名はkyoto、hyogoにします。タグを挿入をクリックします。[group kyoto]と[/group]、[group hyogo]と[/group]の間にカーソルを入れて「ドロップダウンメニュー」クリックします。
- 名前はmenu-kyoto、menu-hyogoと入力。
- オプションに京都府が京都市、宇治市、兵庫県が神戸市、西宮市と1行ことに入力。
タグを挿入をクリック、保存します。
「Conditional fields」をクリックし、グリーンの「add new conditional rule」をクリックします。大阪府同様に記入します。
Show「kyoto」if 「menu-area」「equals」「京都府」
Show「hyogo」if 「menu-area」「equals」「兵庫県」 保存します。
以上で3種類のエリアから、3種類の市が選択できるようになります。
コメント