デザイン作成ウイザード

デザイン作成ウイザードは、 基本となるテンプレートを使い、 対話形式でパラメータを調整しながら好みのスタイルを作成するための機能です。

CMSメニュー image/app_kcmdf.pngアイコンを押すと、 デザイン作成ウイザードの画面が表示されます。

(1) レイアウトの選択

image/image-designwiz-01.jpg 最初の段階では、 ローカルナビの有無など、 基本のレイアウトを決定します。

を決定し「次へ」を押してください。

(2) メニューバーの設定

image/image-designwiz-02.jpg 次の段階は、 既存のメニューバーを使うか、 新しいメニューバーを定義するかを決定します。 また、 メニューバー領域に表示するロゴマークアップロードすることもできます。

入力が済んだら「次へ」を押してください。

(3) デザインテーマの選択

image/image-designwiz-03.jpg 次の段階では、 デザインを決定します。 ドロップダウンリストで基本となるテーマを選択し、 表示されたサンプルの中から色を選択します。 その他、

  • バナーエリアのタイプ
  • 見出しのタイプ
  • 本文の背景

を決定し「次へ」を押してください。

(4) 詳細・オプション設定

image/image-designwiz-04.jpg

  • 全体の、基本となる文字のサイズ、文字の色、リンクの色、hover(リンクの上にマウスが重なった場合の)色
  • バナーエリアの、文字の色、文字のサイズ
  • 見出しの、文字の色、H1(大見出し)からH5までの文字のサイズ
  • フッターエリアの、文字の色、背景の色、文字のサイズ

カラーパレットの使い方

image/image-designwiz-04_01.jpg
色を指定するテキストボックス、たとえば全体の文字色でマウスをクリックすると、右側のカラーパレットが連動し、上部のカラーボックスに現在指定されている色とカラー・コードが表示されます。
カラーボックスをクリックすると、パレットが表示されますので、変更したい色をクリックしてください。カラー・コードが自動的に入力されます。


image/image-designwiz-04_02.jpg
また、フッターエリアの背景色などに“透明”を指定したい場合には、パレットの一番左上をクリックすると、カラー・コードではなく“transparent”と入力されます。


(5) スタイルの保存

image/image-designwiz-05.jpg 以上で新しいスタイルが完成です。 スタイルに名称を付け、 保存してください。

より詳細なカスタマイズ

さらに、細かなカスタマイズを行いたい場合には、スタイル管理ページで、(5)で保存したスタイルを編集してください。

デザインウイザードで作成したスタイルは、設定に応じて、幾つかのスタイルシートをimportし、さらに定義を追加した形式になっています。 importしているスタイルシートの定義内容については、スタイル管理ページで “定義内容-import-スタイルシート名”を選択して頂ければその内容を見ることができます。

最終更新日: $Date: 2009-06-19 15:07:34+09 $

Copyright (c) 2007-2009 Graphy Inc. / Omnisci Software Inc., All Rights Reserved.