スタイルシートによるデザインの変更
ADSENSE CODE #4
Digi-Stateオリジナルの「DigiPress」(または「DigiPress Circle」※角丸+シャドウ用)テーマテンプレートは、メインのスタイルシート(style.css)に定義されたカラーテーマを選択するだけで、すぐにテンプレートのカラーデザインを変更することができます。
管理画面から、「外観」→「テーマエディタ」より、スタイルシート (style.css) を選択すし、コメントの修正を行うだけで、同一テーマ内で簡単に左右サイドバーの切り替えと、テーマカラーの変更が行えます。
サイドバーの表示位置(左右)の切り替え
スタイルシート(style.css)内の以下の箇所を見つけ、任意のサイドバーについてコメントアウトすることで、左右のサイドバーを切り替えることが出来ます。/* 左サイドバーのとき */
@import “css/design-sidebar-left.css”;
/* 右サイドバーのとき */
/* @import “css/design-sidebar-right.css”; */
上記のうち、どれか1行のみをコメントアウト(”/*” と “*/” を削除)することにより、指定したサイドバー位置での表示となります。
※上記の場合、左サイドバー/右メインコンテンツの2カラム表示が適用されている状態です。
テーマカラーの切り替え
スタイルシート(style.css)内の以下の箇所を見つけ、任意のカラーテーマーについてコメントアウトすることで、サイトのテーマカラーを切り替えることが出来ます。DigiPressテーマのとき：
/* ブラック */
/* @import “css/color-black.css”; */
/* ブラウン */
/* @import “css/color-brown.css”; */
/* ブルー */
/* @import “css/color-blue.css”; */
/* ライトブルー */
@import “css/color-lightblue.css”;
/* グリーン */
/* @import “css/color-green.css”; */
/* モスグリーン */
/* @import “css/color-mossgreen.css”; */
/* レッド */
/* @import “css/color-red.css”; */
/* オレンジ */
/* @import “css/color-orange.css”; */
/* ピンク */
/* @import “css/color-pink.css”; */
/* パープル */
/* @import “css/color-purple.css”; */
DigiPress Circleテーマ(角丸)のとき：
/* ブラック */
/* @import “css/color-circle-black.css”; */
/* ブラウン */
/* @import “css/color-circle-brown.css”; */
/* ブルー */
/* @import “css/color-circle-blue.css”; */
/* ライトブルー */
@import “css/color-circle-lightblue.css”;
/* グリーン */
/* @import “css/color-circle-green.css”; */
/* モスグリーン */
/* @import “css/color-circle-mossgreen.css”; */
/* レッド */
/* @import “css/color-circle-red.css”; */
/* オレンジ */
/* @import “css/color-circle-orange.css”; */
/* ピンク */
/* @import “css/color-circle-pink.css”; */
/* パープル */
/* @import “css/color-circle-purple.css”; */
上記のうち、どれか1行のみをコメントアウト(”/*” と “*/” を削除)することにより、指定したカラーデザインでの表示となります。
※上記の定義の場合、ライトブルーが適用されている状態です。
ADSENSE CODE #5
このエントリーに対するコメントはありません。