ベストセラー人気 WordPress テーマTop 30 詳細

WPFormsに複数の列のレイアウトお問い合わせフォームを作成する方法

Last Updated:2021年6月20日| コメントを残す
  • Naver ブログを共有する
  • Naver バンドに共有する
  • Facebook 共有する
  • Twitter 共有する
  • 카카오스토리공유하기

WPFormsは、ドラッグ・アンド・ドロップ方式で簡単にお問い合わせフォームを作ることができる WordPress コンタクトフォームのプラグインです。 このプラグインは、現在、400万を超えるサイトに設置されて使用されています。 WPFormsプラグインで2列、3列など複数の列レイアウト問い合わせフォームを作成することができます。

WPFormsに複数の列レイアウトお問い合わせフォームを作成する(2列、3列など)

WPFormsに複数の列のレイアウトお問い合わせフォームを作成する方法

WPFormsコンタクトフォームのプラグインを使用している場合は、フィールドを複数の列やすく表示することができます。 ちなみに無料コンタクトフォームのプラグインであるContact Form 7は、HTMLとCSSを使用して複数の列のレイアウト(多段レイアウト)を作成することができます。

次のビデオチュートリアルで複数列のレイアウト、フォームを作成する方法が説明しているので参考にしてみてください。

レイアウト設定を開くには、ビルダーで任意のフィールドをクリックして、 Field Options 画面を実行することができます。 Field Options 画面で 高度なオプションをクリックしてください。 CSSクラスの設定を使用してカラム(列)を構成することができます。

WordPress WPFormsに複数の列レイアウトお問い合わせフォーム作成

Show Layouts(レイアウト表示)をクリックし、目的の列のレイアウトを選択すると、CSSクラスが自動的に追加されます。

WordPress WPFormsプラグインで多段レイアウトお問い合わせフォーム作成

手動でCSSクラスを追加することも可能です。

  • wpforms-one-half
  • wpforms-one-third
  • wpforms-one-fourth
  • wpforms-one-fifth
  • wpforms-one-sixth
  • wpforms-two-thirds
  • wpforms-two-fourths
  • wpforms-two-fifths
  • wpforms-two-sixths
  • wpforms-three-fourths
  • wpforms-three-fifths
  • wpforms-three-sixths
  • wpforms-four-fifths
  • wpforms-five-sixths

手動でクラスを入れるよりも、ビジュアルモードでレイアウトを選択することが容易になります。

フィールドの幅が小さく表示される場合 Advanced Options(詳細オプション) セクションで Field Size(フィールドサイズ) オプションを 小さい, ミディアム, 大型タッチスクリーン の中から選択することができます。

WordPress WPFormsに複数の列のレイアウトお問い合わせフォームを作成する方法

フィールドのサイズが小さい場合 ミディアム 代わりに 大型タッチスクリーンを選択してください。

多段のレイアウトに設定すると、フィールドをクリックすることができない問題が発生した場合

複数の列のレイアウトを設定すると、フィールドがクリックされない問題が発生する場合があります。 この問題は、スタイルの衝突が原因で発生することがあります。

この問題が発生した場合 WordPress 管理者ページ> WPForms> Settings> General タブに移動して Include Form Styling(フォームスタイリングを含む)Base and form theme styling(基本、フォームのテーマのスタイリング)に変更し、このない現象が解決されています。

WPForms複数の列レイアウトのフィールドをクリックすることができないエラーが発生した場合

Include Form Styling オプションが Base styling onlyに指定されているフィールドをクリックすることができない問題が現れるというユーザーがいます。 Base and form theme stylingにオプションを変更して、問題が解決するかテストして見て、問題が解決しない場合、他のコンタクトフォームのプラグインに変えることを検討してください。 私 Quformプラグイン(有料のプラグイン)を使用しているが、このプラグインを使用して多段にフィールドを表示することができます。

おわりに

以上でWPFormsで多段レイアウトのお問い合わせフォームを作成する方法について説明しました。 WPFormsは無料版を使用して、シンプルですっきりとしたお問い合わせフォームを作成することができます。 事前製作されたフォームテンプレート、高級フィールドは、複数ページのフォーム、ファイルのアップロード、スパム保護、条件付きロジック、ニュースレターフォーム、MailChimpなどをサポート、ペイパル/ストライプ統合、フォームランディングページ、対話型のフォームは、 調査機能 などの高度な機能が必要な場合 WPForms有料版を使用することができます。

無料コンタクトフォームのプラグインで最も人気のあるContact Form 7は、現在の500万を超えるサイトに設置されて使用されています。 このプラグインは、HTMLやCSSコードを知っている場合、カスタムするにお勧めです。 CF7は三好貴之(三好崇之)と呼ばれる日本人の開発者によって作られ、日本の富士山の絵がバナー画像に使用されて( "WordPress お問い合わせフォームプラグインContact Form 7と富士山")。

参照



コメントを残す

コメント