Ploneのスキンをカスタマイズしていこうじゃないか３

のおおおおおおおおおおおおおおおおおおおおおおおおおお！！！
せっかく書いたナガーイエントリが消えちゃったよおおおおおおおおおおおおおおおおおおおおおおおおお！！！

取り乱して失礼いたしました（´ω｀）

エントリのIDに不適切な文字が使われていたため、BadRequestとなって下書きが全部消えました…

こんないじわるに負けてたまるか！くるりのばらの花をヘビーローテーションだ！←何故か眠くならない

で、ようやく本題にはいるわけですが、前回まででCSSのカスタマイズはキリがついたことにして、今回はこれをプロダクト化していきたいと思います。カスタマイズしたスキンをプロダクトにするプロダクト（ややこしい）には「DIYPloneStyle」とか「qPloneSkinDump」なんかがありますが、今回はDIYPloneStyleを使ってみたいと思います。

実際に使ってみる前にこの二つのプロダクトについて比較してみたいと思います。

DIYPloneStyle

機能はあまりないけれど、いろんなバージョンのZope/Ploneで動く予感がする。基本的にプロパティとCSSと画像のみを扱うことができる。テンプレートなんかはダメくさ？よくわからないけれどmain_templateはダメでした。テンプレートをいじらないようなスキンをつくる場合にはちゃちゃっとできて便利かな。

qPloneSkinDump

高機能だけど、動作する環境が限られそう。とりあえずZope2.9はNG。 機能が豊富で、テンプレートなんかも扱える。それからポートレットも扱えるので、例えば作成者の意図したポートレットのみを表示させるなんてこともできる（もちろん利用者の利用したいポートレットを優先することも可能）。またCSSレジストリをサポートしているので、作成時のCSSのオン・オフを組み込むことができる。例えばカスタマイズしたときにpublic.cssがオフになっていたとしたら、生成されたプロダクトをインストールすれば勝手にpublic.cssがオフになる。

と、テキトーにまとめたところでいよいよ使ってみましょう。DIYPloneStyleをダウンロード・解凍したら、Zopeインスタンスのプロダクトフォルダに入れます。まだZopeをリスタートしたりしちゃダメですよ。

で、DIYPloneStyleにはgenerator.pyというスクリプトがありますので、まずはこれを使ってスキンプロダクトの骨組みを作ります。以下のようにしてやりましょう。ここではSpreadFirefoxを真似っこしたSpreadPloneというスキンを作ることにしますので、最後のプロダクトネームのところは「SpreadPlone」としています。

python Zopeインスタンスホーム/Products/DIYPloneStyle/bin/generator.py --productname SpreadPlone

＊Windows環境の人はProductsフォルダの外側から行ってください（何故かは知らないけど…そう書いてあるんだもん…）

そうすると、なんとSpreadPloneというプロダクトフォルダができてます！

まだZopeをリスタートしたりしちゃダメですよ。

で、このフォルダの中身はどうなっているかというと、↓こんな感じになっています。

このフォルダの中にカスタマイズしたものたちを入れてやるわけです。今回の場合で言えば、いくつかの画像と、CSS、テンプレートをいじったわけですが、main_templateはダメくさなのでそれ以外のものを入れます。

画像はそのまま入れてやります。

ＣＳＳは、生成されたspreadplone.css.dtmlに記述してやります。spreadplone.css.dtmlはデフォルトでは以下のようになっていますので、真ん中のところにploneCustom.cssに記述したスタイルをぶちこんでやればいいわけです。

/*
  This file is based on the ploneCustom.css.dtml shipped with Plone.

  <dtml-with base_properties> (do not remove this)
  <dtml-call "REQUEST.set('portal_url', portal_url())"> (not this either)
*/

/* YOUR CSS RULES START HERE */



/* YOUR CSS RULES STOP HERE */

/* </dtml-with> */

/* Latest version of the documentation on pre-defined properties from Plone 
   can be found in CMFPlone/skins/plone_styles/ploneCustom.css */

今回はプロパティは全くいじりませんでしたが、プロパティを変更したときはbaseproperties.propsファイルに記述していけばいいようですね。たぶん…。

さぁ準備はできました。満を持してZopeをリスタートしてやりましょう。それでもって新しいPloneインスタンスを作って、サイト設定を見てみます。すると…

キターヾ(゜∀゜)/

こいつをインストールしてやると以下のようなメッセージが出てきます。

今回はCSSの条件付けやらプロパティやらは設定してないのでThere are no~とか出てますが、気にしない方向で。portal_skinsを確認してみると確かに見えますね↓。

ただし！これだとサイトはぐちゃぐちゃです。テンプレートは元のままだし、カスタマイズしたときにオフにしておいたpublic.css, columns.css, portlets.cssがオンになっているからです。

ですので、カスタマイズしたサイトのmain_templateをコピー＆ペーストし、portal_cssへいって、public.css以下３つのCSSをオフにしてやります。これでOK。一応…。

わからないこと：

• DIYPloneStyleはテンプレートいじれないの？
• DIYPloneStyleは既存のCSSのオン・オフはいじれないの？

DIYPloneStyleのチュートリアル訳したはずなのにわかってないのは仕様です、見逃してくださいorz…。調べるのめんどくさいな…。誰か教えてくれないかな…。むしろデヴキャンではDIYPloneStyle捨てて、qPloneSkinDumpを使いそうな勢い…。

ということで次回はqPloneSkinDumpを使ってSpreadPloneスキンプロダクトを作ってみましょう。