 |
 |
前号へ
このコーナーでは、テンプレートのカスタマイズについて、実際のサンプルページを元に紹介していきます。
皆さん、こんにちは。おちゃのこネットの刑部です。
今回のデザイン道場は、先日リリースした商品の販売期間設定を適用した際、販売期間日時の文字色を変更する方法をご紹介します。
 |
|
 |
 |
デザイン管理→スタイルシートの編集から下記指定をコピーして貼り付けてください。
※貼り付け位置は、最下部にお願いします。
販売期間中、販売期間前、販売終了後、それぞれの日時で別の文字色に変更できます。
カラーコードはご自身で変更してください。
※それぞれのラベルは、管理画面設定例を参考にしてください。
また、別途商品一覧で、販売期間の日時上に線を引くことも可能です。
/* 商品一覧で販売期間上に線を引く */
この部分が、線の指定となります。
/* 販売期間中 */
.sales_period.status_available .sales_period_date {
color: #3588D1;
font-weight: 700;
}
/* 販売期間前 */
.sales_period.status_before .sales_period_date {
color: #999999;
font-weight: 400;
}
/* 販売終了後 */
.sales_period.status_after .sales_period_date {
color: #D24059;
font-weight: 400;
}
/* 商品一覧で販売期間上に線を引く */
.itemlist_box .sales_period {
border-top: 1px solid #E0DFE3;
padding-top: 8px;
margin-top: 3px;
}
なお、お問い合わせは下記ページからお願い致します。
Copyright (C) 2004-2006 OCHANOKO-NET All Rights Reserved.