Mybestpro Members

小森ゆきこプロは朝日新聞が厳正なる審査をした登録専門家です

WordPress プラグインContact Form7 カスタマイズ方法!初心者ワードプレスの疑問

小森ゆきこ

小森ゆきこ

テーマ:WordPressワードプレスの制作


前回にお伝えした【 WordPress お勧めプラグイン Contact Form 7 設定方法】で、「お問い合わせ」ページを作成する手順を説明いたしました。

今回は、プラグイン Contact Form7 を使って「お問い合わせ」ページを更にパワーアップする、カスタマイズする方法をご紹介します。プラグインのメリットデメリットも含めてお伝えしていきます。

お問い合わせページの特徴

Contact Form 7の編集画面を確認します。
今回はフォームの追加、新しい質問項目を作成方法について解説します。

では「テキストフォーム」を実際に追加していきます。


① フォームを編集する

管理画面(ダッシュボード)の左メニュー「お問い合わせ」クリック →
「コンタクトフォーム1」クリック →
フォームのテキストフォームを入力する箇所にカーソルを入れる →
上の青枠の「ラジオボタン」をクリック する

② コンタクトフォーム項目追加編集

「フォームタグ生成:ラジオボタン」の入力ボックス が表示されます。

「名前」に「gender」と入力 →
「オプション」に「男性」と入れてから改行して「女性」と入力する →
「タグ挿入」ボタンをクリック する

③ メッセージ本文を編集

「フォーム」 の中に自動で [radio gender default: “男性” “女性”] が挿入されます.
これがラジオボタン設定のタグになります。

④ 必須項目にしたい場合

自動挿入された [radio gender default: “男性” “女性”] の前にカーソルを入れる→
「性別 (必須)」と入力→
最初に<label> 、最後に </label>を入力する

*「<label>性別 (必須) [radio gender default: “男性” “女性”]</label>」で囲うのは、他の既に入力されているフォームを参考に行いましょう

⑤ メール設定

上のタブ「メール」クリック →
「メッセージ本文」→
性別:[gender] と加筆します →
下の「保存」をクリック

*フォームに加筆や編集したら、必ずメールの「メッセージ本文」も編集して下さい

⑥ 問い合わせフォームを試して送信する

管理画面(ダッシュボード)の左メニューの固定ページ →
「お問い合わせ」ページを表示する →
右上の「プレビュー」クリック →
フォームに必要事項を記入する →
送信ボタンクリック → 送信メッセージが下に表示される →
自分が設定したメールアドレスにフォームからメールが届いているか確認

他にも、「電話番号」「日付」「ドロップダウンメニュー」「チェックボックス」などが簡単に設定出来ます。

Contact Form 7 で問い合わせページの設定やカスタマイズをして、管理運営者にとって、更に訪問客に親切なサイトにしましょう。

◉次回は WordPress プラグインの選び方と注意点! です。

リンクをコピーしました

Mybestpro Members

小森ゆきこ
専門家

小森ゆきこ(クリエーター)

ココフラッペ

WEBサイト、DTP印刷物デザイン制作をはじめ、グループ研修や講習会、コンサルティングを企業で行う。個人や会社の特性や目的に合った丁寧分かりやすい指導サポート。ご依頼内容をレッスンと外注に振り分け可能

小森ゆきこプロは朝日新聞が厳正なる審査をした登録専門家です

関連するコラム

プロのおすすめするコラム

コラムテーマ

コラム一覧に戻る

プロのインタビューを読む

WEBサイトやDTPデザインの困り事を解決・相談できる専門家

小森ゆきこプロへの仕事の相談・依頼

仕事の相談・依頼