- 2008年8月29日 13:50
- Movable Type | Vicuna
Movable Type 4.2 の配布にあわせて mt.Vicuna を思いっきりバージョンアップしました。
追記: ライセンス部分の記述を訂正いたしました。
見通しの良くなったテンプレート構造
MT4.2 ではデフォルトテンプレートの構造が大きく変更されていて、MT4のテンプレートの冒頭に書かれていたさまざまな変数が削減されました。
MT3.x と構造が変わり、MT4ではテンプレートソースが書かれた複数のモジュールを組み立てページを構成する形へと変化しましたが、テンプレートをまたいで影響しあっているコードを見て「オエ」っとなった人も多いはず。これは、全体を理解できた上でならまだ判りやすい構造でしたが、それまで MT3x の構造に慣れていた人や、初めて見る人にとっては難解なものでした。(僕はアーカイブテンプレートを新規追加・削除した場合に、それに関わる複数のテンプレートの記述を修正しなければいのが大変だと感じました)
MT4.2のデフォルトテンプレートでは、テンプレート(特に HTML のヘッダー部分)間のやりがりほとんど無くなり、何がどこにあって何しているかの見通しが良くなりました。これなら HTML さえ分かれば、MTの変数等を深く理解してなくても編集できます。で、この変更を見て、mt.Vicuna も似たようなわかりやすい構造に書き直しました！また、今まで多くあったテンプレートモジュールも、1つ1つ見なおして、結合できるところはまとめてスッキリさせました。
もともと mt.Vicuna が出力する HTML はとてもシンプルなので、テンプレートソース内に構造的な div だけを記述することで、それらに囲われた MT タグの役割がさらに理解しやすいものになりました。
主な変更点を以下にまとめます
- テンプレート構造の改良
- テンプレートモジュールの削減
- ブログ記事リストをカテゴリーと月別で分離
- MTタグおよび HTMLの見直しと修正 (スキンに関わる部分は変更ありません)
- 各ページの概要・キーワードを適切に表示
- グローバルナビゲーションの自動抽出
- ウィジェットセットの追加
- 追加した単体ウィジェット
- About
- サインイン
- OpenID 対応の宣言
- クリエイティブ・コモンズの宣言
- 月別アーカイブのドロップダウン版
- 条件 Widget の追加
- トップページのみ出現する Widget
- カテゴリーページのみ出現する Widget
- 時系列ページのみ出現する Widget
- 個別ページのみ出現する Widget
- ウェブページのみ出現する Widget
- 追加した単体ウィジェット
- 関連記事を表示するテンプレートモジュール
- MT4.2のjsに対応したコメント周りの動作の変更
- 同日の複数記事の場合にカレンダーが対応するように変更
- 任意に Jquery を読み込み、簡単に利用できるようにした
- MIT Licence に変更 すべてのスキンにも適用。テンプレートソースコードの場合、利用するCMSのライセンスがコピーレフトである場合はCMSのライセンスに従い、そうでない場合はMITライセンスとして配布します。
- 言語ファイルの用意 -
mt.Vicuna は以下の言語に対応しています
- 日本語
- 英語
中国語 (繁体字)ごく一部のみ対応でしたので訂正しました中国語 (簡体字)
各ページの概要・キーワードを適切に表示
- トップページ
- カテゴリーページ
- 個別エントリーページ
- ウェブページ
において、それぞれ管理画面や記事作成時に入力した概要・キーワードを、head 要素内のmeta要素としてきちんと個別に反映させるようにしました。
ウェブページを例にあげると、記事作成時に概要とキーワードを記入しておくことで、以下ようなの Meta が自動挿入されます。
<meta name="description" content="Vicuna CMS で用意してあるスキンの利用方法を解説します。" /> <meta name="keywords" content="Vicuna CMS, スキン, カスタマイズ" />
カテゴリページや個別エントリーページ、トップページも同様に管理画面から記入されたものが個別に使用されます。
ウィジェットセットの追加
MT4.2 から、テンプレートセットプラグインで Widget Set を追加できるようになりました。これに伴い、MT4.2 から新たに追加された Widget を mt.Vicuna 用に書き直して利用できるようにしました。 Widget マネージャーを利用すれば、サイドバー項目の追加削除を HTML を意識することなく直感的に編集できます。
MT4.2 からは、OpenID対応の宣言や、そこから直接サインインすることのできる Widget 等も追加されているので利用してみてください。
MT4.2 には、特定のアーカイブのみ出現させることの出来る Widget グループというものが追加されています。mt.Vicuna 2.2.0 でも、それと同じ動きをする 条件付き Widget を追加しました。これを利用すると、例えば、全ページで共通して出現させる Widget とは別に、トップページのみ出現させたい Widget を追加する等、組み合わせ次第でより便利なサイドバーを作成することができます。
MT4.2 から、Widget の場所は [デザイン] タブに移動しています。
グローバルナビゲーションの自動抽出
Vicuna.jp のスキンは、ページ上部に共通メニューを表示させた場合のスタイルが用意されています。(3ping.orgでもページ上部に付いてます) これを利用するには今までヘッダーテンプレート内に指定の HTML を記述しなければなりませんでしたが、項目として追加したいウェブページに @globalNavi というタグを付けることで自動的にリンクが出現するようにしました。
また、現在表示中のページをカレント表示するようにしました。(例えば、トップページを表示しているときは、グローバルナビ内の HOME に class="current" がつきます)
もちろん、ちょっと HTML がわかる人ならば、直接テンプレートを編集して、ウェブページ以外にも好きな項目を追加することもできます。
グローバルナビゲーション利用時には、スキンフォルダ内にある5-module.cssからグローバルナビゲーション用の /module/gNavi/mod_gNavi.cssを読み込ませてください。(テンプレートセット同梱のスキンは最初から ON になっています)
関連記事の表示
個別エントリーの記事末尾に、関連するエントリーを表示するようにしました。
プラグイン無しでどうやってやるのか頭を痛めてたのですが、 WingMemo さんで紹介されているテンプレートソースの記述を、許可を得て使用させていただきました。ＴＡＥＫＯさんありがとうございます!
同様のタグがつけられた記事を表示し、存在しない場合は同じカテゴリーの記事を表示するという優れものです。
Google AJAX API を利用した JQuery の読み込み
mt.Vicuna 2.2.0 のデフォルトでは利用していませんが、フォーラムに寄せられるカスタマイズの要望の中には JQuery 等のライブラリを使って解決できることも多いので、そういった場合にできるだけユーザーの作業手順を減らすことを目的に 共通head要素テンプレートモジュール内に以下のように Google AJAX API の読み込み記述を挿入しました。
<MTIf name="jquery">
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">google.load("jquery", "1.2");</script>
<script type="text/javascript" src="<$MTLink template="user_jquery"$>"></script>
</MTIf>
このように記述しておくことで、例えば新たに JQuery を利用したアーカイブテンプレートを追加したいとなったとき、新規アーカイブテンプレートの冒頭に <$MTSetVar name="Jquery" value="1"$> と記述することで、 Google AJAX API から JQuery の本体と、mt.Vicuna に用意されている User JQuery をロードします。
- Aさん
- サイドバーをアコーディオンメニューにしたいのですが...
- 誰か
- じゃあまず、共通Head要素モジュールの冒頭に <$MTSetVar name="Jquery" value="1"$> と追加してください。
- 誰か
- User JQuery テンプレート内にこの記述をして再構築してください。
- Aさん
- できましたぁ～～！
作業ステップを少なくでき、なにより、MTの管理画面で完結できるので楽でしょう。
今後、JQuery （または他のライブリ）を利用した アセット用アーカイブテンプレートを製作予定です。
ライセンスの変更
Vicuna.jp のもとで僕が製作、配布している全てのスキンと、テンプレート本体のライセンスを MIT Licence 利用するCMSのライセンスがコピーレフトである場合はCMSのライセンスに従い、そうでない場合はMITライセンスとします。
それと、今までは配布元へのリンクをお願いしていましたが、とくにお願いしなくしました。これで、商用サイトの製作を請け負った時など、mt.Vicuna の本体やスキン (またはその一部) をより利用しやすくなったと思います。Vicuna のHTML 構造・全てのスキン・画像等を、そのまま他の製作物に使えるので、ぜひ利用してくださいね。
サブスキンの追加
バージョンアップに合わせて、サブスキンを2つ製作しました。他のスキンと同様に、複数カラムからアイキャッチの表示にも対応しているのでご利用ください。
ありがとうございます！
mt.Vicuna 2.2.0 の製作過程において、数日にわたってフォーラムでアドバイスや動作・表示確認をしてくださった 4n5 さん(www.45shiki.net)、nobuko さん(dandy.ath.cx)、oscar さん(www.zelazny.mydns.jp)、そして、僕の作業中にユーザーの質問に返答してくださった Trickster さん(kappadow.jp)、MT4.2のデフォルトテンプレートの構造の変更をお知らせしてくださった ROUTED さん、MT の情報を提供してくださる RENTA (gemanizm.main.jp)さん、そして、Movable Type に関わるスタッフの皆様、色々とお世話になっております。ありがとうございます！
より多くの方が喜んで使ってくれるテンプレートにしてゆきますので、これからもお力添えよろしくお願いいたします。 m(._・)m
- Newer: Web デザインに関するアンケート結果
- Older: ZenPhoto * Vicuna CMS
