はなまるスキン「Nucleus入門用Gospelスキン」

ホーム >  ダウンロード >  Nucleus入門用Gospelスキン

Nucleus入門用Gospelスキン

ちょっと前に「入門用スキン」の話しが出ていたので、入門用のスキンを作ってみました。(GospelスキンのライセンスはGPLです)

Gospelスキンデモページ


最初はお気楽にさっくり作るつもりだったのに、「はなまるスキン」に使っているプラグイン抜いたり、IDを変えたりと、以外と大変でしたが、なんとか公開出来る所までたどり着けました。


このスキンの特徴は以下の通りです。


1)カスタマイズできるCSSにしました

CSSのIDとclass名はNucleusのDefaultに準じ、一般的に使われている名称にし、CSSのコメントアウトを外すだけで、右メニューを左に配置を変える事が可能です。
CSSの構造も基本のレイアウトはbase.css。ie6用の調整用にie6.cssを準備しました。
準備したカラーバリエーション用のCSSを元にすればカスタマイズも簡単です。

2)html hederのみincludeファイルにしました

Nucleusをカスタマイズする上で、includeファイルは欠かす事ができないのですが、使いすぎると解らなくなってしまいます。
そこで、htmlのhederのみにincludeファイルを使い、理解しやすくしました。

3)バリエーションを3色準備しました

includeファイルの、head.inc内を編集することで他のカラーを使っていただけます。

  • 赤(red01.css)
  • 青(blue01.css)
  • 黄(yellow01.css)

カスタマイズする時はこの準備したCSSを使ってもらえれば割と楽にカスタマイズする事ができます。

4)とにかく運営できるCSSにしました

左右の大きな画像を配置した時の画面の乱れ、フォームの乱れ、文字サイズ、ページ詳細の記述など、いままでサイトを運営して遭遇した不具合を修正しました。


UTF  
EUC (GospelスキンのライセンスはGPLです)




「Nucleus入門用Gospelスキン」への問合せ

roi_danton(08年11月19日 00:59:49)

早速ダウンロードさせて頂き、自宅と仕事場のサイト(すみません、イントラ運用なので非公開です)に入れてみました。シンプルで良いと思います。仕事場は yellow で、自宅は NoColor です。
ul, ol のCSSが、ともに margin-left:20px か何かが必要だと思いました。アイテムで ol を指定した時、また、NP_MultopleCategories を導入した時の表示位置が左に偏ってしまいますので。
あと、アイテムのタイトルが h3 タグなのはちょっと不思議な気がしています。ソースを見れば何となく「ああ、そういうことか」と理解はできますが。

yotaka(08年11月19日 01:44:15)

詳細なコメント本当にありがとうございます。
自分自身があまりプラグインを使用していないので、こう言った感想をいただけるのは本当に助かります。

marginとpaddingを解除しているので、margin-leftは責任とって設定すべきですよね。プラグインを入れてテストさせていただきます。

あと、とっても悩んだ箇所なので、タイトルのh3に気が付いてもらったのはとっても嬉しいです。

カテゴリ一覧で表示させる際に、カテゴリ名はh2で表示させたかったので、アイテムのタイトルはh3にしたのですが、じゃ、トップページは…。

テンプレートを別に準備すればh2でいいけど、ココでテンプレートを増やすのは「入門用スキン」としては違う気がするので、h2をむりやり他にあててアイテムのタイトルをh3にした訳です。

ブログでもご紹介いただき、ありがとうございます。
http://d.hatena.ne.jp/roi_d...
今後ともよろしくお願いします。