futureshopの外部CSSファイルの読み込み順序と優先順位

futureshop では、全部で5種類のCSSファイルを読み込んでいます。

<link rel="stylesheet" type="text/css" href="/shop/css/r_system_preset.css"/>

<link rel="stylesheet" type="text/css" href="/shop/item/*****/design/template0*/css/system_DesignSettings.css"/>

<link rel="stylesheet" type="text/css" href="/shop/item/*****/design/template0*/css/system_SizeColorSettings.css"/>

<link rel="stylesheet" type="text/css" href="/shop/item/*****/design/template0*/css/system_LayoutSettings.css"/>

<link rel="stylesheet" type="text/css" href="/shop/item/*****/design/template0*/css/original.css"/>

※「*****」部は店舗KEYが入ります。
※「template0*」部はご利用いただくデザインによって、「template01」～「template05」で変動します。
　構築メニュー＞デザイン設定＞デザイン設定　の最上段が01、最下段が05となります。

5種類の外部CSSファイルの名前と概要

r_system_preset.css　[× 直接編集不可]

futureshopの自動生成ページの基本的なレイアウトなどを設定しているCSSファイルです。
バージョンアップにより新規のパーツやページが追加された際に、本CSSファイルにスタイルが追記されます。

※2014年6月18日以前のご契約店舗様で、旧式テンプレートを利用して構築されている場合、「system_preset.css」のファイル名で出力されます。

system_SizeColorSettings.css　[○ 管理画面から編集可]

管理画面で設定したメイン・サブカラー、文字色、サイズなどが反映されます。

構築メニュー＞デザイン設定＞デザイン設定　の編集ボタンを押下した先の「カラー／サイズ編集」にて「上級モード」を利用している場合、

「初級モードでの変更が適応されるCSS（system_SizeColorSettings.css）」欄にて直接編集が可能です。

system_DesignSettings.css　[○ 管理画面から編集可]

futureshopの自動生成ページの基本的なレイアウトなどを設定しているCSSファイルです。
バージョンアップにより新規のパーツやページが追加された際に、
付随するスタイルが「テンプレートごとに違う」(色が違う)場合は、本CSSファイルに追記されます。

構築メニュー＞デザイン設定＞デザイン設定　の編集ボタンを押下した先の「カラー／サイズ編集」にて「上級モード」を利用している場合、
「初級モードでの変更が適応されるCSS（system_SizeColorSettings.css）」欄にて直接編集が可能です。

system_LayoutSettings.css　[× 直接編集不可]

構築メニュー＞デザイン設定＞デザイン設定　の編集ボタンを押下した先の「レイアウト編集」にて設定した横幅、レイアウトなどが反映されます。
管理画面から数値の変更はできますが、直接CSS を編集することはできません。

original.css　[○ 管理画面から編集可]

構築メニュー＞デザイン設定＞デザイン設定　の編集ボタンを押下した先の「オリジナルCSS/JavaScript編集」の
「オリジナルCSSの編集」にて記述されたスタイルが出力されます。
オリジナルCSSの編集に何も記述していない場合は、白紙のCSSファイル です。