Ploneに新しいルックスを

Stuff

 

イントロダクション

チュートリアルのイントロダクションと、Plone2.1以降を利用することで可能になる新しいアプローチ

ツールを準備

CSSベースのデザインを作成するためにいろんなツールを簡単に見てみる

実際のケースではどうするのか

フォトショップのモックアップからテーマをどのように構築するのか

適切な土台作り

CSSでスタイルを加えていく前に、テーマの土台作りをする必要がある。画像やCSSを入れていくことができる無地の骨組みを作ることにする

足場を組む

CSSを書く前にいくつかの構造的な変更とグラフィカルな要素の切り出しをする

CSSスタイルを追加する

ついにCSSスタイルを適用する時がやってきた。それぞれの段階でテーマが出来上がっていく様子を画像で説明する

ヘッダスタイル

最初のステップは、サイトのヘッダ

基本スタイル

基本的なスタイルをbodyタグに追加する

背景画像スタイル

背景画像の追加と、デザイン幅の固定

ヘッドラインとパラグラフスタイル

ヘッドラインとパラグラフにスタイルを追加する

リストスタイル

リストをインライン表示し、丸を非表示にします

ポートレットとナビゲーションスタイル

ポートレットとナビゲーションツリーに適切なスタイルを追加する

ナビゲーションの再調整

ポートレットやナビゲーションツリーの余分なマージンを取る

フッタスタイル

最後の要素、フッタにスタイルを追加する

Ploneのテーマを作るためのティップス

デザインを実現するために、そして今後のバージョンのPloneでもうまく動かすために役立つティップス