簡単にフォームの作成ができるシンプルフォーム使い方

以前簡単にWordPressでフォームを作成できるシンプルフォームのリリースを紹介させていただきました。
インファクトで開発した、シンプルフォームの使い方を紹介いたします。
簡単にフォームが作成できるので、是非活用してみてくださいませ。

テンプレートを使用すれば設定が簡単

フォームは新規作成で真っ白なものから作成もできますが、シンプルフォームでは「基本テンプレート」から作成するのがオススメです。
基本テンプレートには

  • 基本フォーム項目(名前、メールアドレス)
  • 確認画面
  • 管理者宛メール
  • 自動返信メール

が最初から設定され、セットで入っています。
基本テンプレートを使用しない場合は1つ1つ設定しなければならないので、最初から基本テンプレートで設定がしてあるのでフォームを作成する際は基本テンプレートを使用してください。

使用方法

新規作成をクリックします。

基本テンプレートをクリックします。

すると自動で基本のフォームの形が生成されます。
ここから必要な項目を付け足したり設定を行なって行きます。

入力項目はドラッグ&ドロップで簡単に編集

フォームの入力画面はこのようなものになっています。

項目追加方法

左側のフィールドを右側のプレビュー画面にドラッグすることで、好きな場所に項目を追加することができます。

項目の入れ替え

プレビュー画面でドラッグすることで、順番の入れ替えが可能です。

項目の編集・削除

項目を選択することで、左側に項目を編集する画面が表示されます。
削除したい場合は右上の「×」をクリックします。

設定できる項目

主な項目を紹介します。

テキストボックス

テキストボックスを設定できます。

テキストエリア

文字量が多いものを入力できる、テキストエリアを設定できます。

ドロップダウン

ドロップダウンで項目を選択することができます。

住所

郵便番号から住所を入力する項目です。
郵便番号を入れると、自動で市区町村まで入力がされます。

チェックボックス

複数チェックを入れることができる項目です。

ラジオボタン

選択肢を1つ選ぶことができる項目です。

ファイルアップロード


ファイルをアップロードすることができます。
デフォルトの状態でjpg、png、pdf、Wordファイル、Excelファイルをアップロードすることができます。
設定で他の拡張子のファイルを指定することも可能です。

名前


基本テンプレートを使用すると、自動でカナが生成されるようになっています。

メールアドレス


基本テンプレートでそのまま使用すると、この項目に入ったメールアドレスに自動返信メールが送信されます。
また、確認用の項目も表示されます。
確認用の項目はペーストできないようにしているので、メールアドレスの間違い防止と迷惑メールの防止になります。

項目のカスタマイズ

各項目、必須や背景に文字を入れて分かりやすくすることが可能です。

必須項目


必須項目にチェックを入れると、入力の必須項目・必須項目であることが分かりやすくなります。

サンプルテキスト(背景文字・プレースホルダー)


入力項目の背景に文字を設定することができます。
アドバンスオプションを開き、サンプルテキストの欄に記入することで、入力項目の箇所に薄くテキストが表示されます。

メールの送信先や自動返信メールの設定方法

設定の画面で、フォームの名前やメールの送信先、完了画面を設定することができます。

フォーム名の変更


設定の一般でフォーム名を変更することができます。
この箇所を修正することで、一覧ページの名前が変更されます。

メールの設定


通知の設定から修正することができます。

管理者宛メール


①フォームが送信された際の、送信先メールアドレスを設定できます。
②複数先に送信したい場合記入します。半角カンマ「,」で複数指定することができます。
③メールの件名を変更できます。分かりやすい件名を設定してください。
④どのメールから受信されるか設定できます。
⑤メッセージを変更できます。{all_fields}はフォームの内容を反映させるものになりますので、削除しないようにしてください。

自動返信メール


①フォームで入力した内容を読み込むので、この欄は触らないようにしてください。
②メールの件名を変更できます。
③メールを受信した際表示される名前を設定します。
④メールを受信した際表示されるメールアドレスを設定します。
⑤自動返信メールから「返信する」をクリックした場合の返信先を設定します。
⑥送信するメッッセージを変更できます。{all_fields}はフォームの内容を反映させるものになりますので、削除しないようにしてください。

確認画面の設定

フォームの送信が完了した際の設定ができます。
設定は3種類の中から選択できます。

メッセージ
メッセージのみを表示させます。フォームの箇所がメッセージに切り替わります。
ページ表示
同じWordPress内で作成している固定ページを選択する際に使用します。
URLを開く
送信完了した際に、URLでしたページへ推移します。

保存・ページ反映方法

保存方法


右上の「保存」ボタンをクリックすると編集したフォームが保存されます。
保存をしてからページを閉じるようにお願いします。

ページ反映方法


右上の「埋め込む」ボタンをクリックするとフォームのコードが発行されます。


その後、フォームを表示させたいページにコードを貼付けするだけで、フォームが反映されます。

問合せ内容確認方法

問合せがあった際にメールで通知がくるのはもちろん、管理画面から確認・CSV形式でダウンロードすることが可能です。


メニューから「問合せ受付一覧」を選択し、受付を確認したいフォームを選択していただくと、受付した内容一覧が確認できます。
詳細な内容を確認したい場合は「表示」をクリックすることで、確認することができます。

Excelで内容を確認したい場合は「ダウンロード出力」することで、CSV形式でのダウンロードが可能です。

CSVファイルはそのまま開くと文字化けしておりますので、メモ帳等で修正してからExcelで開くようにしましょう。

文字化けを直す方法はこちらをご覧ください。

CSVファイルの文字化けを直す方法(Windows編)
https://www.infact1.co.jp/staff_blog/webmarketing/tool-app-soft/20674/

CSVファイルの文字化けを防ぐ方法(Mac編)
https://www.infact1.co.jp/staff_blog/webmarketing/blog-use/20553/

おわりに

シンプルフォームの作成方法を紹介させていただきました。
セキュリティ対策もしており簡単にフォームが作成できるので、シンプルフォームでフォームを作成することをオススメしております。
よりよく使えるようブラッシュアップも行なっております。

古いブラウザーですと編集画面が表示されない場合があります。
その場合は最新のブラウザーに更新していただきますようお願いいたします。

  • シェア
  • twitter
The following two tabs change content below.
名畑かなえ
株式会社インファクトのディレクターです。
フロントエンジニアだった知識を活かしてお客様のためになるような情報発信、制作を行なっております。また日本だけでなくベトナムスタッフとも連携して業務をとりまとめております。
好きなことは、自分で1から考えるものづくり。本の装丁が気になったり布ものやお菓子を自分でデザインして注文するのが好きです。
やっぱりはちみつなしでは生きてゆけない。
  • twitter
  • このエントリーをはてなブックマークに追加
  • Pocket
PAGE TOP
LINE it!