futureshop FAQ

本サイトは、弊社サービス「futureshop」ご契約店舗様用のFAQサイトです。
お困り事やご不明点等ございましたら、お気軽にフューチャーショップサポートまでご連絡ください。

  • 電話でのお問合せ番号(平日10:00~17:00)
  • メールでのお問合せ
  • 文字サイズ変更
  • S
  • M
  • L
  • No : 2051
  • 公開日時 : 2018/02/07 13:41
  • 更新日時 : 2020/12/29 16:34
  • 印刷

項目選択肢やオプション価格を選択しなかったときのエラーメッセージを目立たせたいです。

回答

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


初期に登録されているエラーメッセージのデザインはシンプルなものになっておりますが、
以下のようにCSSを利用することにより更に目立たせることができます。

構築メニュー>デザイン設定>選択中デザインの「編集」
オリジナルCSS/JavaScript編集 内の
「オリジナルCSSの編集」に貼り付けてください。

サンプル

/* エラーメッセージを目立たせる */

.error_content{
background:#FFFF00; /* 背景色:任意の色 */
color:#FF0000; /* 文字色:任意の色 */
font-size:15px; /* フォントの大きさ:任意の数値 */
padding:10px; /* 内側の余白 */
margin:10px 0; /* 外側の余白 */
text-align:center; /* 文字揃え */
font-weight:bold; /* 太文字にする */
border:2px #FF0000 dashed; /* 枠の太さ・カラー・種類 */
}

 

 

サンプル ※画像を使用

GIFアニメーションなどの背景画像を使って目立たせる場合のサンプルです。

選択項目を全て選択/入力してください。[商品名○○○○○○○○○○○○]
/* エラーメッセージを目立たせる */

.error_content{
background:#FFFF00; /* 背景色:任意の色 */
color:#000000; /* 文字色:任意の色 */
font-size:15px; /* フォントの大きさ:任意の数値 */
padding:65px 10px 10px 10px; /* 内側の余白 */
margin:10px 0; /* 外側の余白 */
text-align:center; /* 文字揃え */
font-weight:bold; /* 太文字にする */
border:2px #FF0000 dashed; /* 枠の太さ・カラー・種類 */
background-image:url(画像ファイル名) ; /* 画像パス */
background-position:left top; /* 左の上から画像 */
background-repeat:no-repeat; /* 画像を繰り返さない */
}


サンプルでは以下の画像を使用しております。
よろしければご活用ください。

スムーズに解決できなかった場合、記事改善のため解決できなかった理由をお聞かせください。

ご意見・ご感想をお寄せください お問い合わせを入力されましてもご返信はいたしかねます

フューチャーショップサポート

「虎の巻」でお悩みが解決できない場合や、ご不明点等がございましたらお気軽にご連絡ください。

  • お電話でのお問い合わせ(平日10:00~17:00)お電話でのお問い合わせ(平日10:00~17:30)
  • メールフォームをご利用くださいお問い合わせフォーム

※弊社サービスと類似した名称の通販サイトとの問い合わせ先間違いが増えております。
 弊社では通販サイトの運営は一切行っておりません。

ページ
トップへ