石輪っぷり!

ちょっと意味不明なサブジェクトですが、どういうことかというと、今回 Movable Type で構築している案件で次のような仕様を実装することになりました。

• 多数の加盟企業がそれぞれのユーザー名でログインしてそれぞれにお知らせを投稿する。
• 加盟企業はそれぞれに自身の紹介ページが作られる。（紹介ページを作らない企業もあり）
• 加盟企業の登録・編集は事務局が行う。（但し、事務局は Movable Type の管理者ではない）

制作を受ける際はできると考えていて、いざ構築を始めるとつまずくことがあるもので、今回の場合、Movable Type のユーザーにカスタムフィールドで企業情報を入力するフィールドを作って企業をユーザーとして登録し、企業の紹介ページはユーザー別アーカイブで生成っていうのが正当な方法なのでしょうが、これだと登録企業自身が情報を編集することが出来てしまいます。また、ユーザーの追加は Movable Type のシステム権限でないとできません。今回ユーザーを追加する事務局にはシステム権限を与えないので、別の方法を模索することになります。そこで、

• あらかじめ想定される数のユーザーを user001，user002，user003，・・・というユーザー名で作っておく。
• 加盟企業を登録するブログ（blog_id="2"）を作り、登録の際にタグ欄にユーザー名を入力するようにする。
• 加盟企業はそれぞれのユーザー名でログインし、お知らせのブログ（blog_id="3"）に情報を掲載する。
• お知らせを投稿したユーザー名と加盟企業のタグを関連づけ、お知らせ一覧に企業名と業種を、企業紹介ページにはその企業が投稿したお知らせを表示する。

という仕組みを考えました。しかし、テンプレートを書いていて問題が二つ発生しました。

Movable Type で住所や緯度経度を Google Maps のに変換して表示することのできる Mapper_Plugin。3年前にあるサイトを制作する際に利用したことがありますが、今回また同様の案件があり利用しました。

3年前（MT3.35）と今回（MT5.02）と構築環境に違いはあるものの考え方は同じで、通常のブログ記事アーカイブとは別に、カスタムフィールドに入力した住所情報から Mapper_Plugin で Google Maps を表示するブログ記事アーカイブを作っておき、個別アーカイブページの地図表示のリンクからこの Google Maps のアーカイブページを表示させるという方法です。

前回はサブウィンドウで Google Maps を表示させましたが、今回は写真をオーバーレイ表示する Lightbox の jQuery 版、jQuery lightbox を利用していることから、Google Maps も同じようにオーバーレイ表示したいと考え、画像だけでなく HTML もオーバーレイ表示できる ThickBox を利用することにしました。

しかし、Google Maps の場合はすんなり行かず、いくつかの Tips がありましたので、その覚え書きです。

＃blogっぷり！の中で志向の異なる技術ネタw

Movable Type で画像のサムネイルを生成する場合、元画像へのリンク付きで表示する <$mt:AssetThumbnailLink$> を使う方法と、
サムネイルの URL を表示する <$mt:AssetThumbnailURL$> を使う方法とがあります。

前者の場合、
<$mt:AssetThumbnailLink width="100"$>
とすれば、
<a href="(元画像のURL)"><img src="(生成したサムネイルのURL)" width="100" height="75" alt="" /></a>
という具合に高さ（<$mt:AssetThumbnailLink$> で高さを指定した場合は幅）を自動計算してソースに表示してくれます。

しかし、後者の場合は
<$mt:AssetThumbnailURL width="100"$>
としても、単にサムネイルの URL を表示するだけなので、
<img src="<$mt:AssetThumbnailURL width="100"$>" width="100" alt="" />
って感じで、サムネイルの幅を指定した場合は高さが、高さを指定した場合は幅がわからず、ソースに表示できません。

でも、例えばクライアント側にリサイズのスキルがない場合や、画像からパーマリンクへのリンクを貼る場合など、<$mt:AssetThumbnailURL$> を使って、元画像へのリンクを作らずに縮小した画像を表示したいという場合もあります。
このとき、img 要素は、幅（width）や高さ（height）が無くてもエラーにはなりませんが、ネット回線が遅い場合などでは、幅や高さの指定が無いと画像が表示されるまでレイアウトがずれてしまう結果となります。

そこで、<$mt:AssetThumbnailURL$> を使った場合でも、幅あるいは高さを表示できるように考えてみました。

Movable Type 5 の発売日が11月26日に決定しました。
Movable Type 5 出荷日決定のお知らせ

MT5 は「誰もが作れる、利用できる、配布できる」をテーマに、数々の改良が加えられています。

例えば、

• 複数のブログをウェブサイトとして管理
• カスタムフィールドの拡張とフォルダやカテゴリとの連動
• 更新履歴の管理
• テーマのエクスポート

など。

これに伴い、MT の価格は基本ライセンス 6万3,000円となります。

＃発売までにベータ版を試そうと思っていたのですが、時間がありません。

Movable Type の日付表記は西暦表記ですが、現在製作中のサイトでは、様々な情報の日付表記が和暦となっており、また4月から３月までの年度単位で情報が更新されることから、各日付の和暦表記と年度別アーカイブの作成を行いました。

まず、年度別アーカイブ。これは Hirotaka Ogawa さんの FiscalYearlyArchives プラグインを導入することで簡単にできます。
アーカイブパスにその年度の数字を入れる場合は、<$MTArchiveFiscalYear$> を記述します。

さて、問題は和暦表記です。何かプラグインがないかと探してみましたが、見つかりませんでした。そこで、いくつかのblogで紹介されているように、西暦から引き算して表示する方法をとりました。

何やら長ったらしいタイトルになってしまいました。(笑

Movable Type で <mt:Entries> を使ってエントリーをリストアップし、それを <ul> などのリストタグでマークアップする場合、次のように記述すればリスト件数が0のときは <ul> タグは表示されないので HTML の文法エラーになりませんね。（ <ul> の内側に <li> が一つもないと文法エラーになる。）

<mt:Entries>
<mt:EntriesHeader><ul></mt:EntriesHeader>
	<li><a href="<$mt:EntryPermaLink$>"><$mt:EntryTitle$></a></li>
<mt:EntriesFooter></ul></mt:EntriesFooter>
</mt:Entries>

これは、<mt:Entries> に category モディファイアなどを加えてフィルタリングした場合でも有効です。

しかし、更にエントリータイトルに特定の文字列があるものといった特定の条件でフィルタリングしたり、複数のカスタムフィールドの値などからフィルタリングする場合（ field:customfieldbasename モディファイアは複数指定できない）、上記の方法ではうまく行きません。

最新記事に"New"マークを付け、一定時間経過後に自動的に消えるようにする方法として、PHPを使う方法や、JavaScriptを使う方法がありますが、PHPを使う方法は当然ページをPHPファイルとして出力しなければなりませんし、JavaScriptを使う方法はJavaScriptが無効な環境では表示されません。

そこで、MTタグだけで自動的に消える"New"マークを考えてみました。
例えばエントリーから5日経過後に消す場合、エントリー日付と現在の日付（正確には再構築日）の差が5以内であれば"New!"を表示し、再構築した時点で差が5より大きくなったら消すという考え方です。

携帯サイトを作るためのあれこれ（その1）に引き続き、このエントリーでは、Movable Typeで携帯サイトを構築するためのあれこれです。

まずはPC用のテンプレートとは別に、携帯用のテンプレートを新たに作ります。
今回携帯用のページは全て"/m/"以下のディレクトリに置くこととしました。複数のブログを組み合わせてサイトを構築している場合、トップページ以外のブログのサイトURLは、例えばこのサイトの会社概要の場合"http://www.will3in.jp/company/"となり、"/m/"は同じレベルの別のディレクトリとなります。この場合、インデックステンプレートの出力ファイル名、あるいはアーカイブテンプレートのアーカイブパスを、"../m/company/xxx"のように相対パスで指定します。

また、各ページへのリンクは"<$mt:EntryPermaLink$>"や"<$mt:ArchiveLink$>"などを使用するとPC用ページに飛んでいってしまいますので、

<a href="/m<$mt:BlogRelativeUrl$><$mt:CategoryBasename$>/<$mt:EntryDate format="%Y/%j-%H%M">.html">

のような書き方をします。

続いて、Movable Typeで携帯サイトを構築する際に、今回使用したプラグイン。

今回、このサイトの携帯版のページを作成し、携帯電話からの閲覧にも対応させました。（iモード等の専用サイトではなく、いわゆる勝手サイトです。）

これまでも何度か携帯サイトを作った経験はありますが、キャリアによって仕様が様々で分かり難く、単にHTMLやXHTMLだけを使い、配置や色を変えるために非推奨とされるタグや属性を使って制作していました。

でも今回は、新着リストなどの背景に色を付けたかったということもあり（テーブルを使って背景色を付けることもできますが）、きちんとXHTMLとCSSを使って制作しました。

また、Movable Type で携帯サイトを作るために導入したプラグインなどもありますので、それらについての覚え書きです。

このサイトに利用している Movable Type 4 で、時々テンプレートのいくつかが何日か前の状態に戻ってしまっていることがあるのです。
先日から携帯用テンプレートを構築していて、今日ふとPCページを見ると何かおかしい。以前変更したはずの部分が元に戻っています。さらに確認してみると、コメントプレビューや検索結果などのシステムテンプレートが随分前の状態に戻っていて、ページを表示するとエラーとなっていました。

このサイトでは5つのブログがあり（MTでの管理上のブログの数ではなく、いわゆるブログ）、各テンプレートにファイルへのリンクを設定して同期しているのですが、どうもこのファイルへのリンクを設定しているテンプレートだけが元に戻ってしまうようです。

複数のブログで共通のファイルへリンク設定しているのが原因か（各ブログのテンプレート、リンクしているファイルとも書き替わっている筈なので、そんなことは考えられないのですが）、それともサーバーの何らかが原因か、何とも不可解な現象です。
リンク設定を解除すればよいのかもしれませんが、それではメンテナンス効率が大幅にダウンします。バックアップの目的もあるファイルへのリンクですが、更にこのファイルのバックアップも取っておかなければならないのか？

それにしても今回はかなりのテンプレートが過去の状態になっており、復旧に1時間以上も費やしています。まだいくつか直さなければなりません。はぁ。。。