お問い合わせフォームのカスタマイズ
ウェブサイトFlexのPremiumプラン、またはAdvancedプランをご利用の場合、
サイトの各種問い合わせフォームをカスタマイズすることができます！
※プランに関するお問い合わせやカスタマイズに関するご相談は、いい生活までご連絡ください。
※全プランで利用可能なお問い合わせフォームの設定につきましては
お問い合わせフォームのページをご覧ください。
ポイント
- 必須項目を追加できます
- チェック項目を追加できます
- 任意の入力欄を追加できます
例）物件を選んだ理由、その他希望条件など - 選んだ選択肢によって表示項目を切り替えられます
- 追加した項目も賃貸/売買クラウドOneへの反響取込時に取り込まれます
項目追加例：引越しのきっかけ、ご予算
設定手順
①「お問い合わせフォーム」の編集画面を開く
用途に合わせて既存テンプレートを複製して作成いただくことをお勧めしております。
必須項目等は本ページを参照の上、適宜変更してください。
鍵マークが表示されている既存テンプレートは編集できませんが複製は可能です。
・テンプレートを元に作成する場合(推奨)
元となるお問い合わせページをクリックし、「複製」ボタンをクリックします。
・お問い合わせフォームを一から作成する場合
「新規追加」ボタンをクリックします。
②お問い合わせフォームの作成画面を開く
タイトルを入力し、カスタマイズを行います。
カスタマイズ項目 | 説明 |
テキスト | 単一行のプレーンテキストの入力項目を表示します。 必須項目にすることができます。 |
メールアドレス | メールアドレスの入力項目を表示します。 必須項目にすることができます。 |
URL | URLの入力項目を表示します。 必須項目にすることができます。 |
電話番号 | 電話番号の入力項目を表示します。 必須項目にすることができます。 |
日付 | 日付の入力項目を表示します。 必須項目にすることができます。 |
テキストエリア | 複数行のテキストの入力項目を表示します。 必須項目にすることができます。 |
ドロップダウンメニュー | ドロップダウン（プルダウン）メニューを表示します。 必須項目にすることができます。 |
チェックボックス | チェックボックスを表示します。 必須項目にすることができます。 |
ラジオボタン | ラジオボタンを表示します。 セットした場合は必須項目になります。 |
送信ボタン | 問い合わせの送信ボタンをセットします。 |
※メールアドレス・電話番号などの既存項目は
以下のようにNameに*を付けることで入力必須にできます。
・メールアドレス[email* mail placeholder "例）your-email@example.com"]
・電話番号[tel* denwa_number placeholder "例）03-1234-5678"]
・電話番号[tel* denwa_number placeholder "例）03-1234-5678"]
・引越しのきっかけ入力例
項目名 | 説明 |
項目タイプ | 必須項目にするか選択します。 ※必須マークを表示する方法は以下をご覧ください。 |
Name属性 | 問い合わせ内容が賃貸/売買クラウドOneに取り込まれた際の項目名となります。 ※ご利用いただけないName属性があります。対象はページ下部をご覧ください。 |
オプション | ガイダンスに従い必要な項目名を入力します。 （図の例ではチェックボックスの選択肢を1行ごとに改行を入れて入力） |
個々の項目をlabel要素で囲む | チェックを入れてください。 |
ID属性 | HTML、CSSを活用する場合にご利用いただく項目です。 |
クラス属性 | HTML、CSSを活用する場合にご利用いただく項目です。 |
1.<p class="es-form-item name"></p>で全体を挟む
2.項目名を記載し、<label class="es-form-label name"></label>で挟むと太字になる
3.<span class="required">必須</span>と手順2の中に入れると必須項目のラベルが表示される
・ご予算入力例
項目名 | 説明 |
項目タイプ | 必須項目にするか選択します。 |
Name属性 | 問い合わせ内容が賃貸/売買クラウドOneに取り込まれた際の項目名となります。 ※ご利用いただけないName属性があります。対象はページ下部をご覧ください。 |
デフォルト値 | 入力欄に表示される例文を入力できます。 |
ID属性 | HTML、CSSを活用する場合にご利用いただく項目です。 |
クラス属性 | HTML、CSSを活用する場合にご利用いただく項目です。 |
1.<p class="es-form-item name"></p>で全体を挟む
2.項目名を記載し、<label class="es-form-label name"></label>で挟むと太字になる
※反響取込名の変換設定について
カスタム項目に対し、反響メール通知や『賃貸/売買クラウドOne』等に表示する項目名を設定できます。
和名を設定できるので取込時に内容が確認しやすくなります。
フォームタグ設定の「反響取込名」で入力した内容も自動で追加されます。
※エンドユーザーの選択した項目によって、その後に表示される入力項目を分岐させる設定も可能です。
詳細は条件付きフィールドを設定するをご覧ください。
③「お問い合わせ種別」を選択し、保存
用途に合わせて種別を選択してください。
※「お問い合わせ種別」の表示は必須です。
※種別によって必須の記述が異なります。
お問い合わせ種別 | 用途 | 必須の記述 ①フォームでエンドユーザーが入力する必要のある項目です。 カスタマイズ可能ですが項目の記述は必須です。 ②エンドユーザーには表示されません。 下記の表記通りに記述してください。 |
単独配置用 | 広告詳細、建物詳細以外からの問い合わせ | ①tsuikyaku_shubetsu_code,jimbutsu_name 記述例) <p class="es-form-item tsuikyaku_shubetsu_code"><label class="es-form-label tsuikyaku_shubetsu_code">お問い合わせ種別<span class="required">必須</span></label>[radio tsuikyaku_shubetsu_code use_label_element "借りたい|1" "貸したい|2" "買いたい|3" "売りたい|4"]</p> <p class="es-form-item name"><label class="es-form-label name">お名前<span class="required">必須</span></label><span class="es-form-control">姓名[text* jimbutsu_name placeholder "例) 山田太郎"] フリガナ[text jimbutsu_name_kana placeholder "例) ヤマダタロウ"]</span></p> ②shop_id_1,shop_id_2 [hidden shop_id_1 class:cf7_shop_id_1] [hidden shop_id_2 class:cf7_shop_id_2] |
単独配置用 (借りたい/貸したい/買いたい/売りたい向け) | 広告詳細、建物詳細以外からの問い合わせ (エンドユーザーからの問い合わせ) | ①jimbutsu_name 記述例) <p class="es-form-item name"><label class="es-form-label name">お名前<span class="required">必須</span></label><span class="es-form-control">姓名[text* jimbutsu_name placeholder "例) 山田太郎"] フリガナ[text jimbutsu_name_kana placeholder "例) ヤマダタロウ"]</span></p> ②shop_id_1,shop_id_2 [hidden shop_id_1 class:cf7_shop_id_1] [hidden shop_id_2 class:cf7_shop_id_2] |
広告ページ配置用 | 賃貸広告、売買広告詳細の問い合わせ | ①jimbutsu_name 記述例) <p class="es-form-item name"><label class="es-form-label name">お名前<span class="required">必須</span></label><span class="es-form-control">姓名[text* jimbutsu_name placeholder "例) 山田太郎"] フリガナ[text jimbutsu_name_kana placeholder "例) ヤマダタロウ"]</span></p> ②kokoku_ids, bukken_type [hidden kokoku_ids id:cf7_kokoku_ids] [hidden bukken_type id:cf7_bukken_type] |
建物ページ配置用 | 建物詳細の問い合わせ | ①tsuikyaku_shubetsu_code,jimbutsu_name 記述例) <p class="es-form-item tsuikyaku_shubetsu_code"><label class="es-form-label tsuikyaku_shubetsu_code">お問い合わせ種別<span class="required">必須</span></label>[radio tsuikyaku_shubetsu_code use_label_element "借りたい|1" "貸したい|2" "買いたい|3" "売りたい|4"]</p> <p class="es-form-item name"><label class="es-form-label name">お名前<span class="required">必須</span></label><span class="es-form-control">姓名[text* jimbutsu_name placeholder "例) 山田太郎"] フリガナ[text jimbutsu_name_kana placeholder "例) ヤマダタロウ"]</span></p> ②building_id,shop_id_1,shop_id_2,shop_id_3 [hidden building_id id:cf7_building_id] [hidden shop_id_1 id:cf7_shop_id_1] [hidden shop_id_2 id:cf7_shop_id_2] [hidden shop_id_3 id:cf7_shop_id_3] |
④-1 単独配置用を選択した場合
「ページ」から任意のページの編集画面を開き、
お問い合わせフォームブロックを選択すると
右側にお問い合わせフォーム用の項目が表示されるので、
作成したフォームとお問い合わせ先店舗を選択し公開してください。
※必要に応じて他の項目も設定してください。
④-2 広告ページ配置用を選択した場合
1.「共通レイアウト」から既存のページを選択、または新規追加を選びます。
2.「パターン」から広告詳細の種別を選択し、挿入します。
※もともと入っていた広告詳細用のブロックは削除してください。
3.お問い合わせフォームのブロックを選択すると
右側に「お問い合わせフォーム」の項目が表示されるので、作成したフォームを選択します。
※必要に応じて他の項目も設定してください。
※広告詳細をサイト設定にて割り当て済みの場合は、以上でお問い合わせフォームが切り替わります。
切り替わらない場合は次へ進んでください。
4.共通レイアウトをサイトに割り当てていない場合は、
設定＞画面紐付け設定にて割り当て設定をおこなうことで
広告詳細のレイアウトとお問い合わせフォームが切り替わります。
④-3 建物ページ配置用を選択した場合
1.「共通レイアウト」から建物詳細の編集画面を開き、
お問い合わせフォームブロックを選択すると
右側に「お問い合わせフォーム」の項目が表示されるので、作成したフォームを選択し、
お問い合わせ先店舗や利用するとお問い合わせ種別を選択します。
※必要に応じて他の項目も設定してください。
※建物詳細をサイト設定にて割り当て済みの場合は、以上でお問い合わせフォームが切り替わります。
切り替わらない場合は次へ進んでください。
2.共通レイアウトをサイトに割り当てていない場合は、
設定＞サイト設定にて割り当て設定をおこなうことで
広告詳細のレイアウトとお問い合わせフォームが切り替わります。
※サンキューページの設定
エンドユーザーがお問い合わせフォームの送信ボタンを押した後に表示されるサンキューページを
お問い合わせフォームごとに設定することができます。
詳細はサンキューページをご覧ください。
※使用できないName属性
全問い合わせ種別で共通して使用できないName属性、および各問い合わせ種別ごとに使用できないName属性を、それぞれ表にまとめています。
下記以外にも特定の単語を含むName属性名はセキュリティ上（SQLインジェクション対策のため※）ご利用頂くことができません。
例えば以下のような単語が一例となりますが、該当するName属性名が存在するとフォーム送信が完了しない事象が発生します。
独自のName属性を設定される場合は必ずログアウトしてフォーム送信が成功することをご確認ください。
・select
・update
・insert ..... など
※ SQLインジェクション対策について
問い合わせフォームに悪意のある内容を入力し、サイトに保存されているデータを改竄したり盗み取ろうとする攻撃を防ぐため、Flexではフォームの送信時に監視する仕組みが存在します。
【全問い合わせ種別共通で利用できないName属性】
shop_id_1 | bukken_heyasu | tochi_menseki_3 | kibo_jusho_city_2 | fax_number |
shop_id_2 | bukken_shubetsu | shunko_date_3 | kibo_jusho_city_3 | yubin_number |
shop_id_3 | building_id | tochi_menseki_4 | kibo_jusho_town_1 | jusho_text |
bukken_type | bukken_name_1 | madori_heyasu_5 | kibo_jusho_town_2 | nokori_jusho |
kokoku_ids | madori_heyasu_1 | madori_code_5 | kibo_jusho_town_3 | gaiku_goto |
prefecture | madori_code_1 | kenchiku_menseki_5 | hankyo_domain | kimmusaki_gyoshu |
city | kenchiku_menseki_1 | tochi_menseki_5 | hankyo_kikkake | kimmusaki_name |
town | shunko_date_1 | shunko_date_5 | hankyo_time | kinzoku_nensu |
chome | bukken_name_2 | banchi | jimbutsu_name | nenshu |
bukken_yubin_number | kenchiku_menseki_2 | bukken_banchi | jimbutsu_name_kana | kibo_renraku_hoho |
bukken_prefecture | tochi_menseki_2 | nokori_jusho | jimbutsu_shubetsu | kuruma_shoyu_daisu |
bukken_city | shunko_date_2 | kibo_jusho_pref_1 | tanjo_date | nyukyo_yotei_ninzu |
bukken_town | madori_heyasu_3 | kibo_jusho_pref_2 | seibetsu | jiko_shikin_amount |
bukken_chome | madori_code_3 | kibo_jusho_pref_3 | mail | website_comment |
bukken_nokori_jusho | kenchiku_menseki_3 | kibo_jusho_city_1 | denwa_number |
【各問い合わせ種別ごとで利用できないName属性】
※横にスクロールしてご確認ください。
※横にスクロールしてご確認ください。
単独配置用 共通 | 単独配置用 借りたい人向け | 単独配置用 貸したい人向け | 単独配置用 買いたい人向け | 単独配置用 売りたい人向け | 広告ページ配置用 共通 | 建物ページ配置用 共通 |
shop_id | shop_id | bukken_shubetsu | bukken_shubetsu | shop_id | kokoku_id | tsuikyaku_shubetsu_code |
tsuikyaku_shubetsu_code | bukken_chinryou_low | yosan_amount_from | yosan_amount_from | satei_bukken_shubetsu_code | shop_id | |
bukken_chinryou_high | yosan_amount_to | yosan_amount_to | bukken_name | building_page_url | ||
bukken_kodate_kibou_chinryo_low | madori | madori | bukken_yubin_number | |||
bukken_kodate_kibou_chinryo_high | senyu_menseki_from | senyu_menseki_from | bukken_jusho_text | |||
bukken_property_kind | senyu_menseki_to | senyu_menseki_to | bukken_nokori_jusho | |||
bukken_mansion_name | shunko_nengetsu_code | shunko_nengetsu_code | shunko_date | |||
bukken_mansion_room_number | yotei_jiki_comment | yotei_jiki_comment | madori_heyasu | |||
bukken_shunkonengetsu | yotei_jiki_date | yotei_jiki_date | madori_code | |||
bukken_shunkonengetsu_year | yotei_jiki_shubetsu | yotei_jiki_shubetsu | senyu_menseki | |||
bukken_property_address | kibo_joken_comment | kibo_joken_comment | nobe_yuka_menseki | |||
bukken_kosuu | shop_id | shop_id | kenchiku_menseki | |||
bukken_madori | tatemono_menseki_from | tochi_menseki | ||||
bukken_kenchiku_menseki_from | tatemono_menseki_to | meigi_shubetsu_code | ||||
bukken_kenchiku_menseki_to | tochi_menseki_from | kibo_kakaku_amount | ||||
bukken_senyu_menseki_from | tochi_menseki_to | baikyaku_riyu | ||||
bukken_senyu_menseki_to | chushajo_kibo_flag | baikyaku_yotei_shubetsu_code | ||||
bukken_tochi_menseki_from | chushajo_yosan_amount_from | baikyaku_yotei_date | ||||
bukken_tochi_menseki_to | chushajo_yosan_amount_to | baikyaku_yotei_comment | ||||
bukken_other | toshi_yo_kibo_flag | shutoku_kakaku_amount | ||||
toshi_rimawari | kariire_zandaka_amount | |||||
genzai_jukyo | shutoku_jiki_date | |||||
sumikae | bukken_reform_kibo_flag | |||||
kaikae_flag | ||||||
comment | ||||||
satei_bukken_shubetsu | ||||||
madori_unit | ||||||
meigi_shubetsu | ||||||
hankyo_baikyaku_yotei_shubetsu |
Related Articles
条件付きフィールドを設定する
条件付きフィールドとは お問い合わせフォームにて条件付きフィールドの設定を行うと、 エンドユーザーの選択した項目によって、その後に表示される入力項目を分岐させることができます。 ※条件付きフィールド設定、およびお問い合わせフォームのカスタマイズは Premiumプラン・Advancedプラン限定の機能です。 プランの詳細はウェブサイトFlexのプラン一覧をご覧ください。 ※お問い合わせフォームの編集についてはお問い合わせフォームのカスタマイズも併せてご覧ください。 【利用例】 ...お問い合わせフォーム
お問い合わせフォームでできること メニュー＞お問い合わせフォームの画面でご利用いただける機能は、ウェブサイトFlexのプランによって異なります。 本ページでは、全プランで利用可能な機能についてご説明します。 Advancedプラン以上のみで利用可能なカスタマイズ機能につきましては お問い合わせフォームのカスタマイズのページをご覧ください。 機能 Standard Advanced Premium 物件・問い合わせ種別に紐付かないお問い合わせフォームの作成 ○ ○ ○ ...ウェブサイトFlexのプラン一覧
ウェブサイトFlexではLite、Standard、Advanced、Premiumの4プランをご用意しています。 本ページではプランごとにご利用いただける機能をまとめています。 ご利用いただける機能 ・Standardプラン →『賃貸/売買クラウドOne』『賃貸クラウド物件広告』のデータベースにある物件を掲載する等の通常機能をご利用いただけます。 ・Advancedプラン、Premiumプラン ...