Elementorお問い合わせフォームの作成方法[開発者ガイド]
公開: 2021-05-03アドオンを使用してElementorお問い合わせフォームを作成するにはどうすればよいですか? さて、この記事では、あなたにとって最も実用的な方法について説明します。 貴重な訪問者がウェブサイトにどのように関与しているか知っていますか? –「お問い合わせ」ページから。 それはそう! しかし、それはウェブサイトで最も過小評価されているページです。 この居心地の良い小さなコーナーは、多くのウェブサイトのデザイナーや所有者に気づかれていません。
Elementorを使用するほとんどのウェブサイトビルダーは、フォームへの連絡をそれほど重要視していません。 Elementorの連絡フォームを追加しようとしたときにスタックしました。 その理由は、彼らがそれを複雑だと思っているからです。
その結果、「お問い合わせ」情報の配置が不十分なため、Webサイトが不親切になります。 歓迎されない連絡フォームは、ユーザーがページを見つけるのを難しくします。 ユーザーは、クエリを修正するために所有者に連絡することはできません。
したがって、ウェブサイトのより良い連絡フォームを作成することが不可欠です。 より良いElementorコンタクトフォームを作成するにはどうすればよいですか? これについては、この記事で説明します。 私たちと居て。
ウェブサイトの連絡フォームとは何ですか?
お問い合わせフォームは、ウェブサイト上の小さなウェブベースのフォームです。 これは、訪問者がサイト所有者と連絡を取り合う場所です。 それは訪問者との関係とつながりを構築するのに役立ちます。 また、サイトへのリードを生成するのに役立ちます。
基本的に、お問い合わせフォームには、訪問者がページに記入した一連の質問が含まれています。 記入されたフォームは、メッセージとしてサイト所有者に送信されます。 ただし、このお問い合わせフォームは電子メールメッセージをトリガーし、サイト所有者の電子メール受信ボックスに送信します。
サイトの所有者は、スパマーに電子メール情報を公開することなく、訪問者からメッセージを受け取ります。 したがって、サイトの所有者は、サイトまたはその間のその他すべての問題について通知を受けます。
なぜあなたのウェブサイトに連絡フォームがあることが重要なのですか?
ある時点で、なぜWebサイトに連絡フォームを用意する必要があるのか疑問に思われたかもしれません。 あなたは確かに電子メールアドレスで仕事を成し遂げることができます。 結局のところ、あなたはあなたの訪問者に到達するための媒体が必要です。
ただし、お問い合わせフォームがあると、Webサイトに違いが生じます。 以下に、Webサイトに連絡フォームを用意することをお勧めする理由を説明します。
お問い合わせフォームは、サイトにプロ意識を追加します
適切な連絡フォームがないと、Webサイトは不完全です。 お問い合わせフォームをサイトに追加すると、ユーザーにとってよりプロフェッショナルに見えます。 ただし、お問い合わせフォームを入力するだけでは役に立ちません。 お問い合わせフォームを戦略的に配置する必要があります。 だから、あなたの訪問者はそれを簡単に見つけることができます。
スパムメールからWebサイトを保護する
前述のように、メールアドレスを公開することはお勧めできません。 それはスパマーにあなたの受信箱を開くだけです。 スパムロボットは、多くの場合、Webサイトから電子メールアドレスを取得します。 スパムボットがあなたのメールアドレスに出くわすと、それはすべてのスパムメールリストと混ざり合う可能性があります。
それらをきれいにすることは困難になります。 お問い合わせフォームを使用すると、時間とエネルギーを節約できます。 また、あらゆる種類のスパムがフィルタリングされるため、連絡フォームは安全なレイヤーを作成します。 したがって、受信トレイをロボットから保護できます。
実際、連絡フォームはすべてのスパムを阻止できるわけではありません。 時々それはあなたのサイトのフォームを通して来ます。 ベストプラクティスは、CAPTCHAを使用することです。
いつでも利用できるようにする
お問い合わせフォームは、代わりのフォームのように機能します。 24時間年中無休でクエリを利用できます。 あなたのビジネスが成長するにつれて、あなたは徐々に訪問者からより多くのクエリを受け取るでしょう。 状況に対処する方法は?
簡単に、お問い合わせフォームに自動返信を設定できます。 訪問者が送信ボタンを押すたびに、訪問者はすぐにメッセージを受信します。 このように、お問い合わせフォームを使用すると、すべての質問に簡単に答えることができます。
お問い合わせフォームは、より多くのリードをもたらすのに役立ちます
ビジネスウェブサイトの所有者として、あなたの目標はサイトでより多くのリードを獲得することです。 それが理由です; あなたのサイトに連絡フォームが必要です。 お問い合わせフォームを使用すると、新しい訪問者が簡単に連絡できるようになります。
電子メールのみを公開する場合、訪問者は手動で電子メールを作成する手間をかけません。 お問い合わせフォームには、簡単に記入できる重要な質問がすべて含まれています。これにより、ランダムな訪問者がサイトに興味を持つようになります。
多機能使用
お問い合わせフォームは、双方向のコミュニケーション手段として機能します。 しかし、それを使用する理由はそれだけではありません。 お問い合わせフォームは、フィードバックの提供、お問い合わせ、イベントへの登録など、他の目的にも役立ちます。
Eメールマーケティングリストを作成する
電子メールは、聴衆に到達するための手頃な方法です。 訪問者がお問い合わせフォームに記入するたびに、あなたは彼らの情報を収集することができます。 次に、それらをメーリングリストに追加できます。 さらに、コンスタントコンタクトチェックボックスを追加すると、サインアップ時に新しいサブスクライバーを取得できます。
Elementorお問い合わせフォームを作成する方法は?
まず最初に、ElementorとElementorProの両方がインストールされてアクティブ化されていることを確認してください。 次は何ですか? これで、設計プロセスに進むことができます。
ステップ01:Elementorライブラリから連絡先ウィジェットを追加する
まず、Elementorお問い合わせフォームを使用するページを開きます。 お問い合わせフォームをサイトのどこに配置すればよいかわからない場合は、オプションをご利用いただけます。 アバウトページとホームページは、お問い合わせフォームの場所として適しています。
Elementorライブラリを開くと、多くの連絡先ウィジェットフォームがあります。 Elementorでは、これらのウィジェットは「フォーム」と呼ばれます。 お気に入りのウィジェットを選択して、Webページにドラッグします。
ステップ02:お問い合わせフォームに必要なフィールドを設定する
次に、お問い合わせフォームのフィールドを設定します。 elementorには、連絡先フォームウィジェットのさまざまな設定があります。 Elementorにはすでに必要なフィールドが入力されています。 通常、次のような情報があります。
- ユーザー名
- Eメール
- メッセージ
これらのフィールドは、基本的な連絡フォームの要素です。 ただし、お問い合わせフォームにさらに多くのフィールドを含めることもできます。 クライアントの予算を知るなど、事前資格の質問を追加できます。 クライアントの予算に応じて、適切なリードを絞り込むことができます。
ステップ03:お問い合わせフォームに追加のフィールドを追加または削除する
Elementor Contactフォームには、「AddItem」という名前のタブがあります。 [アイテムの追加]をクリックして、お問い合わせフォームに新しいフィールドを作成できます。 タイプ、ラベル、プレースホルダー、必須、列幅など、アイテムにはさまざまな設定があります。
「タイプ」は、フォームに追加できるフィールドのタイプを示します。 タイプには、テキスト、電子メール、URL、パスワード、reCAPTCHAなどがあります。次に、「ラベル」はフォームフィールドの上に要素を表示します。 「PlaceHolder」は、ユーザーに入力してもらいたいテキストです。
最後から2番目の設定は「必須」です。これは単純なトグルスイッチです。 オンの場合、ユーザーは未入力のフォームを送信できません。 最後に、「列幅」を使用すると、フィールドを必要に応じて整列およびスタックできます。
[詳細設定]タブ:[コンテンツ]タブの他に、[詳細設定]タブがあります。 これには、デフォルト値、ID、およびショートコードが含まれます。 ほら、elementorにはたくさんのオプションがあります。 終了記号をクリックしてタブを削除することもできます。

ステップ04:お問い合わせフォームからデータの宛先を設定する
次に、情報を送信する宛先を設定します。 「メール」オプションをクリックして、利用可能なオプションを確認してください。 オプションは次のとおりです。
- に
- 主題
- メッセージ
- メールから
- 名前から
- に返信
- CCとBCC
これらのオプションのほとんどは事前に入力されているため、変更を加える必要はありません。 [次へ]をクリックしてページを保存できます。 次に、メタデータを含むメタボックスフィールドがあります。 お問い合わせフォーム送信時に送信するように設定できます。 最後に、変更する必要のない「名前を付けて送信」オプションがあります。
ステップ05:お問い合わせフォームの自動メッセージを設定する
Elementorフォームのエディターを使用すると、ユーザーに送信する自動メッセージを生成できます。 フォームに従ってメッセージを変更できます。 フォームを変更すると、よりリアルになります。
「追加オプション」をクリックして、カスタムメッセージングオプションを有効にします。 次に、[カスタムメッセージング]オプションを[はい]にタップします。これにより、4種類のメッセージが許可されます。 メッセージには以下が含まれます。
- 成功メッセージ–このメッセージは、エンドユーザーがフォームに正しく入力すると表示されます。
- エラーメッセージ–このメッセージは、間にエラーが発生したときに表示されます。
- 必須メッセージ–ユーザーがフィールドを見逃したときに表示されます。
- 無効なメッセージ–間に何かが正しくない場合に表示されます。
ステップ06:Elementorを使用してお問い合わせフォームのスタイルを設定する
今、ユーザーを引き付ける部分が来ます。 Elementorエディタの「スタイル」タブをクリックします。 お問い合わせフォームをパーソナライズするためのオプションはたくさんあります。 間隔、色、パディング、ラベル、ボタン、入力などをカスタマイズできます。
セットアップ07:お問い合わせフォームを公開する
お問い合わせフォームでは、すべてを希望どおりに設定する必要があります。 次に、エンドユーザーに公開します。 「更新」ボタンをクリックして、お問い合わせフォームを公開します。 素晴らしい! これで、ご希望の連絡フォームがすべて設定されました。
魅力的なお問い合わせフォームを作成するための6つの最高のElementorアドオン
Elementor Proを使用すると、上記のフォームで連絡先を作成できます。 アクセスできない場合でも、心配はいりません。さまざまな代替要素またはアドオンを利用できます。 次の選択肢は完全に無料です。
- Elementor用のDroitContactForm Addon –無料のElementorアドオンを生涯無料で提供します。
- HubSpot –これは、フォーム、ライブチャット、ポップアップなどを追加するために使用できる無料のオンラインマーケティングプラグインです。
- WPFormsプラグイン–多くの機能を提供するベースバージョンです。 基本的な連絡フォームを作成でき、Elementorと簡単に統合できます。
- お問い合わせフォーム7–これは組み込みのショートコードが付属する価値のある簡単なオプションです。
- Forminator –使いやすいインターフェースが付属しています。 プラグインには200万を超えるアクティブなインストールがあります。
- Caldera Forms –無料で利用できる一連の堅牢な機能が含まれています。
FAQ:Elementorお問い合わせフォームを作成する方法は?
お問い合わせフォームを追加するElementorのページを開きます。 Elementorウィジェットまたはお問い合わせフォーム7ウィジェットを見つけます。 次に、ウィジェットをページにドラッグアンドドロップします。 次に、フォームテンプレートを選択します。 あなたは白い形を見ることができます。
ここで編集ボタンをクリックすると、左側のメニューにスタイルタブが表示されます。 必要な背景を選択してください。 次に、設定に戻り、フォームのスタイルを設定して、最後に[公開]ボタンをクリックします。
絶対に、elementorには10種類以上のフォームフィールドが含まれています。 あなたはあなたのウェブサイトであなたが探しているデータを得ることができます。 情報には、名前、電子メール、電話番号などが含まれます。
WordPressでお問い合わせフォームをカスタマイズするのは比較的簡単です。 管理パネルの外観をクリックします。 カスタマイズオプションを選択して設定を変更します。
Droit Elementorアドオンは、Elementorの拡張機能です。 それはあなたのウェブサイトのデザイン体験を後押しすることを目的としています。 Droitには、実用的なウィジェット、オンデマンドのアセット読み込みなどが豊富に用意されています。
ウィジェットを使用するには、拡張機能をElementorPageBuilderにプラグインする必要があります。 次に、ビルド済みのプリセットを使用してさまざまな連絡先フォームをデザインできます。 背景、影、タイポグラフィ、境界線などを変更できます。
elementorフォームはpostmetaテーブルに保存されます。 フォームデータは、各フォームまたはページのメタキー「_elementor_data」に保存されます。
まとめ!
今日は以上です、皆さん! これまで、Elementorお問い合わせフォームの作成方法を学びました。 すばらしいお問い合わせフォームを既に作成されていることを前提としています。 簡単じゃないですか? 確かに、Elementorは高速で簡単です。
Elementor proをインストールしている場合は、お問い合わせフォームの作成に数時間かかりません。 これで、お問い合わせフォームでさらに変更を加えることができます。