Nucleus でのデザインのリニューアル(4)

<2008年07月11日> by sakura tamako 0 Trackbacks
トップページの見た目はこれくらいにして、トップページ以外のページついてもやっていきます。まずは、見えない部分でhead.incの修正をしていきます。こんな感じ
こんな感じ

 

head.incというファイル名で外部においている関係上、ページによって使用するヘッダーも微妙に違うので、if()で出力するタグを判断させます。なので、オリジナルより、ヘッダーはだいぶんながくなります。ま、しかし、これをぽちぽち書くのは面倒なので、以前のホームページからヘッダー部分をコピペ。ページ固有の部分だけを新しいデレクトリ名に変更する。まあちょびっとだけから全然楽。
ページ固有の設定はできるだけ残す方向で
オリジナルページ固有の設定はできるだけ残す方向で。削除せずにコメントアウトして保存。ページを確認して影響がないことを確認。
onload="setupZoom()"の部分は以前書いたFancyZoom関係のタグ。忘れずに書く

ちょっとぼけてるけど、header.inc
そろそろサイト名も表示するように修正。
まあ、nucleusの変数で表示させるので、だいたいどのページも使うタグは一緒

トップページ以外のページを対応させる。といっても個別ページは、メインの目次ページと出力が同じなので、まるっとコピペ。
個別ページ以外は必要なタグを消さないように
個別のページとメインの目次ページ以外は、元からあるタグで必要なタグを消さないように、修正・追記する。ま、このあたりも個人の趣味でいろいろ変えてもいいと思う。

ついにでに、sidebar1.incと2のメニュー構成も整える。こちらも目次ページ、個別ページで表示したりしなかったりと処理が分かれるので、if()を使って処理を振り分け。
サイドバー1と2を修正
サイドバー2

そうそう、以前のデザインで使っていたCSSから必要なものもコピーすることを忘れずに。
leftboxとrightboxは忘れずにコピー
これはnucleusの記事入力のツールバーで使うのでコピペ。

ここまで手をいれると、だいたい綺麗に表示できる
個別ページはこんな感じ

あとはトラックバックやコメント部分の表示に手を加える
オリジナルはこんな感じでコメントを表示するみたい。
オリジナルはなかなかこってる感じ
コメントごとに交互に色を付けるのはCSSやjavascriptでなんとかなると思うけど、面倒なのでそこまでしない

トラックバックもコメントと同じCSSを利用して表示。

コメントやトラックバックが無いときはこんな感じですっきりと


個別ページ系はこんな感じで今日はおわり
糸冬 了..._〆(゚▽゚*)

ここまでくると、とりあえず今のデザインから新デザインに変更しても困らないと思うけど、たまこのページでは、ExtraSkin.jpを使ってるページもあるので、そこも修正してからデザインを変更します。

あと、一息で終わり( ´ー`)フゥー...

サイト内を検索 : nucleus

トラックバック

  1. このエントリにトラックバックはありません

コメント

まだコメントがありません

この記事へのコメントは承認してから公開されます。