• No : 2057
  • 公開日時 : 2018/02/09 13:28
  • 更新日時 : 2020/12/29 16:10
  • 印刷

フォーム入力アシストの色の変更はできますか?

回答

コマースクリエイター未利用店舗様専用の記事です

 

お客様情報入力フォームにて、
必須項目が未記入であったり、入力内容の不備がある場合は、以下のようなエラー文言を表示します。

こちらのエラーの色のご変更は、CSSの利用で可能です。


※表示されない場合は…
 構築メニュー>入力項目設定>フォーム入力アシスト設定 にて
 「□ 」にチェックが入っているかを確認してください。


 

PC店舗用CSS

下記のCSSを
構築メニュー>デザイン設定 の現在利用中テンプレートの編集ボタンをクリックし、
「オリジナルCSS/JavaScript編集」の「 オリジナルCSSの編集」に追記してください。

※値は適宜修正してください。

必須項目のテキストボックスの背景色を変更


 

/* 必須項目のテキストボックス背景色 */
.FS2_assist_required {
background: #DAFEDD;
}
 

※色は適宜ご変更ください。

エラーメッセージの背景色と文字色を変更する


 

/* エラーメッセージ背景色と文字色 */
.FS2_assist_message {
background-color: #009933;
color: #fff;
}

/* エラーの出ているテキストボックス背景色 */
.FS2_assist_error {
background: #FFCC33;
}
 

※色は適宜ご変更ください。

 

スマートフォン店舗用CSS

 

下記のCSSを
モバイル>デザイン設定 の「デザインCSSの編集」に追記してください。
 

必須項目のテキストボックス背景色を変更

/* 必須項目のテキストボックス背景色 */
.FS2_assist_required {
background: #DAFEDD;
}

※色は適宜ご変更ください。

エラーメッセージの背景色と文字色を変更する

/* エラーメッセージ背景色と文字色 */
.FS2_assist_message {
background-color: #009933;
color: #fff;
}

/* エラーの出ているテキストボックス背景色と罫線色 */
.FS2_table input.FS2_assist_error,
.FS2_table select.FS2_assist_error,
.FS2_table textarea.FS2_assist_error,
.FS2_list input.FS2_assist_error,
.FS2_list select.FS2_assist_error,
.FS2_list textarea.FS2_assist_error,
.FS2_FixedPeriodDelivery_CycleEdit select.FS2_assist_error,
#fs2_usePoint.FS2_assist_error{
border-color: #FF0000;
background: #FFCC33;
}

※色は適宜ご変更ください。