フォーム ブロックとフィールドについて理解する
このページで学べること
フォームエディターのさまざまなコンテンツブロック（つまり、要素と入力フィールド）をサインアップフォームで使用して、外観や購読者から収集する情報の種類をカスタマイズする方法をご確認ください。
ブロックの追加タブについて
サインアップフォームエディタで、[ブロックを追加] タブをクリックすると、フォームに追加できるさまざまなコンテンツブロックが表示されます。
ブロック カテゴリには 2 つの種類があります。
- 要素
- 入力フィールド
フォームのプレビューにブロックをドラッグ＆ドロップすると、編集オプションが左側のサイドバーに表示されます。ここから、テキストとスタイルを含むブロックの詳細テキストを調整できます。この編集メニューの下部では、ブロックの Visibility 設定も構成して、すべてのデバイスに表示するか、デスクトップのみにするか、モバイルのみにするかを制御できます。フォームの動的ブロックについて詳しくはこちら。
モバイル専用のサインアップフォームを作成している場合は、基本：モバイルフォームのデザインをご覧ください。
フォームにコンテンツブロックを追加する際のベストプラクティス
フォームでサイト訪問者に複数の情報（例：誕生日、メールアドレス、電話番号など）を尋ねるために複数のブロックとフィールドを含める予定の場合は、複数ステップフォームを使用します。複数ステップフォームを使用すると、訪問者に一度に多くのフィールドを提示して負担をかけることなく、訪問者についてより詳しく把握し、複数チャネルにわたって同意を収集できます。
フォームでメールアドレスと電話番号の両方を求める場合、リストの増加とコンプライアンスの観点から、これらのフィールドを 2 つの異なるステップに含めるのがベストプラクティスです。
フォーム要素
サインアップフォームの要素は、テキスト、ボタン、画像、クーポンなどのコンテンツをフォームに追加します。これらのブロックは、サインアップフォームの目的を訪問者に伝え、フォームを操作できるようにします。
テキストブロック
テキストブロックでは、見出し、手順、その他の表示用テキストなど、フォームにテキストコンテンツを挿入できます。Klaviyo のフォームエディターは UTF エンコーディング標準を使用しており、ラテン文字、絵文字、2 バイト文字などに対応しています。また、画像 URL の入力オプションを使用してインライン画像を追加できます。
ボタンブロック
ボタンブロックを使用すると、フォームを送信したユーザーに関する情報を Klaviyo で収集して保存できます。ボタンでは、閲覧者がフォームを閉じたり送信したりできるほか、ウェブサイト上の別ページに誘導したり、SMS メッセージングの購読を促したりできます。
ボタンに対して、次のアクションのいずれか 1 つを選択します。
- フォームを閉じる
フォームが閉じ、データは Klaviyo に送信されません。 - フォームを送信
訪問者が入力したフォームフィールドは Klaviyo に送信され、送信後 フィールドで選択したオプション（次のステップを表示、URL に移動、またはフォームを閉じる）に基づいてフォームが進行します。 - [URL に移動]（別のページにリダイレクト）
訪問者は指定した URL にリダイレクトされ、フォーム フィールドのデータは Klaviyo に送信されません。宛先 URL を入力する際は、https:// を含む完全な URL を使用してください（例： https://help.klaviyo.com/hc/en-ushelp.klaviyo.com/hc/en-us ではなく）。
Go to URL アクションは、不完全な URL では機能しません。
- SMS で購読
このオプションはモバイルのみのフォーム、またはすべてのデバイスを対象とするフォームの SMS オプトインステップのモバイルビューで構成できます。これは 訪問者が数回タップするだけで SMS を購読できるようにします（タップしてテキスト送信）。訪問者が Subscribe via SMS ボタンをクリックすると、テキストメッセージアプリが開き、購読のために送信できる事前入力済みメッセージが表示されます。- [購読キーワード] のドロップダウンからキーワードを選択してください。これは、アカウントの SMS 購読リストに追加されるために、送信先番号に対して誰かがテキスト送信する必要がある単語で、アカウント レベルで設定されます。
- オプトインメッセージを設定します。これは、メッセージアプリに表示されます。デフォルトでは「<organization_name> を購読するには、このテキストを送信してください！」と表示されますが、メッセージの内容はカスタマイズできます。このフィールドでは GSM-7 文字を最大 160 文字（1 メッセージ）まで入力できます。絵文字を含む特殊文字は使用できません。
- 複数の地域で運用していて送信元番号が 1 つ以上ある場合は、Sending Region の下で適切な番号を選択します。
サインアップフォームが送信するリストを変更する
ボタンの設定で、フォームの送信先リスト（つまり、新しい購読者が追加されるリスト）を変更できます。フォームの送信先リストを変更するには：
- フォーム エディター内のボタンをクリックしてください。
- 左側に表示されるメニューで、List to Submit.
の下にある新しいリストを選択します。
- 編集サイドバーで [戻る] をクリックします。
- フォームのコンテンツに問題がなければ、[公開] をクリックします。フォームがすでに公開されている場合でも、変更を公開して、新しい購読者が新しく選択したリストに追加されるようにする必要があります。
隠しフィールドの送信
非表示フィールドは、Klaviyo の購読者プロファイルに追加される追加プロパティです。これにより、フォームを操作した訪問者を追跡できます。デフォルトでは、すべてのフォームに、リストに追加された方法を識別する非表示フィールドとして $source プロパティがあります。
このオプションは、アクション が フォームを送信 に設定されているボタンでのみ使用できます。
$source プロパティやその他のプロパティ名をカスタマイズできます。フォーム上の他の入力と同様に、既に誰かのプロファイルに存在するプロパティ用の隠しフィールドを追加した場合、フォームが送信されるとそのプロパティは新しい値に上書きされます。たとえばフォームでコレクションの好みを収集し、以前にお客様がメンズコレクションに関心があると選択していたとします。このフォームに女性向けコレクションへの関心を示す隠しフィールドがある場合、ボタンがクリックされると preferences プロパティは上書きされます（つまり、男性向けから女性向けに変更されます）。
新しい非表示プロパティを追加するには、プロパティを追加 を選択してください。
画像ブロック
画像ブロックを使用すると、フォームに画像（例：ロゴ）を追加できます。このブロックを使用して画像を追加し、ブランドのルック＆フィールに合わせることができます。
JPEG、PNG、GIF ファイルはすべて使用できます。ウェブ上で表示されるすべての画像と同様に、ファイルサイズが大きいほど読み込み時間が遅くなります。最適なパフォーマンスのため、ファイルサイズは 50～100 KB を目安にしてください。
フォームエディターの [スタイル] タブで、背景画像や サイド画像 を追加することもできます。
クーポンブロック
クーポンブロックを追加してサイト訪問者がサインアップフォームを送信するよう促し、含まれているクーポンを使用してサイトで購入できるようにします。
フォームに静的またはユニークなクーポンコードを追加できます。Klaviyo のベストプラクティスでは、買い物客がコードを入手するためにウェブサイトを離れなくて済むよう、成功 ステップでこれらのコードを表示することを推奨しています。設定の詳細については、クーポンコードをサインアップフォームに追加する方法ガイドをご覧ください。
SMS 開示ブロック
SMS のコンプライアンスを維持できるように、SMS のオプトイン ボタンの上に SMS 開示文言を配置する必要があります。SMS 開示文言について詳細はこちら。
カウントダウンタイマー
カウントダウンタイマーはサインアップフォームに緊急性を持たせることができ、特別プロモーションやホリデー向けメッセージと組み合わせて使用されることがよくあります。フォームにカウントダウンタイマーを追加する方法について詳細はこちら。
サインアップカウンター ブロック
サインアップフォームにサインアップフォームのカウンターブロックを追加して、リアルタイムの送信数（例: "過去 1 時間で 500 人がこれらのお得情報にサインアップしました！"）を表示し、コンバージョンを高めてリストの増加を加速させます。このブロックはソーシャルプルーフを使用して緊急性を生み出し、サイト訪問者が購読するよう促します。
登録カウンターブロックをフォームに追加すると、次の設定を構成できます：
- 表示設定
サインアップがどのようにカウントされるかを決定します。購読者がフォームの成功ステップに到達する必要がある点にご注意ください。- 過去30日間の登録者数
- 過去 7 日間の登録者数
- 過去 24 時間の登録
- 過去1時間の登録者数
- __ 回送信後に表示
ブロックを表示するために必要な最小送信回数を指定します。
送信数の最小値を超えるまで、そのブロックはサイト訪問者に表示されません。最小送信数（例：送信 200 回）に達すると、ブロックがフォームに表示されます。
デフォルトのテキストには、選択した 表示 設定が反映されます。このテキストは設定可能ですが、リアルタイムの登録数を表示するため、{{ form_submit_count }} タグは削除しないでください。
入力フィールド
入力フィールドを使用すると、メールアドレス、名前、誕生日など、サイト訪問者の情報を収集できます。
すべての入力フィールドはプロファイルプロパティに接続する必要があります。プロファイルプロパティは、各購読者が送信したデータを保存するために使用されます。フォームに入力フィールドを追加する際は、プロファイルプロパティ ドロップダウンから既存のプロパティを選択するか、新しいプロパティ名を入力して [オプションを作成] をクリックし、新しいプロパティを作成してください。
特に指定がない限り、これらのフィールドからの入力は各個人のプロファイルページ内に保存されます。
外部連携（例：Shopify タグ）で同期された Klaviyo のカスタムプロファイルプロパティを更新することはお勧めしません。これは、次回外部連携が同期する際に、これらが上書きされるためです。
メール入力フィールド
メールの入力フィールドでは、訪問者がメールアドレスを入力して、フォームに接続されたリストを購読できます。フォームに追加できるメール入力は 1 つのみで、成功メッセージではなくフォームのいずれかのステップに表示する必要があります。
電話番号フィールド
電話番号フィールドを追加すると、デフォルトでプロモーション SMS 同意が収集され、任意の SMS メッセージを送信できるようになります。このブロックは、送信された電話番号を検証し、許容される番号形式で保存されるようにします。まだの場合は、SMS 同意を収集する場合に SMS を有効にし、SMS 同意を収集するあらゆる場所に含めるために 開示文言を設定してください。
必要に応じて、フォームが収集する SMS 同意の種類を調整できます。ただし、開示文言が同意の種類と一致し、送信するメッセージの種類の例を含めて、購読者が同意する内容を理解できるようにしてください。
また、購入者に最適な登録方法が表示されるように、SMS 同意を収集する際に 動的ブロックを使用することもできます。
テキスト入力フィールド
テキスト入力フィールドは、（日付やメールアドレスなどのように）特定の形式に従う必要がない情報を収集する場合や、あらかじめ用意した選択肢のリストを提示するのが適切でない場合に使用します。セグメンテーションとフローフィルターでは、大文字/小文字とスペルが区別される点にご注意ください。このデータをセグメンテーションやフィルタリングに使用する予定がある場合は、他のフィールドタイプを検討してください。
テキスト入力フィールドの一般的な使用例は、購読者の名前を収集することです。名フィールドを追加するには、ラベルまたはプレースホルダー テキストに “名” を使用し、プロファイルプロパティとして 名 を選択してください。
ラジオボタン
ラジオボタンでは、事前設定された選択肢のリストが提示され、購読者はそのうち 1 つのみ選択できます。これらは、性別や年齢層などの情報を収集する際に役立ちます。
プロファイルプロパティ フィールドには、このプロパティに使用したい名前を入力してください。例えば、フォームで訪問者にコーヒーと紅茶のどちらが好みかを尋ねる場合、「Beverage Choice」のようなカスタム プロファイルプロパティを使用してください。
プロパティ オプション セクションの ラベル 列を使用して、購読者が選択できるオプションを追加します。次に、Values 列に対応する値を追加します。これらの値はフォームに入力した人のプロファイルに保存されるため、参照しやすい回答の省略版を使用することをご検討ください。
オプションラベルが「Tea drinker」と「Coffee drinker」の場合、値はそれぞれ「tea」と「coffee」にできます。
購読者がラジオボタンの質問に回答すると、その回答は文字列の データ型として保存されます。
マルチチェックボックス
複数チェックボックスではオプションの一覧が表示され、購読者は希望する数だけオプションを選択できます。複数チェックボックスは、好みの情報、関心領域、デモグラフィック情報、また購読者が 1 つ以上のオプションを選択できる必要があるあらゆる質問を収集するのに便利です。
ラジオボタンフィールドと同様に、複数チェックボックスフィールドには、プロファイルプロパティ、ラベルのセット、値のセットが必要です。
購読者が複数チェックボックスの質問に回答すると、選択したオプション数に関係なく、その回答はリストの データ タイプとして保存されます。
日付フィールド
日付フィールドは、購読者が日付の値を入力するための最適な方法です。入力された値は、セクメンテーションに使用したり、日付ベースのフローをトリガーしたりできます。
たとえば、誕生日にフローでクーポンコードを送信できるよう、購読者の誕生日を収集したい場合があります。この場合は日付フィールドを追加し、対応するプロファイルプロパティを birthday に設定します。顧客に関する日付情報を収集したい場合は、日付が正しくフォーマットされるように日付ブロックを使用します。
フォームで日付の入力方法（例：DD/MM/YYYY）をカスタマイズするオプションがありますが、日付は個人プロファイル上でデフォルトの MM/DD/YYYY 形式で保存されます。Date Formatメニューから年を含まないオプション（例：MM DD）を選択した場合、各購読者のプロファイルにはデフォルトの年が自動的に含まれます。日付フィールドで送信された日付は、date データ型を使用して保存されます。
ドロップダウンフィールド
ドロップダウンはラジオボタンと同様に、購読者が事前設定されたリストから 1 つのオプションを選択できます。このオプションは、フォームのスペースを節約するのにも役立ちます。選択肢が 4 つを超える場合は、ラジオボタンではなくドロップダウンの使用を検討してください。ラジオボタンや複数チェックボックスと同様に、ドロップダウンフィールドにはプロファイルプロパティ、ラベルのセット、および値のセットが必要です。
年齢認証
年齢認証ブロックにより、アルコール関連ブランドが米国、英国、オーストラリアで SMS を使用できる場合があります。SMS の使用を開始するためにサインアップフォームへ年齢認証ブロックを追加するには、その前にアカウントで年齢認証を有効にする必要があります。Klaviyo でアルコールの年齢認証を行う方法について詳しくは、こちらをご覧ください。
要素または入力フィールドを削除
サインアップフォームから任意の要素または入力フィールドを削除するには：
- エディタ内のフォームプレビューで、削除したいブロックにカーソルを合わせます。
- 表示されるゴミ箱アイコンを選択します。
- ブロックを削除モーダルで、[ブロックを削除]を選択します。ブロックは削除すると復元できないことに注意してください。
次の手順
1 つのフォームにデスクトップビューとモバイルビューを分けて設定したい場合は、フォームで動的ブロックを使用するガイドをご覧ください。
サインアップフォームにブロックとフィールドを追加したら、ブランドに合わせてスタイルを設定する方法をご確認ください。ポップアップ、フライアウト、またはフルページ フォームを公開する準備ができたら、[公開] をクリックしてサイトで有効にします。埋め込みフォームを作成する場合は、公開するために フォームの埋め込みコードをサイトに追加してください。
その他のリソース
- サインアップフォームのスタートガイド
Klaviyo でサインアップフォームの作成とカスタマイズを行い、ウェブサイトに公開する方法を学びましょう。より多くの顧客からメールアドレスや電話番号を収集できるようになり、長期的な顧客関係を構築できます。
- 基本：モバイルフォームのデザイン
モバイルデバイス向けのサインアップフォームを設計するための基本原則 6 つを確認しましょう。
- フォームで動的ブロックを使用する方法
動的ブロックについて、またサインアップフォームでそれらを使用して、デスクトップとモバイルデバイスの買い物客に向けて異なる表示と体験を作成する方法をご確認ください。フォーム内の任意のブロックは、表示設定を調整することで動的にできます。