左エリア(商品一覧、特集、ショッピングカート等)、右エリア(新商品、おすすめ商品、人気ランキング、メルマガ、携帯URL、私が店長です)タイトル部分の文字色や文字サイズを変更したい。

2008-05-09 17:38
文字色、文字サイズの変更には、スタイルシートの編集が必要です。
管理画面の以下のページを開きます。

「デザイン管理」＞「スタイルシート編集」

（1）スタイルシート編集画面が表示されますので、【ベーステンプレートを読み込む】でご利用のテンプレートを選択し【読み込む】ボタンをクリックして下さい。

（2）ご利用のテンプレートのスタイルシートが表示されます。【テンプレート名】を記入して【スタイルシート】を編集します。

（3）各箇所の背景画像、背景色の編集をします。

【この色の部分】のみを変更してください。その他の部分（****と記載している指定）は、各テンプレートのスタイルシートごとに指定に違いがあるか指定がない場合もあります。ここではサンプルとして記載しているだけですので、****のように編集しないで下さい。

●共通設定
基本的には、左右エリアのタイトル部分は、下記の箇所にて一括で設定できます。
※テンプレートにより、個別に設定している箇所がございますので、その際には、下記の個別に設定する場合をご覧下さい。

h3 {
color: 【こちらの数値を任意のカラーコードに変更します】;
font-size: 【こちらの数値を任意のサイズに変更します】;
padding: ****;
margin: ****;
}

例）color: #FFFFFF;
font-size: 14px;


▼個別に設定する場合個別設定に関しては、スタイルシート内に下記の記載がないテンプレートがございますので、スタイルシート内に下記の指定をコピーして貼り付けて下さい。※貼り付け位置は、最下部にお願い致します。

●カテゴリ一覧

.category_title h3 {
color: 【こちらの数値を任意のカラーコードに変更します】;
font-size: 【こちらの数値を任意のサイズに変更します】;
}

例）color: #FFFFFF;
font-size: 14px;

●特集

.pickup_category_title h3 {
color: 【こちらの数値を任意のカラーコードに変更します】;
font-size: 【こちらの数値を任意のサイズに変更します】;
}

例）color: #FFFFFF;
font-size: 14px;

●ショッピングカート
※ログインとは共通です

.shopc_title h3 {
color: 【こちらの数値を任意のカラーコードに変更します】;
font-size: 【こちらの数値を任意のサイズに変更します】;
}

例）color: #FFFFFF;
font-size: 14px;

●ログインのみ変更する場合
※親要素に、.memberを指定して下さい。下記の記載は、初期の段階では、スタイルシート内にはございませんので、コピーして貼り付けて下さい。

.member .shopc_title h3 {
color: 【こちらの数値を任意のカラーコードに変更します】;
font-size: 【こちらの数値を任意のサイズに変更します】;
}

例）color: #FFFFFF;
font-size: 14px;

●新商品、おすすめ商品、人気ランキング商品(※右エリアに配置した場合)
※携帯サイトアドレスとは共通

.style3_top h3 {
color: 【こちらの数値を任意のカラーコードに変更します】;
font-size: 【こちらの数値を任意のサイズに変更します】;
}

例）color: #FFFFFF;
font-size: 14px;

●メールマガジン
※携帯サイトアドレスとは共通

.melmaga_top h3 {
color: 【こちらの数値を任意のカラーコードに変更します】;
font-size: 【こちらの数値を任意のサイズに変更します】;
}

例）color: #FFFFFF;
font-size: 14px;

●携帯サイトアドレスのみ変更する場合※親要素に、.mobilerを指定して下さい。下記の記載は、初期の段階では、スタイルシート内にはございませんので、コピーして貼り付けて下さい。

.mobile .melmaga_top h3 {
color: 【こちらの数値を任意のカラーコードに変更します】;
font-size: 【こちらの数値を任意のサイズに変更します】;
}

例）color: #FFFFFF;
font-size: 14px;

●店長プロフィール

.tdiary_top h3 {
color: 【こちらの数値を任意のカラーコードに変更します】;
font-size: 【こちらの数値を任意のサイズに変更します】;
}

例）color: #FFFFFF;
font-size: 14px;


※colorの記載が、スタイルシート内にない場合は、color: 【こちらの数値を任意のカラーコードに変更します】;の行をコピーしてスタイルシート内に貼り付けて下さい。

※font-sizeの記載が、スタイルシート内にない場合は、font-size: 【こちらの数値を任意のサイズに変更します】;の行をコピーしてスタイルシート内に貼り付けて下さい。

※個別設定する場合の記載は、基本的には、初期の段階では記載がございません。(※一部テンプレートを除く)ご利用いただく場合は、上記記載内容をコピーしスタイルシート内に貼り付けて下さい。

※スタイルシート内にコピーし内容を貼り付ける際は、基本的には、最下部に貼り付けて下さい。


（4）編集後、【登録処理を完了する】ボタンをクリックして下さい。

（5）管理画面の「デザイン管理」＞「テンプレート選択」を開き、【カスタム】にある、先程のテンプレートを選択して【設定処理を完了する】ボタンをクリックします。