MovableTypeの最近のブログ記事

Camera Camera BLOGさんの記事を参考にFlickrから記事を投稿できるようにしてみました。

This is a test post from , a fancy photo sharing thing.

movable typeのバージョンアップをしました。

ぽんたの肉球、にぎにぎしたーい！さんの改造を追加しました。詳細な改造方法はリンクをたどってください。とても丁寧にわかりやすく説明してくださっています。（僕もみならわねば）
追加したパッチはfloatingImage-3.171b.tgz
です。MTディレクトリ上で展開してください。下記のファイルが上書きされます。

./tmpl/cms/upload_complete.tmpl
./lib/MT/App/CMS.pm
./images/html-br.gif
./mt.js
./tmpl/cms/edit_entry.tmpl

いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん
いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん
いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん
いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん
いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん
いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん
いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん
いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん
いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん
いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん
いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん
いろはにほへと　ちりぬるを　わかよたれそ　　つねならむ　うゐのおくやま　けふこえて　あさきゆめみし　ゑひもせすん



色は匂へど　散りぬるを　我が世誰そ　常ならむ　有為の奥山　今日越えて　浅き夢見じ　酔ひもせず
色は匂へど　散りぬるを　我が世誰そ　常ならむ　有為の奥山　今日越えて　浅き夢見じ　酔ひもせず
色は匂へど　散りぬるを　我が世誰そ　常ならむ　有為の奥山　今日越えて　浅き夢見じ　酔ひもせず
色は匂へど　散りぬるを　我が世誰そ　常ならむ　有為の奥山　今日越えて　浅き夢見じ　酔ひもせず
色は匂へど　散りぬるを　我が世誰そ　常ならむ　有為の奥山　今日越えて　浅き夢見じ　酔ひもせず
色は匂へど　散りぬるを　我が世誰そ　常ならむ　有為の奥山　今日越えて　浅き夢見じ　酔ひもせず
色は匂へど　散りぬるを　我が世誰そ　常ならむ　有為の奥山　今日越えて　浅き夢見じ　酔ひもせず
色は匂へど　散りぬるを　我が世誰そ　常ならむ　有為の奥山　今日越えて　浅き夢見じ　酔ひもせず
色は匂へど　散りぬるを　我が世誰そ　常ならむ　有為の奥山　今日越えて　浅き夢見じ　酔ひもせず


回り込み解除
ちなみにDeer Parkからの投稿試験もかねてました。

View image
エラーでませんように

バージョンアップしてみました。
3.171用のパッチも作ったので、MTをインストールしたディレクトリ以下でtarファイルを展開してください。下記の２ファイルが書き換えられますので、元ファイルを保存しておいてください。
tmpl/cms/upload_complete.tmpl
lib/MT/App/CMS.pm

初めて利用される方は styles-site.cssの修正もお忘れなく。

MT-3.151がリリースされたようですのでupgrade しました。
方法は以前と同じ、イメージ回り込み修正はMT-3.15用がそのまま使えました。

MT-3.15へアップグレード。手法は3.122と同じ。こんな方法とらなくてもいいけどなんとなく...

% unzip MT-3-1.122-upgrade-ja.zip
% cp -r MT MT.old
% mv MT-3.15-upgrade-ja MT
% tar zcvf ./mt.tgz ./MT
% tar zxvf mt.tgz

いつもの通り回り込みチェック。

% diff MT/tmpl/cms/upload_complete.tmpl MT.old/tmpl/cms/upload_complete.tmpl
% diff MT/lib/MT/App/CMS.pm MT.old/lib/MT/App/CMS.pm

がーん、CMS.pmがかなりかわってるのでパッチを当て直す。
幸いそれほど大きく構造はかわっていないので以前と同じ方法で簡単にあたりました。
当てた結果をここに置いておきました。

まとめ
3.11-3.122用
3.15用
です。

これらの中には、イメージ回り込みパッチが当てられた下記２ファイルがおさめられています。
./MT/lib/MT/App/CMS.pm
./MT/tmpl/cms/upload_complete.tmpl

tar を展開すると旧ファイルを上書きしますのでご注意下さい。
また、問題が起こっても責任は持てませんのでご自分のリスクでご利用下さい。

ついでに MovableType も 3.122にあげておきました。

% unzip MT-3-1.122-upgrade-ja.zip
% cp -r MT MT.old
% mv MT-3.122-upgrade-ja MT
% tar zcvf ./mt.tgz ./MT
% tar zxvf mt.tgz

イメージ回り込み対応のためファイル２つほどに手を入れているので確認

% diff MT/tmpl/cms/upload_complete.tmpl MT.old/tmpl/cms/upload_complete.tmpl
% diff MT/lib/MT/App/CMS.pm MT.old/lib/MT/App/CMS.pm

無事両方とも変更は無いようだ。
今後変更が入るようだとパッチ作る必要があるなぁ。

上にiTunesというボタンがあるけど何だぁ？

Away In A Manager from the album "Snowbound" by Fourplay

なるほど、今聞いてる曲が出てくるのね

まずはhtmlコードを挿入するにはどうすればいいのか？ecto もよくわからん。
html なら <pre> で逃げられるのだが、

<p>
<label><input type="checkbox" name="constrain" value="1" checked="checked"> <MT_TRANS phrase="Constrain proportions">
</p>

を追加する。

このコードの下に

<p> Image floating:<select name="ifloat" class="menu" >
<option value="left" selected>left
<option value="right" >right
<option value="none">none
</select>
</p>

こちらの記事を参考にしてイメージ回り込みがMT3.11でも可能になるようパッチを当ててみました。

• tmpl/cms/upload_complete.tmpl

- プルダウンメニュー部分

プルダウンメニュー部分135行付近にある、　

<p>
<label><input type="checkbox" name="constrain" value="1" checked="checked"> <MT_TRANS phrase="Constrain proportions">
</p>

の下に

<p> Image floating:<select name="ifloat" class="menu" >
<option value="left" selected>left
<option value="right" >right
<option value="none">none
</select>
</p>

を追加
- ボタンに引数追加

　145行目付近にある

<div>
<TMPL_IF NAME=IS_IMAGE>
<input type="button" onclick="doClick(this.form, 'popup=1&amp;width=<TMPL_VAR NAME=WIDTH>&amp;height=<TMPL_VAR NAME=HEIGHT>&amp;image_type=<TMPL_VAR NAME=IMAGE_TYPE>')" value="<MT_TRANS phrase="Popup Image">" />
<input type="button" onclick="doClick(this.form, 'include=1&width=<TMPL_VAR NAME=WIDTH>&height=<TMPL_VAR NAME=HEIGHT>&image_type=<TMPL_VAR NAME=IMAGE_TYPE>')" value="<MT_TRANS phrase="Embedded Image">" />
<TMPL_ELSE>
<input type="button" onclick="doClick(this.form, 'link=1')" value="<MT_TRANS phrase="Link">" />
</TMPL_IF>
</div>

を

<div>
<TMPL_IF NAME=IS_IMAGE>
<input type="button" onclick="doClick(this.form, 'imgfloat='+this.form.ifloat.value+'&popup=1&amp;width=<TMPL_VAR NAME=WIDTH>&amp;height=<TMPL_VAR NAME=HEIGHT>&amp;image_type=<TMPL_VAR NAME=IMAGE_TYPE>')" value="<MT_TRANS phrase="Popup Image">" />
<input type="button" onclick="doClick(this.form, 'imgfloat='+this.form.ifloat.value+'&include=1&width=<TMPL_VAR NAME=WIDTH>&height=<TMPL_VAR NAME=HEIGHT>&image_type=<TMPL_VAR NAME=IMAGE_TYPE>')" value="<MT_TRANS phrase="Embedded Image">" />
<TMPL_ELSE>
<input type="button" onclick="doClick(this.form, 'link=1')" value="<MT_TRANS phrase="Link">" />
</TMPL_IF>
</div>

と、doClick関数の第２引数の頭にimgfloagとthis.form.ifloat.valueを追加する diffの結果です。

- diff

136a137,142
> <p> Image floating:<select name="ifloat" class="menu" >
> <option value="left" selected>left
> <option value="right" >right
> <option value="none">none
> </select>
> </p>
145,146c151,152
< <input type="button" onclick="doClick(this.form, 'popup=1&amp;width=<TMPL_VAR NAME=WIDTH>&amp;height=<TMPL_VAR NAME=HEIGHT>&amp;image_type=<TMPL_VAR NAME=IMAGE_TYPE>')" value="<MT_TRANS phrase="Popup Image">" />
< <input type="button" onclick="doClick(this.form, 'include=1&width=<TMPL_VAR NAME=WIDTH>&height=<TMPL_VAR NAME=HEIGHT>&image_type=<TMPL_VAR NAME=IMAGE_TYPE>')" value="<MT_TRANS phrase="Embedded Image">" />
---
> <input type="button" onclick="doClick(this.form, 'imgfloat='+this.form.ifloat.value+'&popup=1&amp;width=<TMPL_VAR NAME=WIDTH>&amp;height=<TMPL_VAR NAME=HEIGHT>&amp;image_type=<TMPL_VAR NAME=IMAGE_TYPE>')" value="<MT_TRANS phrase="Popup Image">" />
> <input type="button" onclick="doClick(this.form, 'imgfloat='+this.form.ifloat.value+'&include=1&width=<TMPL_VAR NAME=WIDTH>&height=<TMPL_VAR NAME=HEIGHT>&image_type=<TMPL_VAR NAME=IMAGE_TYPE>')" value="<MT_TRANS phrase="Embedded Image">" />

• lib/MT/App/CMS.pm

　このファイルはかわってなかったです。しかし寿庵さんの変更前の記述と変更後の記述が同一なのでちょっと気をつけないと行けません。
- classを付ける

1889行あたりの下記のコードの

if ($q->param('popup')) {
require MT::Template;
if (my $tmpl = MT::Template->load({ blog_id => $blog_id,
type => 'popup_image' })) {
(my $base = $q->param('fname')) =~ s!\.[^.]*$!!;
if ($base =~ m!\.\.|\0|\|!) {
return $app->error($app->translate(

前に

my $imgclass;
if ($q->param('imgfloat') eq 'left') {
$imgclass = " class='l' ";
}elsif ($q->param('imgfloat') eq 'right') {
$imgclass = " class='r' ";
}else {
$imgclass = '';
}

を追加。

- HTMLコード追加

1931行目あたりのこのあたり

my $link = $thumb ? qq(<img src="$thumb" width="$thumb_width" height="$thumb_height" border="0" />) : "View image";
return <<HTML;
<a href="$url" onclick="window.open('$url','popup','width=$width,height=$height,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false">$link</a>
HTML
} elsif ($q->param('include')) {
(my $fname = $url) =~ s!^.*/!!;
if ($thumb) {
return <<HTML;
<a href="$url"><img alt="$fname" src="$thumb" width="$thumb_width" height="$thumb_height" /></a>
HTML
} else {
return <<HTML;

の各 img タグ内に $imgclass を追記する。

my $link = $thumb ? qq(<img $imgclass src="$thumb" width="$thumb_width" height="$thumb_height" border="0" />) : "View image";
return <<HTML;
<a href="$url" onclick="window.open('$url','popup','width=$width,height=$height,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false">$link</a>
HTML
} elsif ($q->param('include')) {
(my $fname = $url) =~ s!^.*/!!;
if ($thumb) {
return <<HTML;
<a href="$url"><img $imgclass alt="$fname" src="$thumb" width="$thumb_width" height="$thumb_height" /></a>
HTML
} else {
return <<HTML;
<img alt="$fname" $imgclass src="$url" width="$width" height="$height" />
HTML
}
} elsif ($q->param('link')) {
return <<HTML;

- diff

1889a1890,1898
> my $imgclass;
> if ($q->param('imgfloat') eq 'left') {
> $imgclass = " class='l' ";
> }elsif ($q->param('imgfloat') eq 'right') {
> $imgclass = " class='r' ";
> }else {
> $imgclass = '';
> }
>
1931c1940
< my $link = $thumb ? qq(<img src="$thumb" width="$thumb_width" height="$thumb_height" border="0" />) : "View image";
---
> my $link = $thumb ? qq(<img $imgclass src="$thumb" width="$thumb_width" height="$thumb_height" border="0" />) : "View image";
1939c1948
< <a href="$url"><img alt="$fname" src="$thumb" width="$thumb_width" height="$thumb_height" /></a>
---
> <a href="$url"><img $imgclass alt="$fname" src="$thumb" width="$thumb_width" height="$thumb_height" /></a>
1943c1952
< <img alt="$fname" src="$url" width="$width" height="$height" />
---
> <img alt="$fname" $imgclass src="$url" width="$width" height="$height" />

• スタイルシート

img.r {
float: right;
border: none;
margin-right:4px;
margin-top:4px;
vertical-align:top;
}
img.l {
float: left;
border: none;
margin-right:4px;
margin-top:4px;
vertical-align:top;
}

MovableTypeを使って個人用のweblogを始めて見ました。ライセンス条件が厳しいのでみんなに勧めるわけにはいかないですが，テスト的に使ってみましょう