StyleCatcherプラグインとMovable Type 3.2のテンプレート

MovableType3.2になってから、どうしてこんなにスタイルシートやメインページなどのテンプレートが複雑になったのだろうか？と考えていました。これはどうもStyleCatcherというプラグインに関係あるような気がしてきました。




MovableTypeのサイトに、MovableType3.2の新機能を紹介するようなページがあります。

Movable Typeユーザー・マニュアル: Movable Type 3.2 の新機能

テンプレートデザインの強化
標準のテンプレートのデザインについて大幅に変更し、デザイン性の高いブログサイトをより簡単に構築できるようになりました。また、米シックス・アパート社で提供しているStyleCatcherプラグインを導入することで、簡単にデザインを変更できます。

うーん、なるほど。
で、プラグインの導入の仕方は？（笑）。

わからないよーと悩んでいたら、買った本に、Style Catcherプラグインの事細かな説明がついていました。

Movable Typeブログ拡張パーツ＆デザインガイド Movable Typeブログ拡張パーツ＆デザインガイド

この本の５６ページから説明が載っています。
その通りに、Style Catcherプラグインを導入してみる事にしました。
ちなみにサーバーはさくらインターネットです。


まず、Style Catcherプラグインのページへ行きます。
http://www.sixapart.com/pronet/plugins/plugin/stylecatcher.html

DOWNLOADをクリックし、次のページで、StyleCatcher 1.01をクリックします。




Zip形式でダウンロードできますので、解凍します。

mt-static
plugins
上記の2つのフォルダと、READMEテキストファイルが入っています。
英語が読めないので、READMEは放置（笑）。

mt-staticには、pluginsというフォルダが入っています。
これをそのまま自分がMovableTypeをインストールしたフォルダのmt-staticフォルダにアップロードします。

ちょっと混乱しそうですが、解凍して出てきたpluginsとmt-staticの中のpluginsは別物ですので、注意してください。




続いて、解凍して出てきたpluginsフォルダの中身には、StyleCatcherというフォルダがあります。これをそのまま自分がMovableTypeをインストールしたフォルダのpluginsにアップロードします。





アップロードしたStyleCatcherフォルダの中にある、stylecatcher.cgiの属性を「755」にします。
最初これを忘れていて、500エラーが出たのでびびりました。




メイン・メニュー ＞ システム・メニュー ＞　プラグイン　
へと進んでみると、StyleCatcher　バージョン　1.01というプラグインが入っています。
「設定を表示」をクリックします。

すると、「設定：STYLECATCＨER」という画面が開きます。

Theme Root URL:　/mt/mt-static/themes
Theme Root Path:　/home/example/www/example/mt/mt-static/themes

上記のように書き換えます。
exampleは自分の設定に書き直します。
themesと、ここに書き加えるだけで、実際にはフォルダは作らなくてもいいみたいです。
themesというフォルダは勝手に作ってくれるみたいです。

変更を保存します。




続きはこちらをクリックします。
StyleCatcherの画面が開きます。

Theme or Repository URL:http://www.sixapart.com/movabletype/styles/library
となっておりまして、FindStyleをクリックすると、このURLにデザインのテーマを探しに行ってくれるみたいです。しばらく待ちます。

しばらくすると、見つかったテーマを表示してくれます。




好きなテーマを選んでクリックした後、Select a Weblog...で、テーマを適応させたいブログを選びます。
選んだら、Coose this Designをクリック！



Successfully applied new theme selection.

と表示が出れば、テーマの適応完了です。
ブログを確認すれば、ブログが新しいデザインテーマになっているはずです。




メイン・メニュー ＞ 環境設定 ＞ テンプレート と進むと、
Select a Design using StyleCatcherという項目が増えていますので、 これをクリックすると保存されたデザインテーマが確認できます。

お好みで変えて下さい。





というわけで、すごく長い道のりでしたが、StyleCatcherプラグインの導入が完了です。

このプラグインでデザインのテーマを自由に変えるために、MovableType3.2のスタイルシートや他のテンプレートは以前と比べると複雑になっているようです。

このプラグインを使うつもりは全くない！というのであれば、以前のテンプレートもたぶん使えるんではないかという気がします。確証はないですが。




逆に言えば、StyleCatcherプラグインに則したスタイルシートを作っていけば、簡単にデザインテーマの配布ができる事になります。




そのためには・・・

・スタイルシートの要素を新しく作ったりせず、デフォルトのテンプレートで表示が崩れたりしないか確認しながら、スタイルシートを作り変えていく。
・メインページやエントリーなどのHTMLを書き換える際は、デフォルトのCSSで表示が崩れないか確認しながら書き換えていく。デフォルトのスタイルシートにない要素を追加しない。

という感じの注意が必要なようです。
とりあえずStyleCatcherプラグインに対応したデザインテーマを作れるように、MovableTypeを学んでいきたいと思います。



＠ 2006年02月7日