無料のElementorコンタクトフォームを作りたいですか？
お問い合わせフォームは、あらゆる種類のウェブサイトに不可欠です。フォーム内に適切なフィールドを設けることで、リードから必要な情報を正確に収集し、効果的なコミュニケーションを図ることができます。
このチュートリアルでは、Elementorページにお問い合わせフォームを無料で追加するベストな方法をご紹介します。このオプションはElementorのすべてのバージョンでうまく機能し、完全に「ノーコード」です！
無料のElementorコンタクトフォームの作り方
Elementorを使えば、とても簡単にお問い合わせページを作ることができますが、あなたのサイトに無料でお問い合わせフォームを追加するには、Elementorだけでは足りません。
この記事で
ステップ1: WPFormsのインストールと有効化
まず最初にWPFormsプラグインをインストールします。これを行うには、WordPressのダッシュボードを開き、プラグイン " 新規追加に移動します。
ここでWPFormsを検索し、見つけたらインストールをクリックする。インストールには数秒しかかかりません。
これが完了すると、インストールボタンに「Activate」と表示されます。Activateを 押すとサイトへのWPFormsの設定が完了します。とても簡単です！
素晴らしい！WPFormsはあなたのサイトで使えるようになりました。最初のフォームを作る前に、Elementorをインストールしましょう。
ステップ2: Elementor WordPressプラグインを入手する
上記とまったく同じ手順でElementorをインストールできます。プラグイン " 新規追加からElementorを探し、インストールするだけです。
インストールが終わったので、次のステップで紹介するように、コンタクトフォームを作成することができます。
ステップ 3: Elementorのコンタクトフォームを作る
WPForms " Add New ですぐにコンタクトフォームの作成を開始できます。
これで数秒でWPFormビルダーがロードされます。フォームに名前を付けて、後で編集が必要になったときに簡単にフォームを識別できるようにしましょう。
少し下にスクロールすると、フォームテンプレートが表示されます。WPForms Liteを使用している場合は、数十の無料テンプレートから選択することができます。
その後、Proにアップグレードすることで、カスタマーサービス、マーケティング、その他様々なカテゴリーに対応した2,001種類のWordPressフォームテンプレートにアクセスすることができます。
お問い合わせフォームが必要なので、無料のシンプルなお問い合わせフォームテンプレートはこの記事の目的に最適です。
検索ボックスでこのテンプレートを検索し、画面に表示されたら「テンプレートを使用 」ボタンをクリックします。
テンプレートを選択すると、WPFormsビルダーが開きます。WPFormsのユーザーインターフェースは誰でも簡単に使えるように設計されています。
左側にはコンタクトフォームに追加できるすべてのフィールドが表示されます。右側にはフォームのライブプレビューが表示されます。
テンプレートをカスタマイズしたい場合は、左側のパネルから任意のフォームフィールドを右側のフォームにドラッグするだけです。
ドロップダウンリストや複数選択式の質問を追加したり、フィールドを上下にドラッグしてフォーム上で移動させることもできます。
フィールド設定を開きたい場合は、ビルダーでフィールドを一度クリックしてください。左側のパネルのフォームプレビューの横に設定が表示されます。
各フィールドをクリックして、お好きなように設定してください。設定が終わったら、一番上の「保存」をクリックします。
代わりにサインアップフォームを作成しますか？Elementorのカスタムサインアップフォームを作成するためのチュートリアルを別途ご用意しました。
WPFormsには様々な便利な機能があります。例えば、Elementor FormsとGoogle Sheetsを接続するゲートウェイとして使うこともできます！
ステップ 4: フォームの確認メールとメッセージを設定する
それでは、フォームが送信されたときに送信されるメッセージを確認してみましょう。フォームビルダーで「設定」をクリックし、左側の「通知」メニュー項目をクリックします。
右側にはフォームが送信された際に送信される通知メールが表示されます。必要であれば、ここでメールをカスタマイズすることができます。
メールの送信先が以下のようになっていることにお気づきですか？ {admin_email}?WordPressの管理者メールアドレスのプレースホルダーです。
を削除することができます。 {admin_email} を入力し ビジネスメールアドレス または WordPressの管理者メールアドレスを変更する それが間違っているなら
次に、「確認」をクリックします。この画面で、フォームが送信されたときにフロントエンドに表示されるメッセージをカスタマイズできます。
これはオプションなので、デフォルトのメッセージでよければそのままでもよい。
これで完了です！一番上の保存ボタンをクリックしましょう。フォームビルダーを閉じるには、フォームビルダーウィンドウの右上にあるXをクリックします。
よくできました！Elementor フォームの準備ができましたので、あとは公開するだけです。
ステップ6: Elementorのお問い合わせページを作成する
このステップでは、Elementorを使ってカスタムお問い合わせページを作成します。WordPressのダッシュボードから、ページをクリックし、新規追加ボタンを押します。
一番上にページタイトルを入力します。その後、青い「Elementorで編集」ボタンをクリックします。
これでElementorページビルダーのインターフェイスが起動し、コンタクトフォームを追加したり、ページの他の要素をカスタマイズすることができます。
Elementorがブラウザに読み込まれるまで数秒待ちます。左側に、ページに追加できるさまざまな要素が表示されます。
Basicセクションの下にWPFormsブロックがあります。
WPFormsブロックをページにドラッグ＆ドロップし、ドロップダウンをクリックして作成したフォームを選択します。
フォームを選択すると、すぐにページに表示されます。お見事です！これでフォームビルダーの使用は終了です。あとはContactページを公開するだけです。
ステップ7: Elementorのお問い合わせページのスタイル設定と公開
Elementorを使えばお問い合わせページの公開は簡単です。しかし、ElementorのWPFormsブロックオプションを使ってフォームをスタイリングすることもできることをご存知ですか？
そのためには、ページ上の埋め込みフォームの周りをクリックし、左側のペインでブロックオプションを開きます。次にスタイルタブをクリックします。
スタイルメニューの下には、フォームデザインのさまざまな側面に関連する設定がいくつかあります。これらのオプションを使用して、フィールド、ラベル、ボタンのスタイルを変更することができます。
例えば、 ボタン・スタイルの設定を使って、数クリックでボタンのサイズ、ボーダー半径、色を増やしました。
詳細設定]タブをクリックすると、さらに詳細なオプションにアクセスできます。これには、フォームレイアウト、モーションエフェクト、ページ背景などの設定が含まれます。
フォームスタイルのカスタマイズが終わったら、いよいよフォームを公開しましょう。一番下のツールバーにある発行ボタンをクリックしてください。
最後に、「Have a Look」をクリックして、ウェブサイト上のお問い合わせフォームをご覧ください。これで完了です！Elementor のお問い合わせページが稼動し、回答を得る準備ができました。
Elementorのコンタクトフォーム作成に関するFAQ
Elementorのコンタクトフォームは読者の間で人気のあるトピックです。ここではそれに関するよくある質問にお答えします：
Elementorにコンタクトフォームはありますか？
はい、Elementor には Pro バージョンで利用可能なお問い合わせフォームブロックがあります。このブロックを使用すると、Elementor でページを編集している間に、簡単にフォームをページに追加できます。
Elementorのフォームブロックは有料ユーザーしか利用できませんが、WPFormsブロックは無料で利用できます。ElementorのWPFormsブロックにアクセスするには、WPFormsとElementorの両方がインストールされている必要があります。
Elementor無料版にコンタクトフォームを追加するには？
Elementorの無料版を使ってコンタクトフォームを追加するには、WPFormsのようなプラグインを統合することができます。まず、WordPressのダッシュボードからWPFormsプラグインをインストールし、有効化します。有効化したら、WPFormsビルダーを使ってフォームを作成します。
Elementorでフォームを作成するには？
Elementorでフォームを作成するには、WPFormsプラグインを使うと簡単です。WordPressのプラグインセクションからWPFormsをインストールし、有効化します。WPFormsのシンプルなドラッグアンドドロップインターフェースを使用してフォームを作成します。
Elementorでカスタムコンタクトフォームを作成するには？
WPFormsはその柔軟性と使いやすさから、Elementorでカスタムコンタクトフォームを作成するのに非常におすすめです。WPFormsをインストールして有効化した後、プラグインを開き、カスタムフォームを作成するために'新規追加'を選択します。
必要に応じてフィールドを追加したり削除したりして、フォームをカスタマイズしてください。完成したらフォームを保存します。Elementor で、フォームを設置したいページに WPForms ブロックを追加し、フォームを選択してページを公開します！
Elementorのコンタクトフォームの通知メールを修正する
Elementor のコンタクトフォーム送信のメール受信に問題がありますか？この問題を解決するのは簡単です。Elementor のコンタクトフォームがメールを送信しない問題を解決するガイドをご覧ください。
また、Elementor 用のその他のフォームビルダーについて知りたい場合は、フォーム上のユーザーエンゲージメントを向上させ、最終的にはリードジェネレーションを向上させるElementor と相性の良いコンタクトフォームプラグインに関するこの記事をご覧ください。
フォームを作る準備はできましたか？最も簡単なWordPressコンタクトフォームプラグインで今すぐ始めましょう。WPForms Proにはたくさんのプレミアムアドオンが含まれており、14日間の返金保証がついています。
この記事がお役に立ちましたら、Facebookや TwitterでWordPressの無料チュートリアルやガイドをフォローしてください。
