フォームを作成する
Formsアプリを使用して、お客様にメールマーケティングリストへの参加を促すフォームを作成できます。フォームの設定を使用して、あなたのブランドに合い、プライバシーに準拠した方法でお客様情報を取得できるようなフォームにカスタマイズできます。
ポップアップフォーム、インラインフォーム、または両方を同時にストアに表示することができます。フォームタイプについて詳しくはこちらをご覧ください。
フォームタイプ
フォームを作成する際は、以下のフォームタイプから選択できます。
| フォームタイプ | 説明 | 必要事項 |
|---|---|---|
| ポップアップフォーム | ストアのコンテンツの上にオーバーレイとしてフロート表示されるコンテンツです。ポップアップフォームの設定について詳しくはこちらをご覧ください。 | ポップアップフォームをストアに表示するには、Formsテーマアプリの埋め込みをテーマにインストールする必要があります。ポップアップフォームの設定について確認してください。 |
| インラインフォーム | ストア内のページなど、テーマの特定のセクションに表示されます。インラインフォームの設定について詳しくはこちらをご覧ください。 | ストアにインラインフォームを表示するには、Online Store 2.0のテーマを使用する必要があります。 |
フォームフォームを作成する
管理画面で、Formsアプリを使用してフォームを作成することができます。フォームを作成すると、ストアで有効になります。フォームの管理について詳しくはこちらをご覧ください。
手順
- 管理画面から [アプリ] > [Forms] の順に進みます。
- [フォームを作成] をクリックします。
- [ポップアップ] フォームを作成するか、[インライン] フォームを作成するかを選択します。
- フォームの名前を入力します。
- [作成する] をクリックします。
- 各種設定に基づいてフォームを設定します。フォームの設定について詳しくはこちらをご覧ください。
- [保存] をクリックします。
すべてのフォームの設定
以下の設定は、ポップアップフォームとインラインフォームの両方に適用され、フォームを作成するときに設定できます。
ポップアップフォームとインラインフォームの具体的な設定についての詳細をご確認ください。
フォーム
[フォーム] 設定によって、フォームのコンテンツが決まります。
| 設定 | 説明 |
|---|---|
| Title | フォームのタイトル。ニュースレターの購読を促すインセンティブやCTA (行動喚起要素) を指定できます。最大50文字です。 |
| コンテンツ | タイトルの下に表示されるテキスト。このフィールドでは、サインアップを促すインセンティブを指定することと、インセンティブをシンプルにすることを検討してください。最大100文字です。 |
| フォームの内容 | フォームによって収集される情報。デフォルトでは、お客様の名前とメールアドレスがフォームによって収集されます。追加情報を収集するには、[新しいフィールドを追加] をクリックします。以下の追加フィールドのいずれかを追加または削除できます。[名]、[姓]、[誕生日]、[電話]、[メール]。フォームのフィールドすべてに入力が必須かどうかなど、入力の詳細を変更するには、フィールドの名前をクリックします。フィールドを削除するには、フィールド名の横にある削除アイコン (⊖) をクリックします。 フォームには、[メール] または [電話] のいずれかを必須フィールドとして追加する必要があります。 フォーム用のカスタム入力フィールドを作成するには、[新しいフィールドを追加する] をクリックします。 |
| ボタンのラベル | 送信ボタンに表示されるテキスト。ボタンには「サインアップ」、「登録」、「送信」、「ディスカウントを獲得」など、明確なCTAが設定されている必要があります。最大25文字です。 |
| 免責を同意に含める (任意) | 「メールアドレスを送信することによりマーケティングメールの受信に同意したことになる」といった文言の情報を免責に含めることができます。ストアの利用規約またはプライバシーポリシーへのリンクを追加することを検討してください。最大100文字です。 |
カスタム入力フィールド
カスタム入力フィールドはメタフィールドとして保存されます。フォームにカスタムフィールドを追加する場合、対応するメタフィールドに名前を付ける必要があります。保存したメタフィールドは、管理画面のお客様データメタフィールドまたは会社データメタフィールドで確認できます。[設定] > [カスタムデータ] > [お客様] の順に移動してください。このデータを使用して、B2B会社になるリクエストを評価したり、お客様セグメントを作成したりすることができます。
カスタムフィールドは、以下のいずれかのデータタイプにすることができます。
- 単一行のテキスト：1つの文に適した短いテキストフィールドです。
- ドロップダウンリスト：ドロップダウンメニューとして表示され、ユーザーはこのリストから1個のオプションを選択できます。
- ラジオボタン：複数のボタンとして表示され、ユーザーはこのリストから1個のオプションを選択できます。
- 複数行のテキスト：段落に適した長いテキストフィールドです。
- 複数選択：複数のチェックボックスとして表示されるオプションのリストです。ドロップダウンリストやラジオボタンとは異なり、ユーザーは複数の項目を選択できます。
- 日付：特定の日付です。
- 数値：1つの数値です。
フィールドの各タイプには、必要に応じて特定の要件を設定できます。
たとえば、お客様の靴のサイズを記録するためのフィールドを作成したい場合、[数字] フィールドを選択し、そのメタフィールドに靴のサイズと名付けることができます。その後、そのフィールドが1～16の値を受け入れるように設定できます。
成功
[成功] 設定によって、お客様がフォームを正しく入力した後に表示されるコンテンツが決まります。
[成功] セクションで入力する必要があるフィールドは、選択した [確認動作] によって異なる場合があります。
- [メッセージを表示] では、フォームを送信したお客様にメッセージが表示されます。
- [別のページにリダイレクト] では、選択したページにフォームを送信したお客様をリダイレクトします。
| 設定 | 説明 | 確認動作 |
|---|---|---|
| ディスカウント (任意) | [ディスカウント] 設定によって、フォームを入力したお客様が成功ステップに到達したときに、クーポンコードを提供するかどうかが決まります。クーポンコードを追加するには、[ディスカウントを選択] をクリックして既存のクーポンコードを選択するか、新しいディスカウントを作成します。 | メッセージを表示 |
| Title | フォームの成功セクションのタイトルです。お客様がメールリストに正常にサインアップしたことを確認するメッセージを指定できます。たとえば「ディスカウントがあります」、「VIPアクセスを今すぐ開始」、「ご登録ありがとうございます」などと指定できます。最大50文字です。 | メッセージを表示 |
| コンテンツ | フォームの成功セクションの本文です。詳細情報を記載したり、メールリストにサインアップする利点を強調したりできます。たとえば「最新リリースや特典について、いち早くお知らせします」などと記載できます。 | メッセージを表示 |
| リダイレクトURL | フォームを入力したお客様をリダイレクトさせるURL。たとえば、メール購読者に「サンキュー」ページで特典を提供したり、新規のB2Bのお客様に「次のステップ」ページを表示したりします。 | 別のページにリダイレクト |
タグ
[タグ] 設定によって、フォームの入力を正しく完了したお客様にタグを追加するかどうかが決まります。タグを追加するには、[タグを検索または作成] フィールドにタグを入力します。
メール通知
[メール通知] の設定では、このフォームが送信されるたびにストアオーナーにメールを送信するかどうかを決定できます。
オートメーションとワークフロー
[オートメーションとワークフロー] 設定を使用すると、フォームをShopify Flowの既存のマーケティングオートメーションと統合できます。既存のオートメーションに接続するか、新しいオートメーションを作成できます。
Shopifyでマーケティングオートメーションを作成する方法について詳しくは、こちらをご覧ください。
ポップアップフォームの設定
以下の設定は、ポップアップフォーム特有の設定です。
フォーム表示
[フォーム表示] 設定によって、ストアでフォームがどのように表示されるかが決まります。
| 設定 | 説明 |
|---|---|
| フロート | ティーザーとフォームを、ストアフロントに表示されるフローティングセクションとして表示します。[ストアでの位置] メニューから、ストアフロント上でのセクションの位置を選択します。 |
| オーバーレイ | ページ中央にフォームを表示し、残りのストアフロントにオーバーレイを適用します。オーバーレイの色と不透明率を選択するには、[オーバーレイの色] をクリックします。 |
ティーザー
[ティーザー] 設定によって、フォームのティーザーがいつ表示されるかが決まります。ティーザーセクションは、ストアで表示される小さなポップアップです。お客様がティーザーをクリックすると、フォームが開きます。
| 設定 | 説明 |
|---|---|
| 表示する | どのタイミングでお客様にティーザーセクションを表示するか決定します。
|
| ストアでの位置 | ストアのどこにティーザーを表示するか決定します。(回転) 表示オプションでは、ティザーセクションが横向きに表示されます。 |
| Title | ティーザーセクションに表示されるテキスト。 |
スタイル
[スタイル] 設定によって、フォームの外観が決まります。組み合わせが効果的ではない色、コントラストが不十分な色、読みにくい色を選択すると、警告が表示されます。
Formsアプリの [ブランドの色] セクションでは、ブランドの色として追加した色を見つけて選択できます。
| 設定 | 説明 |
|---|---|
| 色 | フォームの背景の色、有効なフィールドの色、ボタンのラベルの色、エラーメッセージの色を、ブランドとテーマに合わせて変更します。 |
| フォームフィールド | 白または透明を選択します。 |
| タイポグラフィー | タイトルと本文のテキストに使用するフォントを選択します。 |
画像
[画像] 設定によって、画像がフォームに表示されるかどうかが決まり、画像の配置と外観に影響が及びます。
| 設定 | 説明 |
|---|---|
| 画像のオプション | フォーム上で画像が表示される場所。 |
| 画像 | このフィールドは、[背景画像]、[左に画像]、または [右に画像] を選択した場合に表示されます。[画像を追加] をクリックして、デバイスから画像をアップロードします。 |
| 画像の不透明率 | このフィールドは、[背景画像] を選択した場合に表示されます。画像の不透明率を選択するには、スライダーを使用します。100の場合、アップロードした画像だけが表示されます。不透明率を低くすると、[色] セクションの背景色を使って画像の濃淡が設定されます。 |
行動
[行動] 設定によって、フォームがいつ、どこで表示されるのかが決まります。
| 設定 | 説明 |
|---|---|
| デバイス | フォームをすべてのデバイスに表示するか、デスクトップデバイスにのみ表示するか、モバイルデバイスにのみ表示するかを選択します。 |
| ページ | フォームをすべてのページに表示するか、特定のページにのみ表示するか選択します。 |
| トリガー | フォームを1ページ目、2ページ目、または3ページ目に直ちに表示するか、10秒または30秒経ってから表示するかを選択できます。このセクションでは、[訪問者がページを離れようとしたときにフォームを表示する (デスクトップのみ)] を選択することもできます。このチェックボックスが選択されている場合、訪問者がカーソルをアドレスバーに移動すると、フォームが表示されます。 |
インラインフォームの設定
以下は、インラインフォーム特有の設定です。
スタイル
[スタイル] 設定によって、フォームの外観が決まります。インラインフォームの色やレイアウトを変更するには、テーマエディタを使用します。
| 設定 | 説明 |
|---|---|
| タイポグラフィー | タイトルと本文のテキストに使用するフォントを選択します。 |
配置
[配置] 設定によって、フォームが表示されるストアの場所が決まります。
| 設定 | 説明 |
|---|---|
| 既存のテンプレート | [コピー] をクリックして、テーマの既存のセクションにフォームを追加します。フォームのフォームIDをコピーした後、フォームを表示するテンプレートにアプリブロックを追加できます。テーマエディタでアプリブロックを追加した後、コピーしたIDを [フォームID] フィールドに貼り付けます。 |
| ランディングページ |
[作成] をクリックして、フォームのテーマに新しいページを作成します。新しいページの名前とURLを編集するか、必要に応じてデフォルトのものを使用して [保存] をクリックします。[完了] をクリックしてフォーム設定の編集を続けるか、[テーマエディタを開く] をクリックして、テーマエディタでページをカスタマイズします。 フォーム用にページを作成した後、Formsアプリからそのページを削除することはできません。ページを削除する必要がある場合は、管理画面から削除できます。 |