フォームを使用すると、ユーザーから名前、連絡先、住所などの重要な情報を収集できます。このデータを収集することで、ユーザーの購買習慣、好み、ニーズについての洞察を得ることができ、製品やサービスの最適化のための貴重な参考情報となります。この記事では、SHOPLINEで直接フォームを作成し、サードパーティのフォームツールZOHO FORMSと統合するカスタムコードの使用方法について紹介します。

目次

• 直接フォームを作成する
• ZOHO FORMSを使用したフォームの作成
• ZOHO FormsをSHOPLINEウェブサイトに埋め込む

直接フォームを作成する

SHOPLINEで「お問い合わせ」フォームを作成するには、以下の手順を実行できます:

1. オンラインストア > ページ > ページを作成に移動します。テーマテンプレートとしてお問い合わせを選択します。
   
2. ページタイトルの横にある小さな目のアイコン（プレビュー）をクリックして、フォームのスタイルを表示します。
3. フォームスタイルは現在、固定テンプレートに基づいており、以下の図に示すように、フォームスタイルやコンテンツのカスタマイズはサポートされていません。
4. フォームページをナビゲーションメニューにリンクさせることをお勧めします。これにより、顧客がフォームページを見つけて個人情報を残しやすくなります。
   
   
   

カスタムコードを使用して、サードパーティのフォームツールZOHO FORMSと統合する方法

フォームにさらにカスタムオプションを設定したい場合は、ZOHO FORMSのようなサードパーティのフォームツールを使用することを検討してください。

市場には多くのサードパーティのフォームツールがあり、企業は自分たちのニーズに最適なツールを選択することができます。この記事では、ZOHO FORMSを参照しています。

ZOHO FORMSが推奨される主な理由は2つあります。まず、ZOHOは海外のバイヤーにとって使いやすい国際ツールであること。次に、500通のメールの見積もりを含む、企業の指定されたメールアドレスに直接お問い合わせを送信することをサポートしています。

以下の図は、ZOHOフォームのスクリーンショットを示しています。

このようなフォームを作成するには、次の手順に従ってください。

ZOHO FORMSアカウントにサインアップするには、次の手順を実行してください:

1. ビジネス用にZOHO FORMSアカウントにサインアップし、アカウントを確認してください。登録リンク: https://www.zoho.com/forms/? zredirect=f&lb=fr&zsrc=bheader
2. お問い合わせがメールに届くように、メールアカウントにログインして確認し、この手順を完了してください。

ZOHO FORMSフォームを設定するには、次の手順を実行してください:

1. アカウントにサインアップした後、ウェルカムページでLet’s Get Startedをクリックしてフォームを作成してください。
   
2. 最初に、CREATE FROM SCRATCHタブをクリックします。テンプレートを使用する場合は、USE TEMPLATESタブをクリックしてください。 Form TitleテキストボックスにGET A QUOTEを入力します。無料サンプルを提供する場合は、GET FREE SAMPLESを使用できます。説明欄を空白のままにしてもよいし、プロモーションや割引などの短いインパクトのあるメッセージを記入して潜在的な顧客を引き付けることもできます。フォームを作成するには、Createをクリックしてください。
   
3. フォームを構成します。画面の左側には、ラベルコンポーネントエリアがあり、コンポーネントを画面の中央にドラッグアンドドロップできます。タイトルまたはコンポーネントをクリックすると、プロパティポップアップでテキスト、指示、配置を変更できます。バイヤーから必要な情報のみを求めてください。情報を求めすぎたり、必須フィールドを設定すると、バイヤーがフォームの記入をためらう可能性があります。 Name, Email, Phone, Whatsapp（または他の連絡方法）、およびMessage情報のみを収集することをお勧めします。 EmailとMessageフィールドは必須フィールドとして設定されています。
   

ラベルコンポーネントの必要な設定は次のとおりです: 画面の左側のコンポーネントエリアからName, Email, Phone, Single Line, and Multi Lineコンポーネントを画面の中央にドラッグアンドドロップしてください。

• メールを必須フィールドとして設定します。 メールをクリックします。プロパティポップアップで、検証を必須に設定して、メールを必須フィールドにします。 メールコンポーネントの右上隅に赤いアスタリスク（*）が表示されると、設定が正常に適用されたことを示します。
  
  
  
  
• 電話番号コンポーネントのための指示を設定します。購入者が電話番号を入力する際に、国番号が含まれるようにリマインドすることで、電話番号がどの国に属しているかを区別し、適切な連絡を確保できます。 電話をクリックします。プロパティポップアップで、指示ボックスに国番号から始めてください。と入力します。
  
• WhatsAppまたは他の連絡方法を使用します。 単一行をクリックします。プロパティポップアップで、フィールドラベルをWhatsAppまたは他の連絡方法に設定し、指示ボックスに48時間以内にご連絡いたします。と入力します。オプションですが、できるだけ多くの連絡先詳細を入力するよう購入者に促すことが常に良いです。したがって、48時間以内にご連絡いたします。という指示を含めます。会社のポリシーまたは特定の状況に応じて、「24時間」や「12時間」といった、連絡が取られる時間枠を示すバリエーションも使用できます。
  
  
  
  
• 購入者が意図を書き留めるために、メッセージを必須フィールドとして設定します。 複数行をクリックします。プロパティポップアップで、フィールドラベルをメッセージに、検証を必須に設定して、複数行を必須フィールドにします。
  
  
  
  
• ラベルの場所を設定します。 見積もりを取得のタイトルをクリックします。プロパティポップアップで、ラベル配置を左に設定して、入力ボックスの左側にラベルを配置して、清潔で美しい外観にします。フォームを保存するには、右上隅にある保存をクリックします。
  
  
  
  
• フォームをプレビューします。ナビゲーションメニューの右側にあるフォームにアクセスをクリックして、フォームの外観を確認します。デフォルトのレイアウトデザインに満足していない場合は、ナビゲーションメニューのテーマをクリックして、他のレイアウトを選択できます。
  

4. フォームが正常に送信された後、購入者に感謝メッセージを表示するサンクスページを設定します。 Email フィールドが空でない場合にサンクスページにリダイレクトするルールを設定します。ナビゲーションメニューで Rules をクリックしてルール構成ページを開きます。左側のパネルで Form Rules をクリックし、画面の中央にある Configure Now をクリックします。
   

プロパティポップアップで、Rule Name を Thank you page に設定し、If 部分に Any, Email, and Is Not Empty を含め、Then 部分に Redirect To を含めます。 Redirect To の横にある編集ボックスをクリックして、感謝メッセージを設定します。

Thank You Page タブで、プレーンテキストを選択し、テキストボックスに Thank you!  We will contact you soon. と入力します。感謝メッセージを保存するには Done をクリックします。

Add をクリックして Thank you page ルールを保存します。

5. フォームの送信を直接受け取るためのメールアドレスを指定します。ナビゲーションメニューで Settings をクリックしてルール設定ページを開きます。左側のパネルで Email & Notifications > Email を選択し、画面の中央にある Configure をクリックします。
   

差出人と受取人のメールアドレスを設定します。無料版では、メールアドレスはすでに確認済みの登録メールアカウントからのみ選択できます。メールの件名コンボボックスの右側のドロップダウンリストから Email を選択して、メールの件名として購入者のメールを使用します。 Include form submission in the body of the email チェックボックスを選択し、右下の Done をクリックします。

6. ウェブサイトに配置するためのフォームリンクを取得します。ナビゲーションメニューで Share をクリックして共有ページを開きます。左側のパネルで Public をクリックし、Enabled トグルがオンになっていることを確認します。フォームのパーマリンク（URL）をコピーし、SHOPLINEの管理パネルに貼り付けてウェブサイトに統合します。
   
   
   

SHOPLINEウェブサイトにZOHOフォームを埋め込む

SHOPLINEでオンラインストアのナビゲーションメニューにフォームを関連付ける

次の手順を実行して、SHOPLINEのオンラインストアのナビゲーションメニューにフォームを関連付けることができます：

1. SHOPLINEの管理パネルにログインし、オンラインストア ＞ ナビゲーション ＞ ヘッダーに移動します。 ナビゲーションメニューの編集 ページが表示されます。ウェブサイトに複数のナビゲーションコントロールがある場合は、フォームが必要なすべてのコントロールを設定する必要があります。
   
2. 編集ページで、メニューアイテムを追加をクリックします。 メニューアイテムのタイトルを見積もりを取得または無料サンプルを入手に設定します。
   
3. ZOHOフォームのコピーされたURLをリファラルURL入力ボックスに貼り付けます。
4. フォームをウェブサイトに関連付けるために追加をクリックします。

ZOHOフォームをウェブサイトのホームページに埋め込む

次の手順を実行して、ZOHOフォームをウェブサイトのホームページに埋め込むこともできます：

1. ZOHOウェブサイトのフォームビルダーで、共有 ＞ 埋め込み ＞ JavaScriptに移動し、提供されたコードスニペットをコピーします。
2. ウェブサイトを開き、ホームページデザインに移動し、デザイン ＞ コンポーネントの追加 ＞ カスタムHTMLを選択します。
3. ステップ1からコピーしたコードを編集ボックスに貼り付け、公開をクリックしてフォームをホームページに追加します。
4. ホームページの効果：
   

カスタムページにZOHOフォームを埋め込む

次の手順を実行して、ウェブサイトのカスタムページにZOHOフォームを埋め込むこともできます：

1. ZOHOウェブサイトのフォームビルダーで、共有 ＞ 埋め込み ＞ JavaScriptに移動し、提供されたコードスニペットをコピーします。
2. カスタムページを作成します。
   
3. ソースコードアイコンをクリックして、コピーしたコードを貼り付け、青枠のセクション内の幅を100%に変更します。その後、保存をクリックして設定を更新し、フォームを埋め込みます。カスタムページをストアのホームページのメニューナビゲーション設定を通じて追加できます。

フォーム追加後の問い合わせテスト

ウェブサイトにフォームを追加した後は、フォームが正常に機能しているかをテストすることが重要です。フォームをテストする手順は以下の通りです：

1. ウェブサイトを開き、ナビゲーションメニューで見積もりを取得をクリックします。フォームが新しいタブで開くことと、フィールドが設定と一致していることを確認します。
2. フォームに記入し、必須フィールドが機能しているかどうかを確認するために送信を試みます。
3. フォームを送信した後、お礼のメッセージが表示されるかどうかを確認します。
4. メールアカウントにログインし、お問い合わせを受信したかどうかを確認します。
5. お問い合わせは、ZOHO FORMS管理パネルにも保存され、ログインして表示およびエクスポートすることができます。