【初心者】contact fourm7で予約フォームを作れます。

プログラミング 初心者独学

【初心者】contact fourm7で予約フォームを作れます。

こんにちはnikonekoです。

簡単に予約フォームはつくれないのかしら?

いろいろ検索してみたけど、はじめてだからよくわからない。

それなら、自分で作ってみるのはどう?

自分でつくる?初心者でもできるかしら?

できるよ!Wordpressのプラグインを使えば簡単さ!

お問合せページを作る時にもよく使われていると思うんだけど、contact fourm7使うんだ!

contact fourm7なら私も使っているわ。

じゃあ、スムーズにいくと思うよ!

早速、やってみよう!

インターネットを検索していると、キレイで簡単に予約システムを作れるページを何個も読みあさり、実際にやってみた結果 ➡ ワードプレス プラグイン「contact fourm7」に落ち着きました。

初心者ながらに自分の理想が優先してしまった結果、意外と満足のいく予約フォームができたので、記録に残したいと思います。

予約フォームの作り方

予約フォームの条件として、

  • 名前を入力
  • メールアドレスを入力
  • 日付を選択できる
  • 時間を選択できる
  • 利用規約に同意する
  • 送信を押すと、指定のメールアドレスに連絡が入る

という工程で進めていきます。

シンプルで且つ簡単なもので、理想の予約フォームをつくるWordPressのプラグイン「contact fourm7」で作ることができます。

それでは、早速作ってみたいと思います。

Contact fourm7をインストール

WordPressのプラグインで、新規追加からインストールしていきます。

①.ダッシュボードのツールに、お問合せがふえました。

2.新規追加から入り、コンタクトフォームを追加していきましょう。

はじめから、名前やメールアドレス、メッセージのショートコードは記述されています。

希望していた、

  • 名前を入力
  • メールアドレスを入力

まずは、クリアしました。


3-1予約日を選択できるようにします。

日付タブを選択して、下限と上限(予約日付の範囲)を決めます。

③-3予約日を選択する画面は、こうなります。

④-1時間を選択できるようにします。

今回は、ドロップダウンメニューを使いました。

④-2時間を選択できるようにします。

オプションに希望する時間を一行ずつ入力していきます。

④-3時間を選択する画面は、こうなります。

日付と時間を選択できるタグがクリアしました。

利用規約など、同意する☑ボックスを作ります。

※同意をしないと進めませんよ!という風にします。

承諾確認タブをクリックしていきます。

⑤-1利用規約など、同意する☑ボックスを作ります。

承諾確認タブをクリックすると、コマンドが開きます。

オプションの部分に、チェックボックスを任意選択にするとあります。

ココのチェックを外します。

外すことによって、チェックをしないと次に進めませんよ!とできます。

⑤-2☑ボックスの設定画面は、こうなります。

あとはこのフォームを使い、送信を押したときに自分が設定したメールアドレスへ届くようにして、

日時を確認できるようにすれば、出来上がりです。

⑥送信先・元のメールアドレスを設定します。

送信先は、自分が受取るためのメールアドレスを設定します。

送信元は、こちらからメールするときに使うメールアドレスを設定します。

⑦メッセージタブで、送信の結果を返してくれます。

はじめから、テンプレートが設定されているので、そのままでもOKです。

⑧設定を保存すると、ショートコードができます。

青い部分にショートコードが作られるので、コピーします。

⑨固定ページ(投稿)へ貼り付けます。

今回は、固定ページへそのまま貼り付けます。

⑩出来上がりました。


あれだけ悩んでいたのに、「予約フォーム」私にもできちゃった。

お疲れさまでした。

有料にして自動化するのが一番便利なんだけど、まずは自分で作って仕組みを理解してみるといいよね。

ちなみに、予約フォームで送信すると、設定したアドレスにこんな風にお知らせがきます。


予約フォームの条件として、

  • 名前を入力
  • メールアドレスを入力
  • 日付を選択できる
  • 時間を選択できる
  • 利用規約に同意する
  • 送信を押すと、指定のメールアドレスに連絡が入る

という工程で考えていました。

きちんとクリアできましたね。


まとめ

難しく考えすぎてしまって、初心者なのにプロのような仕上げを常に求めすぎで時間だけが過ぎていったのに、結局「あ!そうか!」と気づいたのが、「Contact fourm7」でした。

本当に、いろいろ考えすぎてしまって、何も結果を出せない日が続きました。

Contact fourm7は、使いやすく、いろいろな形ににカスタマイズできるので、とても参考になります。

みなさんもぜひ使ってみてください。

コメント