この記事では、無料の Elementor を使用してフォームを作成する方法について説明します。
フォーム ウィジェットは Elementor Pro でのみ使用できますが、無料版の Elementor でフォームを作成できないわけではありません。
無料版の Elementor で作成しているページにフォームを追加する必要がある場合は、この記事で説明する XNUMX つの方法を使用できます。
Elementor には、プロ版でも無料版でも、フォームの作成に使用できる XNUMX つのウィジェットが付属しています。 これらは、HTML およびショートコード ウィジェットです。 HTML ウィジェットを使用すると、HTML フォームを埋め込むことができます。一方、ショートコード ウィジェットを使用すると、次のようなショートコードを使用するフォーム プラグインからフォームを埋め込むことができます。 お問合せフォーム 7.
HTMLウィジェットを使用してElementor Free版でフォームを作成する
この方法では、フォームを作成するための HTML スキルが必要です。 または、インターネットから HTML フォーム テンプレートをダウンロードできます。 W3docsには60以上あります HTML フォーム テンプレート 無料でダウンロードできます。
開始するには、新しいページを作成し、Elementor で編集します (ページ – >追加）。 もちろん、既存のページを変更することもできます。 新しいページにフォームを作成する場合は、左下のパネルにある歯車アイコンをクリックしてフォーム レイアウトを設定することを忘れないでください。
編集領域のプラス ボタンをクリックして新しいセクションを追加し、左側のパネルから編集領域に HTML フォームをドラッグして追加します。 ご希望のエリアに設置してください。 次に、左側のパネルに移動して、フォームの HTML コードをフィールドに貼り付けます。 HTMLコード タブの下 中身.
編集が完了したら、ページを公開/更新します。
参照してください： Elementor ウィジェット/テンプレートを Gutenberg ブロックとして使用する方法
事。 HTML フォームでスタイリングに外部 CSS、画像、または JavaScript を使用している場合は、CSS コード、画像、および JavaScript を含むフォルダーを Web サイトのルート ディレクトリにアップロードしてください。
お問い合わせフォーム7を使用してElementor freeでフォームを作成する
HTML のスキルがなく、HTML フォーム テンプレートを使用したくない場合は、プラグインを使用して無料版の Elementor でフォームを作成できます。 お問い合わせフォーム 7. 実は他にもたくさんのフォームプラグインがあります。 お勧めします お問い合わせフォーム7 WordPress で最も人気のあるフォーム プラグインであり、完全に無料です。
まず、プラグインをインストールします お問合せフォーム 7. これを行うには、次の場所に移動します。 拡張機能 – > 追加. 検索ボックスに「contact form 7」と入力し、ボタンをクリックします 今すぐインストール 一度見つけたら。
インストールしたらすぐにプラグインを有効化してください。
Contact Form 7 にはデフォルトのフォーム (a お問い合わせフォーム ）。 必要に応じて使用できます。 代わりに新しいフォームを作成したい場合は、 連絡先 – > 追加. 後で簡単に識別できるように、フォームに名前を付けます。
デフォルトでは、フォームは名前、メール、件名、メッセージの XNUMX つのフィールドで構成されます。
新しいフィールドを追加する場合は、新しいフィールドを追加する領域にポインターを置きます (既存のフィールドの下または上に置くことができます)。 形式で新しいフォーム フィールドのラベルを追加します。 <label> votre label préféré </label>.
ラベルの直後にポインターを置き、フィールド タブでフィールドを選択します。 新しい改行を追加して、新しいフィールドを他の既存のフィールドよりもきれいにすることができます。
フィールドに入力してクリックします タグを挿入する (すべてをデフォルトのままにしておくことができます)。
Contact Form 7 は、フォームから送信された提出物を電子メールに送信します。 タブからメールを設定できます 電子メール.
タブに移動できます メッセージ デフォルトのメッセージを上書きしたい場合。 訪問者がフォームを正常に送信した後に表示されるメッセージや、フォームが送信されなかった場合のエラー メッセージなどをカスタマイズできます。
ボタンをクリックします Enregistrer フォームの編集とショートコードのコピーが完了したら。
作成したばかりのフォームを Elementor ページに追加するには、新しいページを作成して Elementor で編集するか、既存のページを編集することもできます。
また読みます： スマートフォンで Elementor ポップアップを無効にする方法
フォームを配置する新しいセクションを追加し、 ショートコードウィジェット. ショートコード ウィジェットが追加されたら、左側のパネルに移動し、コピーしたショートコードをフィールドに貼り付けます。 ショート タブの下 中身.
編集が完了したら、ページを公開/更新します。
Contact Form 7 は、 ワードプレスのテーマ あなたが使用すること。 Contact Form 7 フォームのスタイルを設定できますが、CSS のスキルが必要です。 この記事は、次の URL からもご覧いただけます。 Essential Addons と Elementor を使用して Contact Form 7 フォームをカスタマイズする方法。
ElementorProを今すぐ入手!!!
まとめ
そう ！ 無料の Elementor を使用してフォームを作成する方法を示すこの記事は以上です。 そこに行く方法について懸念がある場合は、 commentaires.
ただし、相談することもできます 私たちのリソース、インターネットサイトの作成プロジェクトを実行するためにより多くの要素が必要な場合は、 WordPressブログ作成 または Divi：史上最高のWordPressテーマ.
しかし、その間に、 さまざまなソーシャルネットワークでこの記事を共有する.
...
