お問い合わせフォームのカスタマイズ
ウェブサイトFlexのPremiumプラン、またはAdvancedプランをご利用の場合、
サイトの各種問い合わせフォームをカスタマイズすることができます!
※プランに関するお問い合わせやカスタマイズに関するご相談は、いい生活までご連絡ください。
※全プランで利用可能なお問い合わせフォームの設定につきましては
お問い合わせフォームのページをご覧ください。
ポイント
- 必須項目を追加できます
- チェック項目を追加できます
- 任意の入力欄を追加できます
例)物件を選んだ理由、その他希望条件など - 選んだ選択肢によって表示項目を切り替えられます
- 追加した項目も賃貸/売買クラウドOneへの反響取込時に取り込まれます
項目追加例:引越しのきっかけ、ご予算

設定手順
①「お問い合わせフォーム」の編集画面を開く
用途に合わせて既存テンプレートを複製して作成いただくことをお勧めしております。
必須項目等は本ページを参照の上、適宜変更してください。
鍵マークが表示されている既存テンプレートは編集できませんが複製は可能です。
・テンプレートを元に作成する場合(推奨)
元となるお問い合わせページをクリックし、「複製」ボタンをクリックします。

・お問い合わせフォームを一から作成する場合
「新規追加」ボタンをクリックします。

②お問い合わせフォームの作成画面を開く
タイトルを入力し、カスタマイズを行います。

| カスタマイズ項目 | 説明 |
| テキスト | 単一行のプレーンテキストの入力項目を表示します。 必須項目にすることができます。 |
| メールアドレス | メールアドレスの入力項目を表示します。 必須項目にすることができます。 |
| URL | URLの入力項目を表示します。 必須項目にすることができます。 |
| 電話番号 | 電話番号の入力項目を表示します。 必須項目にすることができます。 |
| 日付 | 日付の入力項目を表示します。 必須項目にすることができます。 |
| テキストエリア | 複数行のテキストの入力項目を表示します。 必須項目にすることができます。 |
| ドロップダウンメニュー | ドロップダウン(プルダウン)メニューを表示します。 必須項目にすることができます。 |
| チェックボックス | チェックボックスを表示します。 必須項目にすることができます。 |
| ラジオボタン | ラジオボタンを表示します。 セットした場合は必須項目になります。 |
| 送信ボタン | 問い合わせの送信ボタンをセットします。 |
以下のようにNameに*を付けることで入力必須にできます。
・メールアドレス[email* mail placeholder “例)your-email@example.com”]
・電話番号[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属性は、どの問い合わせ種別にもご利用いただけません。予めご了承ください。
| 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 | 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 |
上記以外にも特定の単語を含むName属性名はセキュリティ上(SQLインジェクション対策のため※)ご利用頂くことができません。
例えば以下のような単語が一例となりますが、該当するName属性名が存在するとフォーム送信が完了しない事象が発生します。
独自のName属性を設定される場合は必ずログアウトしてフォーム送信が成功することをご確認ください。
・select
・update
・insert ….. など
※ SQLインジェクション対策について
問い合わせフォームに悪意のある内容を入力し、サイトに保存されているデータを改竄したり盗み取ろうとする攻撃を防ぐため、Flexではフォームの送信時に監視する仕組みが存在します。
