2018年08月23日
お問合せフォームリベンジ!! 今度はプラグイン「MW WP Form」で問合せフォーム設定に挑戦!【確認ボタンあり】
いぇーーーい。
エックスサーバーさんのセルフバックが確定に変わりました!!
セルフバックとはいえ報酬GETとなると、テンションあがります
いつも快適なWord Press運用、お世話になっとります(*- -)(*_ _)ペコリ
と思ったら、またしても試練・・・(;'∀')
なぬ!?
「お問合せフォーム」出来ましたよね…ちゃんと設置。
と思ったのに、画像アップロードで「httpエラー」を引き起こしたり、
何故かこれ☟
ひとつでいいのに2段重ね・・・。
いろいろ試してみたのだが、かめ子にはお手上げ・・・(´;ω;`)ウゥゥ
直し方誰か教えてください。
嘆いていても仕方がないので、他のプラグインで設置し直してみることに。
またまた先輩アフィリエイターさんのブログを巡回しつつ、良さそうなプラグインを吟味。
MW WP FORMに決めた!!
では早速設置方法を順に見てゆきましょう。
Step.1 プラグイン「MW WP FORM」を新規追加インストールする
「Contacto Form 7」の時にやったように、Word Pressで作成したサイトのダッシュボードの「プラグイン」「新規追加」へゆきます。
右上の検索画面に「MW WP FORM」と入力し、プラグインを探します。
出て来ました?「MW WP FORM」
「今すぐインストール」をクリックしインストール開始!
数秒でインストール完了!
完了したら「有効化」ボタンに忘れずに「有効化」してくださいね。
Step.2 コンタクトフォーム 基本入力項目設置
完了すると、ダッシュボードに「MW WP FORM」が追加されているのがわかります。
「MW WP FORM」☞「新規追加」
基本的な 「お名前」「ふりがな」「メールアドレス」「質問・問合せ内容」とシンプルなフォームを作っていきます。
まず、タイトルを入力しましょう。@
「お問合せはこちら」
としてみます。
そして、入力してもらう項目のフォームを設置してゆきます。
お名前と文字入力したら
Aを「テキスト」選択 ☞ B「フォームタグを追加」をクリックすると
こんな画面がでます。
name*のスペースに「お名前」と入力し、C右下の「Insert」で反映させます
同じように「ふりがな」を挿入。
次に、「メールアドレス」この時Aを「テキスト」ではなく「メール」を選びます。
そして、「ご質問・お問合せ内容」はA「テキストエリア」を選択します。
最後に「確認ボタン」を設置。
Aにある「確認ボタン」を選び、B−2は何もいじらずそのまま「Insert」します。
こんな感じになりました。
Step.3 バリデーションを追加(必須)を付けます
「お名前」「ふりがな」「メールアドレス」はきちんと入力して頂く必要があるので、必須項目にしたいですよね。
この設定をします。
下の方までスクロールすると「バリデーションを追加」と出て来ますね。
「バリデーションを適用する項目」に「お名前」を入力
☞ 必要項目 ☞ 「バリデーションを追加」 でOK
「ふりがな」「メールアドレス」も同じように追加します。
Step.4 完了画面メッセージ設定
これは、問合せをしてくださる方に問合せを完了したことを伝えるメッセージです。
きちんと設定しておきましょうね。
Srep.5 自動確認設定
問合せをした方へ送信される「自動確認メール」を設定します。
右端に「自動確認メール設定」があります。
@「件名」
A「送信者」
B「送信元」
C「本文」
D「自動返信メール」
それぞれ入力します。
C「本文」のところが少しわかりずらいので解説します。
{ } でくくられた部分は、問合せ者が入力した内容がそのまま反映されることになります。
よって、フォーム作成の際に入力した通りの名前を入力するひつようがあります。
お名前 と設定したのに、ここでname などとしてしまうと何も表示されません。
かめ子は お名前としましたので、 お名前:{お名前} 以下同じ というちょっと不思議な見た目になっているわけです。
Dに「メールアドレス」 と入力するのもお忘れなく。
ここに返信してくださいの指示です。
Step.6 管理者=自分に届くメール設定
こんどはお問合せ内容を自分に知らせるメールの設定です。
これがちゃんと届かないと意味がありませんからね。
自動送信メールと同じように今度は自分あてに、「お問合せを受け付けました」で設定してみましょう。
Step.7 作成したフォームをサイトに設置
長らくお疲れ様でした入力は終了です。
右上の「公開」をポチっとしてアクティブにします。
右上の方にあるショートコードをコピーし、反映させたい固定ページ本文に貼りつけ(ペースト)。
タイトル、文章を追加で入力し、完成です。
保存してプレビューしてみましょ。
こんな感じで出来上がりました。
Step.8 動作確認
実際に設置した問合せページから管理用ではないメールアドレスから問合せしたとして、問合せしてみましょう。
どちらにもメールがきちんと届けば成功です!
もし、メールが届かないや、部分的に表示されない、などのエラーが発生した場合はもう一度見直しが必要ですね。
へこたれずに完成目指して頑張りましょう。
エックスサーバーさんのセルフバックが確定に変わりました!!
セルフバックとはいえ報酬GETとなると、テンションあがります
いつも快適なWord Press運用、お世話になっとります(*- -)(*_ _)ペコリ
と思ったら、またしても試練・・・(;'∀')
なぬ!?
「お問合せフォーム」出来ましたよね…ちゃんと設置。
と思ったのに、画像アップロードで「httpエラー」を引き起こしたり、
何故かこれ☟
ひとつでいいのに2段重ね・・・。
いろいろ試してみたのだが、かめ子にはお手上げ・・・(´;ω;`)ウゥゥ
直し方誰か教えてください。
嘆いていても仕方がないので、他のプラグインで設置し直してみることに。
またまた先輩アフィリエイターさんのブログを巡回しつつ、良さそうなプラグインを吟味。
MW WP FORMに決めた!!
MW WP FORMが優秀な理由
- 柔軟なカスタマイズ性
- HTML/CSSの知識不要
- 日本人が開発
プラグイン MW WP FORM を使用して「確認画面付き」お問合せフォームを設置しよう!
では早速設置方法を順に見てゆきましょう。
Step.1 プラグイン「MW WP FORM」を新規追加インストールする
「Contacto Form 7」の時にやったように、Word Pressで作成したサイトのダッシュボードの「プラグイン」「新規追加」へゆきます。
右上の検索画面に「MW WP FORM」と入力し、プラグインを探します。
出て来ました?「MW WP FORM」
「今すぐインストール」をクリックしインストール開始!
数秒でインストール完了!
完了したら「有効化」ボタンに忘れずに「有効化」してくださいね。
Step.2 コンタクトフォーム 基本入力項目設置
完了すると、ダッシュボードに「MW WP FORM」が追加されているのがわかります。
「MW WP FORM」☞「新規追加」
基本的な 「お名前」「ふりがな」「メールアドレス」「質問・問合せ内容」とシンプルなフォームを作っていきます。
まず、タイトルを入力しましょう。@
「お問合せはこちら」
としてみます。
そして、入力してもらう項目のフォームを設置してゆきます。
お名前と文字入力したら
Aを「テキスト」選択 ☞ B「フォームタグを追加」をクリックすると
こんな画面がでます。
name*のスペースに「お名前」と入力し、C右下の「Insert」で反映させます
同じように「ふりがな」を挿入。
次に、「メールアドレス」この時Aを「テキスト」ではなく「メール」を選びます。
そして、「ご質問・お問合せ内容」はA「テキストエリア」を選択します。
最後に「確認ボタン」を設置。
Aにある「確認ボタン」を選び、B−2は何もいじらずそのまま「Insert」します。
こんな感じになりました。
Step.3 バリデーションを追加(必須)を付けます
「お名前」「ふりがな」「メールアドレス」はきちんと入力して頂く必要があるので、必須項目にしたいですよね。
この設定をします。
下の方までスクロールすると「バリデーションを追加」と出て来ますね。
「バリデーションを適用する項目」に「お名前」を入力
☞ 必要項目 ☞ 「バリデーションを追加」 でOK
「ふりがな」「メールアドレス」も同じように追加します。
Step.4 完了画面メッセージ設定
これは、問合せをしてくださる方に問合せを完了したことを伝えるメッセージです。
きちんと設定しておきましょうね。
Srep.5 自動確認設定
問合せをした方へ送信される「自動確認メール」を設定します。
右端に「自動確認メール設定」があります。
@「件名」
A「送信者」
B「送信元」
C「本文」
D「自動返信メール」
それぞれ入力します。
C「本文」のところが少しわかりずらいので解説します。
{ } でくくられた部分は、問合せ者が入力した内容がそのまま反映されることになります。
よって、フォーム作成の際に入力した通りの名前を入力するひつようがあります。
お名前 と設定したのに、ここでname などとしてしまうと何も表示されません。
かめ子は お名前としましたので、 お名前:{お名前} 以下同じ というちょっと不思議な見た目になっているわけです。
Dに「メールアドレス」 と入力するのもお忘れなく。
ここに返信してくださいの指示です。
Step.6 管理者=自分に届くメール設定
こんどはお問合せ内容を自分に知らせるメールの設定です。
これがちゃんと届かないと意味がありませんからね。
自動送信メールと同じように今度は自分あてに、「お問合せを受け付けました」で設定してみましょう。
Step.7 作成したフォームをサイトに設置
長らくお疲れ様でした入力は終了です。
右上の「公開」をポチっとしてアクティブにします。
右上の方にあるショートコードをコピーし、反映させたい固定ページ本文に貼りつけ(ペースト)。
タイトル、文章を追加で入力し、完成です。
保存してプレビューしてみましょ。
こんな感じで出来上がりました。
Step.8 動作確認
実際に設置した問合せページから管理用ではないメールアドレスから問合せしたとして、問合せしてみましょう。
どちらにもメールがきちんと届けば成功です!
もし、メールが届かないや、部分的に表示されない、などのエラーが発生した場合はもう一度見直しが必要ですね。
へこたれずに完成目指して頑張りましょう。
【このカテゴリーの最新記事】
この記事へのコメント
コメントを書く
この記事へのトラックバックURL
https://fanblogs.jp/tb/8021082
※ブログオーナーが承認したトラックバックのみ表示されます。
この記事へのトラックバック