サイト管理_ユーザーCSS編集

サイト管理 ＞ ユーザーCSS編集

1.CSSを使って編集したい

デザインを自由に編集されたい場合、ユーザーCSSを使用することができます。

共通、スマートフォン、タブレット、ＰＣ、ケータイ別に記述エリアを用意しております。

【共通エリア】は全デバイス共通、【スマホ・タブレット・ＰＣ】はそれぞれのデバイスごとに適用させるCSSを記述します。

共通設定 > 基本設定で設定したブレイクポイントが、適用されます。

ケータイの場合は共通のCSSは読み込まれません。auの一部の機種では4KB以内までしか読み込まれないものがあります。docomoの古い機種ではCSSが読み込まれません。

【保存】を押下して設定完了です。

2.ログイン時のみに特定のCSSを適用させる方法

2.1.管理画面で変更できない文言を調整する

CSSを調整して、お客様が会員ログインした際にページのレイアウトを変更する設定の紹介です。

1.「ユーザーCSS編集」を選択する。

管理画面上部の「サイト管理」を開き、左メニューから「ユーザーCSS編集」を選択します。

2.コードを追記します。

セレクタに[data-member-login=”true”]を付与します。

例えば、顧客がログインしている時のみ「#sysAll」の背景色（background-color）を黒（#000）にしたい場合は以下の様なコードになります。

表.ログインしている時のみ背景色を黒にする記入例

body[data-member-login="true"] #sysAll{
background-color:#000!important;
}

3.注意事項

・ユーザーCSS編集への入力・保存については必ず、バックアップをご用意した上でお客様にて実施していただきますようお願いいたします。

・また、CSSの編集については弊社による動作保証をいたしかねます。

編集後の動作の確認・検証につきましてもお客様にて行っていただきますよう、よろしくお願いします。