AI要約
ユーザーが選択を行うと自動的に送信されるシンプルなフィードバックフォームを作成しますか？これは、ユーザーがワンクリックで回答できる、簡単な「この記事は役に立ちましたか？」アンケートに最適です。選択後に自動的に送信することで、ユーザーにとって手間のかからないプロセスにすることで、回答率を最大化できます。
このガイドでは、ユーザーが選択したときに即座に送信される、合理化されたフィードバックフォームの作成方法を説明します。
フォームの設定
まず、この構造で新しいフォームを作成します。
- オプションを整理するためのレイアウトフィールド
- 2つのチェックボックスフィールド – 「はい」と「いいえ」のオプションのために、各レイアウト列に1つずつ
- ページタイトルをキャプチャするための非表示フィールド
フォームの作成にヘルプが必要な場合は、このフォーム作成ガイドを確認してください。
アイコンの選択肢の設定
洗練された外観にするために、はい/いいえのオプションにはアイコンの選択肢を使用します。チェックボックスフィールドをこれらの設定で構成してください。
はいチェックボックス
- アイコンの選択肢を使用を有効にする
- アイコン: face-smile
- アイコンの色: #066aab
- アイコンのサイズ: Large
- アイコン選択スタイル: Classic
- ラベルを非表示: 有効
いいえチェックボックス:
- face-frownアイコンを使用した同じ設定
非表示フィールドへのスマートタグの追加
非表示フィールドには、フォームが送信されたときにページタイトルをキャプチャするためにスマートタグを追加します。WPFormsフォームビルダーの組み込みスマートタグの詳細については、このドキュメントを確認してください。
非表示フィールドのデフォルト値にスマートタグ {page_title} を追加しました。
フォームの自動送信
これで、サイトにスニペットを追加する時間です。サイトにスニペットを追加する方法にヘルプが必要な場合は、このチュートリアルを確認してください。
このスニペットは、フォームID 3046でのみ実行され、チェックボックスフィールドのいずれかがチェックされると、この関数がトリガーされ、フォームが自動的に送信されます。
このフォームIDを自分のフォームIDと一致するように更新する必要があります。フォームIDの見つけ方について支援が必要な場合は、このガイドを確認してください。
フォームのスタイリング
このCSSをフォームに適切にスタイル設定するために追加します。フォームID（3046）とフィールドID（3および4）を自分のフォームに合わせて更新してください。
このCSSは、不要な要素を非表示にし、アイコンを完璧に配置します。CSSの追加に関するヘルプについては、WordPressサイトにCSSコードを追加する方法に関するガイドを確認してください。
正しいフォームとフィールドIDをターゲットにしていることを確認するために、これらのCSSルールでフォームIDを更新する必要があります。
このドキュメントのフォームIDは3046です。最初のチェックボックスはフィールドID3、2番目のチェックボックスはフィールドID4です。
訪問者がいずれかのオプションを選択すると、フォームは自動的に送信されます。
これで完了です！訪問者がいずれかのアイコン選択をクリックすると、フォームは自動的に送信されます。フォームの回答に基づいて、送信ボタンを表示または非表示にしますか？送信ボタンを条件付きで表示する方法のチュートリアルをご覧ください。