2007/05/21

[技術系]   MovableTypeでミニ企業サイトをつくる試行錯誤

at 22:40JST
 
他人には
「やると便利だよ」
と勧めたり、
「やっている」
という事例もちょこちょこ見るのだけれど、実際にやろうとするとけっこうめんどくさいな。

というのは、blogツールの「MovableType」をCMSとして転用したサイトの構築のことだ。ここんところ、それでちょこちょこといろいろ見て回っては「うーん」とうなっている。たいしたことやってるわけじゃないのだが、とりあえず自分用にめも。

中小企業の公式サイト=「ミニ企業サイト」って、
a・あまりページビューが多くない
b・更新頻度は比較的低い
c・でも新着情報などは必要なときにサッと更新したい
d・予算はあまりかけたくない
e・人も張り付けられない
f・デザインリニューアルなどで外注先がころころ変わりやすい
という特性がある。

そうすると、「1からHTMLで組む」というのはcの観点でペケだし、専用のCMSや更新ツールの導入はb, dの点からオーバースペックだ。fの点から見ると、あまり特殊な環境でサイト構築することも勧められない。できる限りデファクトスタンダードにのっとったほうがいい。

そうすると、
「猫も杓子も使ってるMovableTypeをCMSとして転用しよう」
という話になるわけだ。

しかし、これはまたCMSとしてはあまりにも非力なうえ、シェアが高いわりにはローエンドユーザー向けにできていないという弱点があって、実際にやろうとすると細かいところでいろいろ解決しなきゃいけないことが多い。

とりあえず、実際に組み上げてみたサイトの外観はこんな感じになる。デザインはなんにも手を加えていない。要素だけ入ってる状態のトップページ。
20070521mtmage1.png


トップページ
├お知らせ
├企業概要
├実績
├ご連絡・アクセス
├リンク集
└ブログ

という企業にありがちな構成。「お知らせ」が新着情報にあたり、トップページにその最新の何件かがリストアップされるしくみにする。これ自体はMTの
「テンプレート」→「インデックス」→「メインページ」
のテンプレートで、
<MTEntries category="お知らせ" lastn="5"> 
<dt
class="entry-header"
>
<span
class="entry-date"
>
<$MTEntryDate format="%Y/%m/%d %X"$>
</span
class="entry-date"
>
<span
class="entry-title"
>
<a
href="<$MTEntryPermalink$>"
><$MTEntryTitle encode_html="1"$></a>
:
とすればいいだけだ。

しかしこの時点からすでに障壁が立ちふさがっていて、
・MT 3.3ではcategoryに日本語文字列は推奨されない
 (実際に使えようがどうだろうが、技術的に問題がありそうな
  ことは容易に想像がつく。保障されない限り使用しないのが無難だろう)
という問題がある。

しかたないので「お知らせ」は、
・カテゴリー名:news
・説明:お知らせ
と設定して運用することにする。テンプレート中でカテゴリー名を呼び出すときは
<$MTCategoryDescription encode_html="1"$>
を使用する。

しかししかしここでさらに問題があって、MTはカテゴリーの優先順位を指定できない。カテゴリ一覧などの表示をコントロールできないのだ。えー、まじかよ。今どきちょっとしたレンタルblogシステムでもできるのに…とブーたれててもしょうがないので、
・カテゴリー名:000news
のように先頭に数字をつけて逃げるというありがちな方法を取る。…もうこの時点で、クライアントに引き渡しても「なんだかわからない」ということになりそうな印象である。まあいいや。
 #ここらへんはちょっと改造してGUIで操作できるようにしているところが
 #あるようなので、参考にしつつ自前のパッチをあとで書いてみよう

ほかにテンプレートがらみのくふうとしては、「カテゴリー・アーカイブ」ページでの記事表示順が、
・「お知らせ」では新着順
・「お知らせ」以外では旧着順
のほうが直感的なので、
「テンプレート」→「インデックス」→「アーカイブ」
の「カテゴリー・アーカイブ」テンプレートを
<MTIfCategory name="000news"> 
<MTEntries sort_by="created_on" sort_order="descend">
:
</MTEntries>
<MTElse>
<MTEntries sort_by="created_on" sort_order="ascend">
:
</MTEntries>
</MTIfCategory>
というふうにすることか。残りは各自の美意識に従って適宜直せばよい。

次に重要なポイント。引き渡したあとに
「自分でも更新できる!」
という気持ちにするくふう。表示画面の各エントリタイトルのわきに、
「編集画面へのリンクをつけておく」
ということ。まあ、そこここでよく「Hack」(笑。とあえてつけておく)として取り上げられているので今さらだが、たとえばタイトル脇に
20070521mtmage2.png

のように「*」マークをつけておいて、クリックすると
20070521mtmage3.png

と、直接MTの編集画面に入って直せるようにしておく。各ページで共通するフッタやトップページのprefaceも、
20070521mtmage4.png

とリンクをつけておくとよい(これらはすべてモジュールテンプレートで呼び出すことにする)。具体的には、
<$MTCGIPath$>mt.cgi?__mode=view&_type=entry&id=<$MTEntryID$>&blog_id=<$MTBlogID$>

<$MTCGIPath$>mt.cgi?__mode=view&_type=template&id=テンプレートID&blog_id=<$MTBlogID$>
へのリンクを埋め込んでおくことになる。

もちろん、本番環境で誰にでもこのリンクが見えるようではカッコ悪いので、
・すべてのリンクはclass="editCaller"などとしておく
・editCallerはdisplay: none;
・JavaScriptでonLoad時にMTへのログイン状態を取得し、
 ログイン中ならdisplay:inline;に
という手間が必要だろう(まだこのスクリプトは書いてないけど別に難しくはないわな)。


次に、エントリのフィルタやエントリ編集画面へのくふう。この例題サイトでも「リンク集」ページがある。サイトの羅列になるわけだが、MT標準のテキストフィルタでは投稿文中にあるURLが自動的にホットリンクにならない。これで快適に更新し続けられるマゾの顔が見たい。というわけで、
20070521mtmage5.png

てな感じで適当に書いても、リンク集の体裁をなすようにでっち上げた私製テキストフィルターを導入する。

このあいだの

MTで改行の反映とURL自動リンクだけする
テキストフィルタープラグイン「hirosikitextfilter」 : ひろ式めもちょう
http://memo.hirosiki.jp/article/41793651.html

これね。

とはいえ、これだけでもあまり環境は改善されない。
・文字の大小は指定できない
・文字の右詰、センタリングもできない
・画像の埋め込みができない
とないないづくしだ(パンピーに「Wiki」なんて寝言をほざかないように)。

そこで、JavaScriptベースのWYSIWYGエディタコンポーネントを導入する。

FCKeditor
http://www.fckeditor.net/

を埋め込むとWordライクに記事を書けるようになる。ここまでお膳立てしてあげたら誰でも
「ふうむ…更新してやらないこともない」
という気分になるだろう。

ただFCKeditorなどのブラウザ用WYSIWYGエディタには個人的に気にくわないところがあって、

・エンターを打つと必ず勝手にパラグラフ(p)を開く
 →ふつうの人は単に強制改行したいんだよ!
  行間開けたら当惑するだろうが!(スタイルで行間殺せば、という問題ではない)

ってとこ。これをどうにかするには自分でイチからWYSIWYGエディタを書くしかないが、さすがにその体力はない。しかたないので、

・デフォルトでは標準のplainテキスト入力環境
・トグルスイッチでFCKeditorをコールする

というパッチを書くことにした。…ら、なんかあんまり関係ないところでハマったのでまだできてないけど。

あとはコンタクトページ用に
・メールフォームを埋め込む
という課題がある。これは、多くのレンタルサーバ業者は専用のフォームメーラを用意しているので、こちらを使うことをいちど検討するといいかもしれない。ただ、個人的には「MTさえ動けばどこでも使える」環境をいちどくみ上げたいので、自家製のフォームメーラプラグインを作ろうと考えている。

…ということで。

こんくらいの準備をすると、ようやく
「MTをミニ企業サイト用CMSとして使う」
ことができるようになる、と思う。あとは自分でスタイルシートを叩いていろんなデザインにするなり、あるいは本格的に(HTMLコーディングばかり能書き垂れるニセモノではなく)本職のデザイナーさんにデザインしてもらうなりお好きに。

なんかMT使っても全然ラクじゃないぞ!:)



関連しそうな過去記事:
さらに過去の記事
2009/04 (1)   2008/12 (3)   2008/11 (9)   2008/10 (10)   2008/09 (20)   2008/08 (2)   2008/07 (23)   2008/06 (16)   2008/05 (22)   2008/04 (11)   2008/03 (21)   2008/02 (20)   2008/01 (21)   2007/12 (32)   2007/11 (37)   2007/10 (46)   2007/09 (63)   2007/08 (33)   2007/07 (41)   2007/06 (81)   2007/05 (173)   2007/04 (168)   2007/03 (113)   2007/02 (123)   2007/01 (92)   2006/12 (111)   2006/11 (185)   2006/10 (20)  
×

この広告は180日以上新しい記事の投稿がないブログに表示されております。