WordPress に Elementor コンタクトフォームを追加する方法 (ビデオ付き)

当局への連絡に問題があったことがありますか? 

答えは肯定ですよね？

正直に言うと、この分野に携わっているのはあなただけではありません。私たちのような消費者のほとんどは、コミュニケーションギャップが原因で企業から適切なサービスを受けることができません。

最近、Drift は顧客との連絡の重要性に関する調査を実施しました。結果は、 売上が10分の1に減少 会社が5分以内に応答しなかったからです。

では、問い合わせフォームがない場合はどうなるでしょうか? 90% を超える顧客を失う可能性があります。顧客を失いたいですか？ 

私はそうは思わない！

では、どうすればこの問題を克服できるでしょうか?

まあ、それは簡単です！ Web サイトにお問い合わせフォームを追加するだけで完了です。

このセクションでは、Elementor コンタクト フォーム 7 を使用してコンタクト フォームをデザインする最も簡単な手順を説明します。

打ってみよう！

Elementor Contact Form 7 でフォームをデザインする方法

幸いなことに、WordPress Web サイトにお問い合わせフォームを追加するのは複雑ではありません。実際、Elementor ページ ビルダーを使用すると、これまでより簡単になります。 お問い合わせフォーム7. 

ところで、WordPress Webサイトのお問い合わせフォームをデザインする前に、環境をセットアップする必要があります。目を引く連絡先フォームをデザインするためにインストールする必要がある推奨ツールを次に示します。

• WordPress CMSを使用したWebサイト
• お問い合わせフォーム7
• エレメンター
• ElementsKit 

インストールは完了しましたか? Elementor のお問い合わせフォームのデザインを始めましょう。さあ、始めましょう。

ステップ #1: キャンバスに入る

Web サイト管理者のダッシュボード パネルにログインします。空の投稿を作成し、名前を付けます。名前を付けたら、「」をクリックします。Elementorで編集する' ボタン。

キャンバスの作成

ステップ #2: 投稿に問い合わせフォームを追加する

次に、ブログ投稿に問い合わせフォームを追加します。 「contact form 7」アイコンを投稿にドラッグ＆ドロップするだけで簡単に行えます。投稿に問い合わせフォームが自動的に表示されます。

ただし、404 エラー メッセージが表示される場合があります。それについてはまったく心配する必要はありません！これは、ドロップダウン メニューからお問い合わせフォームを選択しなかった場合に発生します。 

お問い合わせフォームの追加 

ステップ #3: タイポグラフィ スタイル

このセクションでは、フォントファミリー、フォントサイズ、太さ、変換、フォントスタイル、装飾、行の高さ、文字間隔などのさまざまなセクションを変更します。 

タイポグラフィのスタイリング

これらのオプションを変更しても、Web サイトの応答性には影響しないことに注意してください。 

ステップ #4: 入力領域のカスタマイズ

テキスト領域をカスタマイズするだけでなく、入力ボックスも変更できます。 ElementsKit を使用すると、入力ボックスのパディング、幅、入力ボックスの高さ、テキストの高さ、および入力ボックスの下部マージンをカスタマイズできます。

入力ボックスのカスタマイズ

ステップ #5: 入力領域の背景のカスタマイズ

この時点までに、Elementor 問い合わせフォームのテキストとカスタマイズされたテキストのデザインが完了しました。次に、テキスト領域の背景色、デザイン、影などを変更します。 

入力エリアのカスタマイズ

複数の色や影を使用して入力ボックスに色を付けることもできます。しかし、この部分で最も気に入っている機能の 1 つについて触れずにはいられません。つまり、連絡先フォームの内部セクションと外部セクションの両方にこれらの影と色を追加できます。

注意すべき点: これらのアクションはすべて、ホバー オプションとフォーカス オプションの両方で実行できます。すごいですね。

ステップ #6: 送信ボタンの変更

さて、お問い合わせフォームの設計の最後のセクションに入りました。はい、わかりました！ここで「送信」ボタンを変更します。

ElementsKit を使用すると、配置、タイポグラフィ、境界線の半径、マージン、パディング、色、ボックスシャドウ、テキストシャドウ、境界線の種類などを変更できます。 

送信ボタンのカスタマイズ

以上です！お問い合わせフォームのデザインが完了しました。デザインも無事に完成したと思います。

ElementsKit レイアウトを使用した Elementor コンタクト フォームのデザイン

このセクションでは、ElementsKit レイアウトを使用して投稿に問い合わせフォームを追加するプロセスを説明します。 

プロセスをさらに簡単にするために、ビデオチュートリアルも追加します。お役に立てば幸いです。さて、チュートリアルに焦点を当てましょう。

ステップ #1: フォームの挿入

まずはお問い合わせフォームのデザインを選択します。 ElementsKit レイアウト ライブラリ。 ElementsKit アイコン > セクション > 連絡先フォームに移動します。 

このセクションでは、ブログ投稿用に 3 つの異なるお問い合わせフォームのデザインが表示されます。希望のデザインを選択し、「挿入」ボタンをクリックして投稿に追加するだけです。 

レイアウトからお問い合わせフォームを挿入する

ステップ #2: お問い合わせフォームのカスタマイズ

希望するお問い合わせフォームがブログ投稿に表示されます。次に、連絡先フォームの色、余白、パディング、フォント、テキスト ボックスなどをカスタマイズします。 

幸いなことに、カスタマイズ プロセスは以前のものと同様の 100% です。ステップ #3 から前の手順に従えば、それを取得できます。

WordPress ウェブサイトのお問い合わせフォームのデザインで問題が発生した場合は、ビデオを確認してください。それはすべてをカバーします。

それでおしまい！あなたの Web ページに Elementor のお問い合わせフォームが正常に追加されたことを願っています。 Contact Form 7 と ElementsKit を使用してフォームをデザインするのは、時間もかからず、最も簡単なプロセスです。 

お問い合わせフォームの使用の重要性 

Venture Harbor のケーススタディでは、 コンバージョン率が約 743% 向上します Web フォームを最適化することによってのみ可能になります。適切な問い合わせフォームを導入するだけでも、売上を伸ばすことができます。

ウェブサイトでお問い合わせフォームを使用することのその他の重要性を見てみましょう。

1. プロ意識

Web サイトはお問い合わせフォームがなければ不完全に見えます。適切な連絡フォームを追加すると、消費者とウェブマスター間のコミュニケーションの媒体として機能するだけでなく、プロ意識が高まります。

フォームリンクを 透明なスティッキーヘッダー 別名プライマリメニュー。これにより、フォームに簡単にアクセスできるだけでなく、プロフェッショナルな外観になります。

ちなみに、コンバージョン率の高い Web フォームを自動作成したい場合は、MetForm プラグインを使用するとよいでしょう。 MetForm には、あらかじめデザインされたプレミアムなフォームがたくさんあります。どれかを選択してカスタマイズするだけです。

数分もかかりません プロフェッショナルな外観の Web フォームを作成する MetFormを使用して。

2. 使いやすさ

シンプルなお問い合わせフォームは、ウェブサイトをユーザーフレンドリーの一歩先に保ちます。ユーザーがあなたの Web サイトにアクセスすると、さまざまなクエリについてあなたとコミュニケーションを取りたいと思うかもしれません。 

お問い合わせフォームがない場合、訪問者はあなたとコミュニケーションを取ることができません。このコミュニケーションギャップだけで何千人もの潜在顧客を失う可能性があります。最も重要なことは、これらの顧客はあなたの Web サイトをさらに訪問することはなく、ましてや他の人に Web サイトを勧めることもありません。

また、適切な問い合わせフォームを追加するだけで、これらの問題をすべて解決し、ビジネスを成長させることもできます。 

3. 売上の増加

ビジネスを成功させるのは簡単ではありません。ビジネスを改善するには、一生懸命魂を込めて働かなければなりません。驚くかもしれませんが、顧客の質問に迅速に応答することによってのみ売上を増やすことができます。 

ご存知のとおり、売上は応答率に大きく依存します。レポートによると、顧客の質問に 5 分以内に応答できなかった場合、売上は 10 分の 1 に減少する可能性があります。

ただし、誰でも 24 時間年中無休で直接対応できるようにすることは可能です。この場合、お問い合わせフォームが非常に役立ちます。これにより、顧客と Web サイト所有者の両方の間でコミュニケーションの橋が開かれた状態が保たれます。

ウェブサイト上で豪華な見た目の問い合わせフォームをデザインすれば、消費者は間違いなくそれを使用し、所有者に連絡するでしょう。 

4. スパムから身を守る

電子メール アドレスや電話番号を Web サイトに直接公開すると、スパムメールを受ける可能性が高くなります。公開された電子メールを収集するためにインターネットを継続的に巡回する何千ものボットが利用可能です。 

Web サイトで連絡先情報を直接公開すると、それらのボットが電子メールをキャプチャし、スパマーに配信します。その直後、あなたの受信箱は不要なスパムメールで溢れかえります。 

Web サイトに問い合わせフォームを追加することで、この問題を解決できます。セキュリティ層として機能します。 contact form 7 のような高度な連絡フォームを使用すると、セキュリティがさらに強化されます。

Contact form 7 は、スパム ボックスから実際のメッセージを自動的にフィルタリングします。さらに、reCAPTCHA、ボット フィルタリングなどのセキュリティ チェックを追加することもできます。

5. 連絡先を整理する

適切な連絡フォームは、ビジネスオーナーが顧客の情報を整理しておくのに役立ちます。したがって、必要なときにいつでも簡単に顧客に連絡できます。 

6. 到達可能性

ビジネス オーナーのほとんどは、顧客とのコミュニケーションにソーシャル メディア プロフィールを使用しています。まあ、ソーシャルメディア愛好家にとっては良いプラットフォームかもしれません。しかし、ソーシャル メディア サイトをアクティブにしない顧客はどうなるでしょうか? 

間違いなく紛失してしまいます。だからこそ、常に自分自身で消費者とコミュニケーションをとることが望ましいのです。そして、適切な問い合わせページは、消費者とビジネスオーナーの間に架け橋を作ります。 

まとめ

ページを離れようとしています。この時点までに、連絡先フォーム、連絡先フォームの重要性、Web サイトに連絡先フォームを追加するプロセスについて十分な知識を持っている必要があります。

何を待っていますか?今すぐElementorのお問い合わせフォームを追加して、ビジネスを成長させましょう。このプロセスについて不明な点がある場合は、お気軽に弊社までお問い合わせください。 お問い合わせ ページ。

コミュニケーションギャップがあなたと顧客の間に障壁を作らないようにしてください。