# お問い合わせフォームフィールド ### お問い合わせフォームフィールド要素について 概要: [Shopifyお問い合わせフォームフィールド](https://help.pagefly.io/manual/shopify-elements-contact-form-field/)要素は、[お問い合わせフォーム](https://help.pagefly.io/pagefly-shopify-elements-contact-form/)を簡単にカスタマイズできるように設計されています。この要素を使用すると、以下のような複数の入力オプションでフィールドをカスタマイズできます。 * メールアドレス * ドロップダウン * 日付 * 時刻 使いやすいインターフェースにより、フォームのさまざまな側面を効率的に変更して、ユーザーエクスペリエンスを向上させ、必要な情報を効果的に収集できます。 {% hint style="info" %} **注**: * お問い合わせフォームフィールド要素は、お問い合わせフォームの外に配置することはできません。お問い合わせフォームフィールド要素を追加する前に、お問い合わせフォーム要素をレイアウトにドラッグしていることを確認してください。 * 各お問い合わせフォームは、適切に機能するために少なくとも1つのメールアドレスが必要です。 {% endhint %} 以下のビデオチュートリアルで詳細を確認できます。 {% embed url="" %} ### お問い合わせフォームフィールド要素へのアクセス方法 以下の手順でお問い合わせフォームフィールド要素機能に簡単にアクセスできます。 * ステップ1: 左側のメニューにある2番目のアイコン、つまり**Element** Catalogをクリックし、Shopifyタブに切り替えます。 * ステップ2: ドロップダウンメニューにある**Contact Form Field**要素をクリックします。 * ステップ3: 要素をページエディタにドラッグアンドドロップして使用を開始します。要素は**Contact Form**要素の中に配置する必要があることに注意してください。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-8c412ac26ca69c1db5ec54f4d6c1601294bd1ddf%2FAD_4nXfgL1gTLKdACbfEGShojwmi03G0MulVzqWE49bDK7YmNB48WFVgZqvfCIPHYllcs0FeSUl2FSKOl__WX5WtVq2xn-f9sdPKQSxQ-lUoK9QddL2uX3e2c0QFuLXGSVXH6nRRYOefpJTcFdwTR2-vWlJXmnjG?alt=media) **Contact Form Field**には、**Email**、**Single Line Text**、**Multiple Lines Text**、**Single Choice**、**Checkbox**、**Dropdown**、**Number**、**Date**、**Time**要素が含まれています。 ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXcSCsweH4e6V_VZetDhmePCG6hSUUgpOC-sNuZqkmCHWVVvc5gPvsO60g6NNcAfUTcAm_EmaJ9X5GpPOtOaTCPUMxl27SBeRy2OkKIs0wYCRuUVln3wM2Dq6uYMq0oBBSVV9Kg0_Ry0lFdDPk_keyV3HByjk4gsW_fR4i6tt4DQ.png) ### お問い合わせフォームフィールド要素の設定方法 この要素には、コンテンツの表示を細かく調整して可能な限り最高のコンバージョン率を達成するための多数のパラメータが付属しています。お問い合わせフォームフィールドのすべての要素は同様のパラメータを持っています。 ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXdxUctDk1Gq9eC1F0XJMjNkGhrGzwXh58_9ntBFwchGUVTpLP8WZ8penAfN6dzxCR_Qf3zOjyi9XE2LreOOYlzDCDektm05z3ppERRZ0GWXxhWEB-ez7WUdeTYuo8sQCU4XpENTzYzNTLs8IzOkeyV3HByjk4gsW_fR4i6tt4DQ.png) #### 一般設定 \| Show label: ラベルの表示/非表示。 | ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXckRmVZt8hD_SogmCinbhZzrSjR-wdkgDOHMgg9NW9GfLv_gBh6FAtwJ_-vndWgu6d2__iFf0yyN-0Hc5rgNfYhTMLx6X8Zwo1KGks61QJU-TBdt8cZYM53LyKwukYAWSmKSg9v2SX9Bw4TdP5EgkeyV3HByjk4gsW_fR4i6tt4DQ.gif) | ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-99930efdc6bb95a9370f3d064e7c1be289ae74a4%2FAD_4nXckRmVZt8hD_SogmCinbhZzrSjR-wdkgDOHMgg9NW9GfLv_gBh6FAtwJ_-vndWgu6d2__iFf0yyN-0Hc5rgNfYhTMLx6X8Zwo1KGks61QJU--TBdt8cZYM53LyKwukYAWSmKSg9v2SX9Bw4TdP5Eg?alt=media) | | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | Label position: 入力ボックスに対するラベルの位置。 | ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-ccdd9f463e840dc296e5d646acc3fe006f899d3e%2FAD_4nXcptlN3d-OBac3-7h3-COeypOUmIRH8LDayrWIR00dzsMiXKBWrylNBA5mB4m4A6nMBGsp8NgzbLV-5zQMdsmjjmIHTcHUPtYi801OVFatU3wXehcCdBnxDaGpUBFc_RPq2H7GeHHXWUi9yif8GYAkeyV3HByjk4gsW_fR4i6tt4DQ.gif?alt=media) |\ \| Make field required: アスタリスク記号を追加して、このフィールドを必須フィールドにする | ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-bd344d268c2fb4b69a1512b1af66c43332f69249%2FAD_4nXeT5C5EfMGI7PWlwzCNhxmSYl_FevPJd-gZzqgRIlkQ8bbEcVZMcynxEJRwIH278sHJLeOcqEYH7_wZTaI-y6Igtou2UOMl44_OlgmQATuz8aTUBrguxgC-82mxY3cnaqp41KTg5_md738VZorxxQkeyV3HByjk4gsW_fR4i6tt4DQ.png?alt=media) | VISIBILITY、ATTRIBUTES、ANIMATIONパラメータの詳細については、[こちら](https://help.pagefly.io/manual/elements-general-settings/)をご覧ください。 #### スタイル設定 お問い合わせフォームフィールド要素のスタイル設定は、要素のスタイル設定と同様です。[スタイリングタブ](https://help.pagefly.io/manual/elements-style-settings/)で詳細を確認できます。 ### お問い合わせフォームフィールドサブ要素の設定方法 お問い合わせフォームフィールド要素には、お問い合わせフォームフィールドとラベルの2つのサブ要素があります。 サブ要素をクリックすると、各サブ要素のすべての設定パラメータが表示されます。 #### お問い合わせフォームフィールドサブ要素の設定 「一般」タブでは、お問い合わせフォームフィールドの各タイプによって設定が異なります。 ただし、すべてのタイプに、タイプを切り替えるための「**Input type**」オプションがあります。利用可能なオプションには、Email、Single line text、Multiple line text、Single choice、Checkbox、Dropdown、Number、Date、Timeがあります。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-93f33d50c89d00972d3ea0cef01657f480b7b2a3%2FAD_4nXdLAcNmH-qJGl9ED1HzdEjNHVpvaue8xyAA6evJaqaDXGY3UJeH-Tju9sENR7pNUO_eRNUxjoHJ1LUOi1F2VaCOrmwQM1XiAlXn_44F-IDLnPpYvCRs92D0jVjozXYW-FpsqTqFjkNKwBms0HIl5QkeyV3HByjk4gsW_fR4i6tt4DQ.png?alt=media) \| Email | Placeholder text: フィールドが空の場合に表示されるテキスト。 \| ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-e57318747593b2e704d99b0785a6849aa75a1882%2FAD_4nXfvcYvd6WR86sD_ttff9NGwJxjxlnxpeNg9sgTW9i4KVHJgOG8ViS8yfXNTDHX8XQrcCBdveZ4pRUzpajE1QVNoda3tSFZNbceGmFoTk_VCRye52Io6R52X1Fk3nGnjQaaT4M2TFESiO74GjC1KkeyV3HByjk4gsW_fR4i6tt4DQ.png?alt=media) |\ \| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------- |\ \| Single line text | Placeholder text: フィールドが空の場合に表示されるテキスト。 | ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-58efbb50b6728bd66e0f0983e7b4647653c9ae95%2FAD_4nXfHKq_aOSPAzum6ExPthJ1yBTgblfH_bHYluRCA5-xa1KNj76CJCuIgllqi3zS6ShT6nPLyDXjKqw0Z6BC2OWFI5c0A36ty1KoaiK2cKMUTzJ558_1B_g6tNV1PZAfkMdCPlKOcHPzu5J6rRbepkeyV3HByjk4gsW_fR4i6tt4DQ.png?alt=media) |\ \| Multiple line text | Placeholder text: フィールドが空の場合に表示されるテキスト。 Line number: フィールドが収容できる行数。1行から20行まで選択できます。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-46d2453f1922cf3e90ff048ce970ed5543087db0%2FAD_4nXfMce7ZPYOIl1yAiapGegDEjdRWuRt_4R3v9H0JTWhsMRd_pg23rku691YU9k7VGnd9zNcHtwyMHW4bmSk5s6c4mh9gkrnCrVtGVk0l4AuOH7EotzNWZKOhpQ1J24IriSC5PIdsuqMKlTK8nJ5cMAkeyV3HByjk4gsW_fR4i6tt4DQ.png?alt=media) |\ \| Single choice | Single choice options: お客様はここで提供するリストから1つのオプションのみを選択できます。「Enter」キーを押してオプションを区切ります。オプションの名前を変更、追加、または削除できます。 ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXfGTg2QRHKzZLjUilqxnkiHH-e3jb3AmarKs8osTBx_7sK5A5_ADfvU3y64PtL3yn4wMDzFBfLaHqMf3FiUJJlvGy5vAhA6Fg4U5aHB4NzmYcJLv3v_Tv_caQTTyXQaDHtlPzi0m8OXaZyyrTz6QkeyV3HByjk4gsW_fR4i6tt4DQ.gif) |\ \| Checkbox | Checkbox label: チェックボックスの名前。ここではラベルに対して1つの値しか追加できないことに注意してください。オプションをさらに追加したい場合は、お問い合わせフォームフィールド要素を追加してください。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-721059a24909263ebef2c07bd654d4e3684805e7%2FAD_4nXciq8d-NWJm_RaTEd74NWHVXodyakc4a05d4WYBhFOOQCfydvYgA6XnPL65kbgZTuM_61fgA6aiw8QaMZ0yjjoj4TO8FJPcbefG2gnvdir3kuxn8srikubgrw24RiHODSw-FcDmSou6YOSvJuIT3gkeyV3HByjk4gsW_fR4i6tt4DQ.png?alt=media) |\ \| Dropdown | Dropdown options: ドロップダウンメニューのすべてのオプションをリストします。各オプションは「Enter」キーを押して区切ります。 |\ | ![](https://github.com/sellersmith/pagefly-help-center/blob/master/ja/images/AD_4nXeZ1CiWkURs0oG6YPGowBvy-vU7L_I1vt_hAw00VPzfFrPTNzX0FMc1q9W5VlNzmZbua7aXztAKG1zCRD6v2N2gr-Omyb4p71cwUIluAEZs_Q7D-mcHryfieRdbxGBbFNktGcXqugCUnfLEqCe-ugkeyV3HByjk4gsW_fR4i6tt4DQ.png) ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-f2e7632be88b55b59b95d7e783a13008c9bd8135%2FAD_4nXeZ1CiWkURs0oG6YPGowBvy-vU7L_I1vt_hAw00VPzfFrPTNzX0FMc1q9W5VlNzmZbua7aXztAKG1zCRD6v2N2gr-Omyb4p71cwUIluAEZs_Q7D-mcHryfieRdbxGBbFNktGcXqugCUnfLEqCe-ug?alt=media) |\ \| Number | Default number: フィールドが空白の場合にプレースホルダーに表示される番号。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-9aeb71a1955cb0050897d92da63cc604ebeb79b7%2FAD_4nXfdc-jBYVmLT2_dmil-XqhkP2YbLt_9nl9l83P-Iqp6CZGHgMzk6ZdjtgZPLaHNE046c9v4yAYRgJR0GK3caKTzKdzjUrYjgjpBvqGV1oR4DiGcGiBIQKOcPvzdaqxEL5bTF71b3HRz6PbaaQCZIAkeyV3HByjk4gsW_fR4i6tt4DQ.png?alt=media) |\ \| Date | Default date: フィールドが空白の場合にプレースホルダーに表示される日付。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-1710efda07de0def6cadfc2d69e7c6c9d89315e5%2FAD_4nXeIWzQRZqhSj7f-rNSXCgq80T4lkNN5lGb71J7uNBb6lOewG6In_4IQtBQyTlUc3dFGM4s2sx2m0VvhRs7A9O5kax2d9HZVp8VEPn5xQIHH8kVq0TdycGl41hDwSavLf9-NLPH5s3eh3oat-cG95AkeyV3HByjk4gsW_fR4i6tt4DQ.png?alt=media) |\ \| Time | Default time: フィールドが空白の場合にプレースホルダーに表示される時刻。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-d16f2082465685b4fb397ec1e69650d0e44c2dcc%2FAD_4nXeOVgM0mq33DudZZxbXGNXQgTh4rGJyNA6BgdGjzT5zsWcx3zmaF9rNHOOcn3sPgH9aQ3v89EbDj1hSN-_UMLe3b9Sy6JzAZJ4cBOEkO1tKWgejO3KMnK3HbYjjRv3ANZtvLiJIAKZWJXHNi5xkdQkeyV3HByjk4gsW_fR4i6tt4DQ.png?alt=media) | お問い合わせフォームフィールドサブ要素のスタイル設定は、要素のスタイル設定と同様です。 #### ラベルサブ要素の設定 「一般」タブには、ラベルサブ要素の設定はラベルテキストのみです。表示したいラベルの名前をこのプレースホルダーに入力してください。 ![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-4bcb980b975dddcd0960db17cbaa056f6e3c24d0%2FAD_4nXfZd2R_NMoylkSJ7Qqhl50lrtaIdZ86LsuAvAaLQf1-J5RF6c1tD0uIuHKHytw13X0bHWUhT-t5gbkoGMjYftOFvHwRjFRIx2ch74qDDrK3lK8oKSGv973hZ0qWgBz82SZgL0QStxY4jViXJdC6ygkeyV3HByjk4gsW_fR4i6tt4DQ.png?alt=media) ラベルサブ要素のスタイル設定は、要素のスタイル設定と同様です。要素のスタイル設定の詳細については、[こちら](https://help.pagefly.io/manual/elements-style-settings/)をお読みください。 ### 一般的なケース * ユーザーの問い合わせに対応するために必要な必須情報のみを収集することに焦点を当てる。これには、名前、メールアドレス、電話番号（任意）、メッセージフィールドが含まれます。 * 各フォームフィールドには、どのような情報が必要かを正確に表す明確で簡潔なラベルを使用する。 * 最も重要なフィールド（例：名前、メールアドレス）を先頭に配置するなど、お問い合わせフォームフィールドを論理的に整理して、入力を促す。 ### よくある質問 1\. お問い合わせフォームフィールドには何が含まれていますか？ Email、Single Line Text、Multiple Lines Text、Single Choice、Checkbox、Dropdown、Number、Date、Timeフィールドが含まれています。 2\. フィールド入力には何が含まれていますか？ Email、Single Line Text、Multiple Line Text、Single Choice、Checkbox、Dropdown、Number、Date、Timeオプションが含まれています。 ### 追加リソース * [Shopifyお問い合わせフォーム要素の使い方](https://help.pagefly.io/manual/shopify-elements-contact-form/) * [POWRフォームビルダー要素を使用した高度なお問い合わせフォームの作成](https://help.pagefly.io/manual/powr-form-builder-element/)