景気が悪いせいか、あるいは企業の知識が増えてきたせいかCMSを使ってサイトを構築したいという要望が多くなってきて、MovableTypeをつかったサイト構築案件が続いています。

というわけで、躓いたところをメモしておきたいと思います。

■Template mail_preview load errorが発生！
こちらで提供されているメールフォームのプラグインをカスタマイズ中に起こった現象です。
カスタマイズしている最中にメールを確認ボタンをおすと表示されます。
ソースを見直した結果、理由はメール送信時に必ず送らなければならない情報を送っていなかったことでした。
mail_formの中にあるinputタグでtype=hiddenに指定されているid=mail_blog_idという一文をうっかり消してしまったことによって、同様の現象が起こっていたようです。
記述しなおしたところ、正常に動作しました。

■タイトルとイメージの順序を無理やり変更。
デザインを受け取ってさぁコーディングというときに、あれっ？コレってー順序ちがうよね。というものが出てきました。MTの場合、タイトルと日付などのパラメータ、それと本文という構成になりますが、画像は本文の中に入っていることになります。でもデザインでは本文は本文であるのですが、一枚だけ画像をタイトルと本文の左側に表示しなければなりませんでした。一記事に必ず画像が一枚あるということを前提に、解決策を模索。案として二つ。

・記事としてのタイトルは非表示、表示する本文の中に決まった形でタイトルなどをhtml形式を打ち込んでもらう。
・javascriptでなんとかする。

結局、実際に記事を書く人間が不特定ということを考えると、javascriptでなんとかするしかないか。ということに。

下記、実際のスクリプトです。

$(document).ready(function(){
var topics = $(“.topic”);
for(var i=0;i<topics.length;i++){
seupTopics(topics[i]);
}
});
function seupTopics(topic){
var firstimg = $(“img”,topic)[0];
var w = firstimg.width;
var h = firstimg.height;
if(w > 238){
var rate = 238 / w;
firstimg.width = 238;
firstimg.height = 238*rate;
}
var target = firstimg;
if(target.parentNode.nodeName == “A”){
target = target.parentNode;
}
if(target.parentNode.nodeName == “SPAN”){
target = target.parentNode;
}

var imgdiv = document.createElement(“div”);
topic.appendChild(imgdiv);
imgdiv.setAttribute(“class”,”imgdiv”);
imgdiv.appendChild(target);
}

途中、無理やり幅指定。画像がaタグでくくられていたらそれも、さらにspanタグでくくられてたらそれも含めて本文から消しています。
そのあと消したものをタイトル・本文を含むdivと同列に配置。それをCSSでfloatしています。
※ちなみにjQueryを読み込んでいますのであしからず。

最善解とは思えませんが、とりあえず実現できたので良しとします。