小粋空間: 4.2 アーカイブ

Top ＞ Movable Type ＞バージョン別＞ 4.2 [全て開く]

2008年11月24日

アップロード画像の img 要素の alt 属性・title 属性をカスタマイズする（サムネイル画像編）

November 24,2008 2:22 AM
Tag：[alt, Customize, Image, MovableType, title]
Permalink

以前エントリーした「アップロード画像の img 要素の alt 属性・title 属性をカスタマイズする」で、サムネイル画像への対応がもれていたので、本エントリーにて補足します。

１．概要

Movable Type のデフォルト状態では、次のようにアップロード時のオプションでサムネイル表示を設定した場合、

アップロードオプション

埋め込まれる img 要素には、title 属性が表示されません。

変更前

下に示す、２項のカスタマイズを行えば、埋め込まれる img 要素に title 属性が追加され、「ファイルオプション」の「説明」フィールドの内容が反映されます。

変更後

２．「説明」フィールドの内容を title 属性に挿入する

サムネイル画像を Movable Type の記事本文などに挿入したときに、img 要素に title 属性を追加し、「説明」フィールドの内容を title 属性の内容に反映させるカスタマイズです。

このカスタマイズでは、「アップロード画像の img 要素の alt 属性・title 属性をカスタマイズする」の２項「『説明』フィールドの内容を title 属性に挿入する」のカスタマイズも同時に行っています。

「説明」フィールドの内容を title 属性に挿入するには、次の内容をパッチとして使ってください。パッチの実施方法は下記のエントリーを参考にしてください。

--- lib/MT/Asset/Image.pm.bak   Tue Aug 12 09:51:00 2008
+++ lib/MT/Asset/Image.pm       Mon Nov 24 01:54:47 2008
@@ -305,8 +305,9 @@
             my $link =
               $thumb
               ? sprintf(
-                '<img src="%s" %s alt="%s" %s />',
+                '<img src="%s" %s title="%s" alt="%s" %s />',
                 MT::Util::encode_html( $thumb->url ),   $dimensions,
+                MT::Util::encode_html( $asset->description ),
                 MT::Util::encode_html( $asset->label ), $wrap_style
               )
               : MT->translate('View image');
@@ -322,9 +323,10 @@
         else {
             if ( $param->{thumb} ) {
                 $text = sprintf(
-                    '<a href="%s"><img alt="%s" src="%s" %s %s /></a>',
+                    '<a href="%s"><img alt="%s" title="%s" src="%s" %s %s /></a>',
                     MT::Util::encode_html( $asset->url ),
                     MT::Util::encode_html( $asset->label ),
+                    MT::Util::encode_html( $asset->description ),
                     MT::Util::encode_html( $thumb->url ),
                     $dimensions,
                     $wrap_style,
@@ -332,8 +334,9 @@
             }
             else {
                 $text = sprintf(
-                    '<img alt="%s" src="%s" %s %s />',
+                    '<img alt="%s" title="%s" src="%s" %s %s />',
                     MT::Util::encode_html( $asset->label ),
+                    MT::Util::encode_html( $asset->description ),
                     MT::Util::encode_html( $asset->url ),
                     $dimensions, $wrap_style,
                 );

パッチが分からない方は、lib/MT/Asset/Image.pm をダウンロードして任意のエディタで開き、300行目あたりからの下記の部分に、青色の内容を追加してください。変更後、元のディレクトリにアップロードすれば完了です。
作業前にファイルのバックアップをとっておくと良いでしょう。

...前略...
        if ( $param->{popup} && $param->{popup_asset_id} ) {
            my $popup = MT::Asset->load( $param->{popup_asset_id} )
              || return $asset->error(
                MT->translate(
                    "Can't load image #[_1]",
                    $param->{popup_asset_id}
                )
              );
            my $link =
              $thumb
              ? sprintf(
                '<img src="%s" %s title="%s" alt="%s" %s />',
                MT::Util::encode_html( $thumb->url ),   $dimensions,
                MT::Util::encode_html( $asset->description ),
                MT::Util::encode_html( $asset->label ), $wrap_style
              )
              : MT->translate('View image');
            $text = sprintf(
q|<a href="%s" onclick="window.open('%s','popup','width=%d,height=%d,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false">%s</a>|,
                MT::Util::encode_html( $popup->url ),
                MT::Util::encode_html( $popup->url ),
                $asset->image_width,
                $asset->image_height,
                $link,
            );
        }
        else {
            if ( $param->{thumb} ) {
                $text = sprintf(
                    '<a href="%s"><img alt="%s" title="%s" src="%s" %s %s /></a>',
                    MT::Util::encode_html( $asset->url ),
                    MT::Util::encode_html( $asset->label ),
                    MT::Util::encode_html( $asset->description ),
                    MT::Util::encode_html( $thumb->url ),
                    $dimensions,
                    $wrap_style,
                );
            }
            else {
                $text = sprintf(
                    '<img alt="%s" title="%s" src="%s" %s %s />',
                    MT::Util::encode_html( $asset->label ),
                    MT::Util::encode_html( $asset->description ),
                    MT::Util::encode_html( $asset->url ),
                    $dimensions, $wrap_style,
                );
            }
        }
...後略...

Comments [0] | Trackbacks [1]

2008年9月16日

フォルダアーカイブとフォルダアーカイブ一覧を作る

September 16,2008 1:23 AM
Tag：[Customize, Folder, MovableType, Page]
Permalink

Movable Type 4.2 でフォルダアーカイブとフォルダアーカイブ一覧を作るカスタマイズを紹介します。

Movable Type 4.2 標準の機能ではフォルダアーカイブを作成することができません。将来的に機能追加されるかもしれませんが、ここではプラグインを利用して Movable Type 4.2 でフォルダアーカイブページを作成する方法を紹介します。

次のようなフォルダとウェブページの構成を想定します。

フォルダ1
　├ ウェブページ1-1
　├ ウェブページ1-2
　└ ウェブページ1-3
フォルダ2
　├ ウェブページ2-1
　├ ウェブページ2-2
　└ ウェブページ2-3

この構成であれば、フォルダアーカイブには、次のようにフォルダに属するウェブページの一覧を表示することができます。

フォルダ1のフォルダアーカイブページ
フォルダ一1のウェブページ一覧

フォルダ2のフォルダアーカイブページ
フォルダ一2のウェブページ一覧

サブフォルダがある場合も、独立したアーカイブページとして作成可能です。

フォルダアーカイブの作成に伴い、フォルダアーカイブページへのリンク（フォルダ一覧）の作成方法もあわせて説明します。

フォルダ一覧

１．フォルダアーカイブの作成

フォルダアーカイブの作成は、The blog of H.Fujimoto の藤本壱さんが作成された WriteToFile プラグインを利用します。

１．１ WriteToFile プラグインのダウンロード

下記のページより、WriteToFile プラグインをダウンロードしてください。

The blog of H.Fujimoto - テンプレートの再構築結果を部分的にファイルに出力するプラグイン

ダウンロードしたプラグインアーカイブを展開し、plusins ディレクトリにアップロードします。
プラグインの一覧で「WriteToFile」が表示されれば OK です。

プラグイン一覧

１．１フォルダアーカイブ用テンプレートの作成

フォルダアーカイブ用テンプレートはインデックステンプレートで作成します。

ブログ管理画面の「デザイン」→「テンプレート」で「インデックステンプレートを作成する」をクリック。

テンプレート一覧

表示されたテンプレート作成画面で、次の内容を設定。

テンプレートの名前: フォルダアーカイブ（何でも構いません）
テンプレートの内容: ご利用のメインページの内容をそのままコピー＆ペースト。
ファイル名: dummy.dat（このファイルはダミーなので使いません）
その他: 変更せずそのまま

１．２フォルダアーカイブ用テンプレートの修正1

フォルダアーカイブ用テンプレートの先頭と末尾に、テンプレートタグ（青色部分）を追加します。

<MTTopLevelFolders>
<MTSetVarBlock name="fname"><MTFolderPath>/index.html</MTSetVarBlock>
<MTWriteToFile file="$fname">
[１．１項でペーストしたメインページの内容]
</MTWriteToFile>
<MTSubFolderRecurse>
</MTTopLevelFolders>

１．３フォルダアーカイブ用テンプレートの修正2

テンプレート内にある MTEntries タグを MTPages タグに変更します。

配布テンプレート

変更前（赤色を削除）

...前略...
<div id="content">
<div class="blog">
 
<mt:entries>
   <mt:entryTrackbackData />
   <mt:include module="ブログ記事の概要" />
</mt:entries>
 
</div>
</div>
...後略...

変更後（青色を追加）

...前略...
<div id="content">
<div class="blog">
 
<mt:Pages>
  <mt:PagesHeader>
  <h2 class="date"><$MTFolderLabel$>のウェブページ一覧</h2>
  <div class="entry">
    <ul>
  </mt:PagesHeader>
      <li><a href="<$MTPagePermalink$>"><$MTPageTitle$></a></li>
  <mt:PagesFooter>
    </ul>
  </div>
  </mt:PagesFooter>
</mt:Pages>
 
</div>
</div>
...後略...

完成例

フォルダ一覧

既定のブログ

変更前（赤色を削除）

...前略...
<div id="alpha">
  <div id="alpha-inner">
<mt:Entries>
  <mt:Ignore><!-- Use the Entry Summary module for each entry published on this page --></mt:Ignore>
  <$mt:Include module="ブログ記事の概要"$>
</mt:Entries>
    <div class="content-nav">
      <a href="<$mt:Link template="archive_index"$>">アーカイブ</a>
    </div>
  </div>
</div>
...後略...

変更後（青色を追加）

...前略...
<div id="alpha">
  <div id="alpha-inner">
<mt:Pages>
  <mt:PagesHeader>
  <h2 class="archive-title"><$MTFolderLabel$>フォルダの一覧</h2>
  <ul>
  </mt:PagesHeader>
    <li><a href="<$MTPagePermalink$>"><$MTPageTitle$></a></li>
  <mt:PagesFooter>
  </ul>
  </mt:PagesFooter>
</mt:Pages>
    <div class="content-nav">
      <a href="<$mt:Link template="archive_index"$>">アーカイブ</a>
    </div>
  </div>
</div>
...後略...

完成例

フォルダ一覧

設定が完了したら再構築してください。
再構築でエラーが発生した場合、４項に該当していないか確認してください。

２．フォルダアーカイブ一覧の作成

下記のサブテンプレートをウィジェットで作成します。ただしフォルダアーカイブに表示させる場合はインデックステンプレートで作成して、モジュール化を行ってください（理由は３項参照）。

配布テンプレートの場合

<mt:ifArchiveTypeEnabled archive_type="Page">
  <mt:if tag="blogPageCount">
<dt class="sidetitle">フォルダ一覧</dt>
<dd class="side">
    <mt:topLevelFolders>
      <mt:folderHeader>
  <ul>
      </mt:folderHeader>
    <li><a href="<mt:blogURL /><mt:folderPath />/index.html"><mt:folderLabel /></a> [<mt:folderCount />]
      <mt:subFolderRecurse />
    </li>
      <mt:folderFooter>
  </ul>
      </mt:folderFooter>
    </mt:topLevelFolders>
</dd>
  </mt:if>
</mt:ifArchiveTypeEnabled>

完成例

フォルダ一覧

既定のブログの場合

<mt:IfArchiveTypeEnabled archive_type="Page">
<div class="widget-pages widget">
  <h3 class="widget-header">フォルダ一覧</h3>
  <div class="widget-content">
  <mt:TopLevelFolders>
    <mt:folderHeader>
    <ul>
    </mt:folderHeader>
      <li class="folder folder-<$mt:FolderID$>"><a href="<mt:blogURL /><mt:folderPath />/index.html"><mt:folderLabel /></a> [<mt:folderCount />]
    <$mt:SubFolderRecurse$>
      </li>
    <mt:folderFooter>
    </ul>
    </mt:folderFooter>
  </mt:TopLevelFolders>
  </div>
</div>
</mt:IfArchiveTypeEnabled>

完成例

フォルダ一覧

３．注意事項1

MTWriteToFile タグの中にカテゴリーリストやフォルダリストのサブテンプレートがあると、そこにある MTSubCatsRecurse や MTSubFolderRecurse タグが干渉して、サブフォルダのアーカイブが作成されないようです。

フォルダリストにカテゴリーリストやフォルダリストを含める場合はカテゴリーリストやフォルダリストをインデックステンプレートでモジュール化してください。

インデックステンプレートで作成したフォルダリストの出力ファイル名を folder.html とした場合、例えば次の方法で表示できます。PHP化する必要はありません。

<mt:BlogSitePath cat="folder.html" setvar="folder" />
<mt:include file="$folder" />

４．注意事項2

ウェブページのないフォルダがあると、フォルダアーカイブの再構築で次のようなエラーが発生します。

再構築エラー

Comments [6] | Trackbacks [1]

2008年9月 5日

MTEntriesWithSubCategories タグの不具合などについて

September 5,2008 1:23 AM
Tag：[MovableType, MTEntriesWithSubCategories]
Permalink

Movable Type 4.2/4.21 で、MTEntriesWithSubCategories タグをブログ記事リストで使用すると、下記の問題が発生します。頂いたコメントで判明致しました。

テンプレートのプレビューでエラーになる
テンプレート再構築でエラーになる（場合がある）

いずれも次のようなエラーが発生します。

再構築エラー

注：再構築でエラーになるのは、テンプレート編集画面の「保存と再構築」をクリックした場合のみ確認しています。

また、Movable Type 4.1 では親カテゴリーにブログ記事が1件も投稿されていない場合でも、小カテゴリーにブログ記事が投稿されていれば、MTEntriesWithSubCategories タグを使用することで、親カテゴリーアーカイブが出力されましたが、4.2 では親カテゴリーに1件以上のブログ記事が投稿されていないと空の親カテゴリーアーカイブが出力されるようです。

バージョン4.1 で MTEntriesWithSubCategories タグを利用されている方はご注意ください。

Comments [0] | Trackbacks [0]

2008年9月 3日

Movable Type 4.1 と 4.2 の差分（コメント入力フォーム）

September 3,2008 12:55 AM
Tag：[4.2, MovableType, Template]
Permalink

Movable Type 4.1 と 4.2 のコメント入力フォームの差分を掲載します。

Movable Type 4.2 では、インデックステンプレートの JavaScript（mt.js）の実装がほぼすべて新しくなり、それに伴い、コメント入力フォームのマークアップもかなり変更されています。

4.1 から 4.2 にアップグレードした場合、JavaScript（mt.js）やコメント入力フォームはそのままでも問題ないと思いますが、4.2 のコメント関連機能を活用するには、インデックステンプレートの JavaScript（mt.js）を初期化、つまり 4.2 の JavaScript（mt.js）を利用し、コメント入力フォームのテンプレートについては、以下に示す変更を行うと良いでしょう。

１．コメントプレビュー用データ

表示されているページがコメントプレビューであることを示すための情報を設定します。
コメントプレビューテンプレートに下記の青色のスクリプトを、mt.js が読み込まれる前に実行されるよう、挿入してください。

4.1

...前略...
<MTSetVarBlock name="html_head">
<script type="text/javascript" src="<$MTLink template="javascript"$>"></script>
</MTSetVarBlock>
...後略...

4.2

...前略...
<MTSetVarBlock name="html_head">
<script type="text/javascript">
/* <![CDATA[ */
var user = <mt:userSessionState />;
var is_preview = true;
/* ]]> */
</script>
<script type="text/javascript" src="<$MTLink template="javascript"$>"></script>
</MTSetVarBlock>
...後略...

この設定がもれていると、サインインしていないコメントでプレビューした場合、CAPTCHA フィールドがデフォルトで表示されないといった不具合が発生します。

２．メッセージ表示用エリアのマークアップ

「サインインできます」などのメッセージを表示するエリアのサブテンプレートは、4.1 で使われていた MTIfRegistrationAllowed タグがなくなり、(X)HTML の div 要素に変わりました。div 要素の id 属性値は comment-greeting としてください。

4.1

<MTIfRegistrationAllowed>
        <div id="comment-form-external-auth">
            <script type="text/javascript">
            <!--
            <MTIf name="comment_preview_template">is_preview = true;</MTIf>
            writeCommenterGreeting(commenter_name, <$MTEntryID$>, <$MTEntryBlogID$>, commenter_id, commenter_url);
            //-->
            </script>
        </div>
</MTIfRegistrationAllowed>

4.2

<div id="comment-greeting"></div>

３．form要素

onsubmit 属性値が変わりました。この変更を行わないと、コメント投稿時に「不正なエラーです」というエラーになります。

4.1

<form method="post" action="<$MTCGIPath$><$MTCommentScript$>" name="comments_form" id="comments-form" onsubmit="if (this.bakecookie.checked) rememberMe(this)">

4.2

<form method="post" action="<$mt:CGIPath$><$mt:CommentScript$>" name="comments_form" id="comments-form" onsubmit="return mtCommentOnSubmit(this)">

４．hidden属性のinput要素

4つの input 要素が追加されています。parent_id は親コメントへの返信コメントのときの親コメントIDです。armor（よろい）はスパムコメント対策用のデータです。

4.1

<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$MTEntryID$>" />
<input type="hidden" name="__lang" value="<$MTBlogLanguage$>" />

4.2

<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$mt:EntryID$>" />
<input type="hidden" name="__lang" value="<$mt:BlogLanguage$>" />
<input type="hidden" name="parent_id" value="<$mt:CommentParentID$>" id="comment-parent-id" />
<input type="hidden" name="armor" value="1" />
<input type="hidden" name="preview" value="" />
<input type="hidden" name="sid" value="" />

4.2（コメントプレビュー）

<input type="hidden" name="static" value="1" />
<input type="hidden" name="entry_id" value="<$mt:EntryID$>" />
<input type="hidden" name="__lang" value="<$mt:BlogLanguage$>" />
<mt:IfCommentParent>
    <input type="hidden" name="parent_id" value="<$mt:CommentParentID$>" id="comment-parent-id">
</mt:IfCommentParent>
<input type="hidden" name="armor" value="1" />
<input type="hidden" name="preview" value="" />

５．input要素（名前・メール・URL）

名前・メール・URLの input 要素に、CAPTCHAを表示するための onfocus 属性が追加されています。onfocus 属性値はブログ記事／ウェブページまたはコメントプレビュー画面で起動する関数が異なります。ブログ記事／ウェブページでは入力フィールドをクリックするとCAPTCHAを表示し、コメントプレビューではデフォルトで表示します。

4.1

<input id="comment-author" name="author" size="30" value="<MTIf name="comment_preview_template"><$MTCommentAuthor encode_html="1"$></MTIf>" />
...中略...
<input id="comment-email" name="email" size="30" value="<MTIf name="comment_preview_template"><$MTCommentEmail encode_html="1"$></MTIf>" />
...中略...
<input id="comment-url" name="url" size="30" value="<MTIf name="comment_preview_template"><$MTCommentURL encode_html="1"$></MTIf>" />

4.2

<input id="comment-author" name="author" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentAuthor encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />
...中略...
<input id="comment-email" name="email" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentEmail encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />
...中略...
<input id="comment-url" name="url" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentURL encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />

６．input要素（情報を保存）

onclick 属性値が変わりました。またコメントプレビューでは非表示になるため、全体をMTUnlessタグで括ります。

4.1

<div id="comment-form-remember-me">
    <label for="comment-bake-cookie"><input type="checkbox" id="comment-bake-cookie" name="bakecookie" onclick="if (!this.checked) forgetMe(document.comments_form)" value="1" />
        <__trans phrase="Remember personal info?"></label>
</div>

4.2（コメントプレビューでは表示させない制御を追加）

<mt:Unless name="comment_preview_template">
    <div id="comment-form-remember-me">
        <input type="checkbox" id="comment-bake-cookie" name="bakecookie" onclick="mtRememberMeOnClick(this)" value="1" accesskey="r" />
        <label for="comment-bake-cookie"><__trans phrase="Remember personal info?"></label>
    </div>
</mt:Unless>

７．返信表示用チェックボックス

コメント返信機能が標準装備されたので、返信用のチェックボックスが追加になりました。

4.1

なし

4.2

<div id="comments-open-data">
...中略...
</div>
<div id="comment-form-reply" style="display:none">
    <input type="checkbox" id="comment-reply" name="comment_reply" value="" onclick="mtSetCommentParentID()" />
    <label for="comment-reply" id="comment-reply-label"></label>
</div>

８．textarea要素

CAPTCHA表示用の onfocus 属性が追加されています。onfocus 属性値はブログ記事／ウェブページまたはコメントプレビュー画面によって内容が異なります。

4.1

<textarea id="comment-text" name="text" rows="15" cols="50"><MTIf name="comment_preview_template"><$MTCommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$></MTIf></textarea>

4.2

<textarea id="comment-text" name="text" rows="15" cols="50" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>"><mt:If name="comment_preview_template"><$mt:CommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$></mt:If></textarea>

９．CAPTCHA用フィールド

4.1 で使われていたテンプレートタグがなくなり、div 要素だけになりました。

4.1

<MTIfNonEmpty tag="MTCaptchaFields">
<MTIfCommentsAccepted><MTIfRegistrationAllowed><MTElse><$MTCaptchaFields$></MTIfRegistrationAllowed></MTIfCommentsAccepted>
<div id="comments-open-captcha">
</div>
</MTIfNonEmpty>

4.2

<div id="comments-open-captcha"></div>

１０．確認用フォームボタン

name 属性値が変更になり、onclick 属性が追加されました。

4.1

<input type="submit" accesskey="v" name="preview" id="comment-preview" value="<__trans phrase="Preview">" />

4.2

<input type="submit" accesskey="v" name="preview_button" id="comment-preview" value="<__trans phrase="Preview">" onclick="this.form.preview.value='1';" />

１１．投稿後、フォームボタンをdisableにするJavaScript（二重送信の防止）

コメントフォームの最後に script 要素が追加されました。

4.1

なし

4.2

<div class="comments-open" id="comments-open">
...中略...
</div>
<script type="text/javascript">
<!--
mtAttachEvent("load", mtEntryOnLoad);
mtAttachEvent("unload", mtEntryOnUnload);
//-->
</script>

１２．4.1のテンプレート構成で4.2にバージョンアップする場合のコメント入力フォームサンプル

4.2 の「既定のブログ」テンプレートセットでは、「コメント入力フォーム」テンプレートモジュールがなくなり、ブログ記事・ウェブページ用のコメント入力フォーム（「コメント」テンプレートモジュール）とコメントプレビューのコメント入力フォーム（コメントプレビューテンプレートに直接記述）が独立してしまったので、4.1 の「既定のブログ」テンプレートセットの構成に対応できるよう、

ブログ記事
ウェブページ
コメントプレビュー

のテンプレートで使える「コメント入力フォーム」テンプレートモジュールを作ってみましたので、よければお使いください。
また、不具合がありましたらご連絡ください。

<mt:IfCommentsAccepted>
<div class="comments-open" id="comments-open">
    <h2 class="comments-open-header"><__trans phrase="Leave a comment"></h2>
    <div class="comments-open-content">
        <div id="comment-greeting"></div>
        <form method="post" action="<$mt:CGIPath$><$mt:CommentScript$>" name="comments_form" id="comments-form" onsubmit="return mtCommentOnSubmit(this)">
            <input type="hidden" name="static" value="1" />
            <input type="hidden" name="entry_id" value="<$mt:EntryID$>" />
            <input type="hidden" name="__lang" value="<$mt:BlogLanguage$>" />
            <mt:IfCommentParent>
                <input type="hidden" name="parent_id" value="<$mt:CommentParentID$>" id="comment-parent-id">
            </mt:IfCommentParent>
            <input type="hidden" name="armor" value="1" />
            <input type="hidden" name="preview" value="" />
            <div id="comments-open-data">
                <div id="comment-form-name">
                    <label for="comment-author"><__trans phrase="Name"></label>
                    <input id="comment-author" name="author" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentAuthor encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />
                </div>
                <div id="comment-form-email">
                    <label for="comment-email"><__trans phrase="Email Address"></label>
                    <input id="comment-email" name="email" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentEmail encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />
                </div>
                <div id="comment-form-url">
                    <label for="comment-url"><__trans phrase="URL"></label>
                    <input id="comment-url" name="url" size="30" value="<mt:If name="comment_preview_template"><$mt:CommentURL encode_html="1"$></mt:If>" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>" />
                </div>
                <mt:Unless name="comment_preview_template">
                    <div id="comment-form-remember-me">
                        <input type="checkbox" id="comment-bake-cookie" name="bakecookie" onclick="mtRememberMeOnClick(this)" value="1" accesskey="r" />
                        <label for="comment-bake-cookie"><__trans phrase="Remember personal info?"></label>
                    </div>
                </mt:Unless>
            </div>
            <div id="comment-form-reply" style="display:none">
                <input type="checkbox" id="comment-reply" name="comment_reply" value="" onclick="mtSetCommentParentID()" />
                <label for="comment-reply" id="comment-reply-label"></label>
            </div>
            <div id="comments-open-text">
                <label for="comment-text"><__trans phrase="Comments">
                <mt:IfAllowCommentHTML><__trans phrase="(You may use HTML tags for style)"></mt:IfAllowCommentHTML></label>
                <textarea id="comment-text" name="text" rows="15" cols="50" onfocus="<mt:If name="comment_preview_template">mtShowCaptcha()<mt:Else>mtCommentFormOnFocus()</mt:If>"><mt:If name="comment_preview_template"><$mt:CommentBody autolink="0" sanitize="0" convert_breaks="0" encode_html="1"$></mt:If></textarea>
            </div>
            <div id="comments-open-captcha"></div>
            <div id="comments-open-footer">
                <input type="submit" accesskey="v" name="preview_button" id="comment-preview" value="<__trans phrase="Preview">" onclick="this.form.preview.value='1';" />
                <input type="submit" accesskey="s" name="post" id="comment-submit" value="<__trans phrase="Submit">" />
            </div>
        </form>
    </div>
</div>
<script type="text/javascript">
<!--
mtAttachEvent("load", mtEntryOnLoad);
mtAttachEvent("unload", mtEntryOnUnload);
//-->
</script>
</mt:IfCommentsAccepted>

Comments [11] | Trackbacks [1]

2008年9月 2日

Movable Type 4.2 テンプレートセット（フッタ付きリキッドレイアウト対応）

September 2,2008 1:55 AM
Tag：[4.2, MovableType, TemplateSet]
Permalink

Movable Type 4.2 用のテンプレートセット（スタイル対応版）にフッタ付きリキッドレイアウトを追加したバージョンの配布を開始します。

これまで配布していたテンプレートセットのリキッドレイアウトは、CSSレイアウトの構造上、背景つきのフッタを表示させると、フッタの表示がサイドバーに重なってしまうという欠点があったため、簡易なテキストのみをフッタとして中央カラムに表示していました。

今回、リキッドレイアウトについては、ネガティブマージンを利用したCSSレイアウトに変更したので、背景つきのフッタもサイドバーに重ならずに表示させることができると思います。

今回追加したリキッドレイアウトは以下の 3 種類です。

3カラムリキッド（左右サイドバー）

3カラムリキッド（右サイドバー）

2カラムリキッド（右サイドバー）

表示は、Windows XP + IE6/Firefox 2/Oprea 9/Safari 3 で確認しています。

なお、ネガティブマージンによるリキッドレイアウトについてはファイルサイズが大きくなると動作が重たくなる可能性があります。以前、当ブログでもこの手法を用いたレイアウトで一度デザインを変更したのですが、IE6 でファイルサイズの大きなページでは実用に耐える表示ができなかったため、一週間ほどで取りやめた経緯があります。

そういう経緯に加え、CSSを作りこむ余裕もなく、リキッドレイアウト+ネガティブマージンによるフッタ付きのCSSレイアウトについては積極的ではなかったのですが、IE7 や FireFox、Safari などのモダンブラウザが主流になり、それらでは問題なく表示できるはずですので、公開することにします。
ただし、動作の保障は致しかねますので、ご利用に関してはご自身の責任でお願い致します。

１．テンプレートセットのダウンロード

「4.2 スタイル対応版（フッタ付きリキッドレイアウト対応）」のテンプレートセットアーカイブを、下記のページからダウンロードしてください。

Movable Type テンプレート

以下、テンプレートセットの利用方法です。

２．テンプレートセットのインストール

ダウンロードしたテンプレートセットアーカイブを解凍し、中にある plugins 配下にある KoikikukanTemplateSet フォルダを Movable Type の plugins フォルダに丸ごとアップロードしてください。

また、mt-static/plugins 配下にある KoikikukanTemplateSet フォルダを Movable Type の mt-static/plugins フォルダに丸ごとアップロードしてください。

「システムメニュー」→「プラグイン」でプラグインの一覧が表示されるので、「KoikikukanTemplateSet」が表示されていればインストールOKです。

プラグインの一覧

３．テンプレートセットの入れ替え

ここではインストールされた状態で入れ替える方法を説明します。

ブログ管理画面より「デザイン」→「テンプレート」をクリック。

ブログ管理画面

右下にある「ブログのテンプレートを初期化」をクリック。

ブログのテンプレートを初期化

「新しいテンプレートセットを適用」を選択し、セレクトボックスから「小粋空間テンプレートセット」を選択。「既存のテンプレートのバックアップを作成する」をチェックすると、入れ替え前のテンプレートのバックアップがとれます。
選択後、右下の「次へ」をクリック。

新しいテンプレートセットを適用

「確認」をクリック。これでテンプレートセットの入れ替えが開始します。

テンプレートセットの入れ替え開始

「テンプレートの初期化を完了しました。」が表示されれば完了です。

テンプレートの初期化完了

サイトの再構築アイコンをクリック。

サイトの再構築

「すべてのファイル」を選択して「再構築」をクリック。

再構築

「すべてのファイルを再構築しました。」が表示されたら再構築完了です。

再構築完了

前の画面の「サイトを見る」をクリックするか、ブログ管理画面の「サイト表示」のアイコンをクリック。

サイト表示

当サイトのテンプレートセットのデザインで表示されれば完了です。デフォルトデザインのままであればブラウザをリロードしてください。

４．スタイルの切り替え

ここではカラムレイアウトを切り替える方法を説明します。

ブログ管理画面より「デザイン」→「スタイル」をクリック。

ブログ管理画面

「既定のスタイル」の左側にある + マークのアイコンをクリック（「既定のスタイル」の部分は選択状態によって異なります）。

アイコンをクリック

開いたウィンドウに小粋空間テンプレートセットをインストールしたスタティックディレクトリのテーマURLを入力。

テーマURLを入力

具体的には、次のような URL になります。

http://[user-domain]/mt-static/plugins/KoikikukanTemplateSet/themes/

赤色の部分は、MT のスタティックディレクトリ（mt-static ディレクトリがある位置）までの URL を設定してください。

正しい URL であれば、次のような画面になるので、表示されたサムネイル画像をクリック。

サムネイル画像

右側に大きな画像が表示され、その下にレイアウト選択用のセレクトボックスが表示されます。

セレクトボックス

リキッドレイアウトは次のものから選択してください。

3カラムリキッド（左右サイドバー）：layout-three-column-liquid
3カラムリキッド（右サイドバー）：layout-three-column-liquid-right
2カラムリキッド（右サイドバー）：layout-two-column-liquid-right

テンプレート

選択後、「デザインを適用」をクリック。

デザインを適用1

「テーマを適用しました。レイアウトも変更されたので、再構築する必要があります。設定を有効にするために再構築してください。」と表示されるので、ブログ全体を再構築してください。

デザインを適用2

スタイルが切り替わりました。サイドバーの内容もテンプレート編集画面で入れ替える必要はありません。

切り替え後のテンプレート

５．スタイルの編集

スタイルを変更する場合は、インデックステンプレートにある、「スタイルシート（styles-site.css）」を編集してください。

Comments [31] | Trackbacks [2]

2008年8月27日

アップロード画像の img 要素の alt 属性・title 属性をカスタマイズする

August 27,2008 1:55 AM
Tag：[alt, Customize, Image, MovableType, title]
Permalink

Movable Type 4.2 で、ブログ記事の「画像の挿入」を使ってアップロード画像を本文や追記に埋め込む場合の、img 要素のalt 属性や title 属性の出力内容をカスタマイズする方法です。

１．「説明」フィールドの内容を alt 属性に挿入する

アップロード時の「説明」フィールドの内容を alt 属性に反映させるカスタマイズです。

デフォルトの状態では、次のようにアップロード時のオプションを設定した場合、

アップロード画面

埋め込まれる img 要素の alt 属性には、このように「ファイルオプション」の「名前」フィールドの内容が反映されます。

img要素

下に示す、１項のカスタマイズを行えば、埋め込まれる img 要素の alt 属性には、このように「ファイルオプション」の「説明」フィールドの内容が反映されます。

img要素

ただし、デフォルトの動作（alt 属性に「名前」フィールドの内容を反映）は適切と思われます。
alt 属性の目的が画像の代替文字列を表示させるためのものであり、代替文字列に対応するのは「名前」フィールドが妥当です。つまり、「名前」フィールドを適切な内容に書き換えてアップロードすればいいわけです。「名前」フィールドを書き換えてもファイル名が変更される訳ではありません。

img要素

が、「説明」フィールドの内容を alt 属性値として使いたい場合は、後述するカスタマイズを行ってください。

次の内容をパッチとして使ってください。パッチの実施方法は下記のエントリーを参考にしてください。

--- lib/MT/Asset/Image.pm.bak   Wed Aug 27 00:39:40 2008
+++ lib/MT/Asset/Image.pm       Wed Aug 27 00:36:14 2008
@@ -324,7 +324,7 @@
                 $text = sprintf(
                     '<a href="%s"><img alt="%s" src="%s" %s %s /></a>',
                     MT::Util::encode_html( $asset->url ),
-                    MT::Util::encode_html( $asset->label ),
+                    MT::Util::encode_html( $asset->description ),
                     MT::Util::encode_html( $thumb->url ),
                     $dimensions,
                     $wrap_style,
@@ -333,7 +333,7 @@
             else {
                 $text = sprintf(
                     '<img alt="%s" src="%s" %s %s />',
-                    MT::Util::encode_html( $asset->label ),
+                    MT::Util::encode_html( $asset->description ),
                     MT::Util::encode_html( $asset->url ),
                     $dimensions, $wrap_style,
                 );

パッチが分からない方は、lib/MT/Asset/Image.pm をダウンロードして任意のエディタで開き、322行目あたりにある下記の赤色部分を、青色の内容に書き換えてください。変更後、元のディレクトリにアップロードすれば完了です。
作業前にファイルのバックアップをとっておくと良いでしょう。

変更前

...前略...
        else {
            if ( $param->{thumb} ) {
                $text = sprintf(
                    '<a href="%s"><img alt="%s" src="%s" %s %s /></a>',
                    MT::Util::encode_html( $asset->url ),
                    MT::Util::encode_html( $asset->label ),
                    MT::Util::encode_html( $thumb->url ),
                    $dimensions,
                    $wrap_style,
                );
            }
            else {
                $text = sprintf(
                    '<img alt="%s" src="%s" %s %s />',
                    MT::Util::encode_html( $asset->label ),
                    MT::Util::encode_html( $asset->url ),
                    $dimensions, $wrap_style,
                );
            }
...後略...

変更後

...前略...
        else {
            if ( $param->{thumb} ) {
                $text = sprintf(
                    '<a href="%s"><img alt="%s" src="%s" %s %s /></a>',
                    MT::Util::encode_html( $asset->url ),
                    MT::Util::encode_html( $asset->description ),
                    MT::Util::encode_html( $thumb->url ),
                    $dimensions,
                    $wrap_style,
                );
            }
            else {
                $text = sprintf(
                    '<img alt="%s" src="%s" %s %s />',
                    MT::Util::encode_html( $asset->description ),
                    MT::Util::encode_html( $asset->url ),
                    $dimensions, $wrap_style,
                );
            }
...後略...

２．「説明」フィールドの内容を title 属性に挿入する

画像を挿入したときに、img 要素に title 属性を追加し、「説明」フィールドの内容を title 属性の内容に反映させるカスタマイズです。

img要素

１項と同様、次の内容をパッチとして使ってください。

--- lib/MT/Asset/Image.pm.bak   Wed Aug 27 00:39:40 2008
+++ lib/MT/Asset/Image.pm       Wed Aug 27 01:17:48 2008
@@ -322,9 +322,10 @@
         else {
             if ( $param->{thumb} ) {
                 $text = sprintf(
-                    '<a href="%s"><img alt="%s" src="%s" %s %s /></a>',
+                    '<a href="%s"><img alt="%s" title="%s" src="%s" %s %s /></a>',
                     MT::Util::encode_html( $asset->url ),
                     MT::Util::encode_html( $asset->label ),
+                    MT::Util::encode_html( $asset->description ),
                     MT::Util::encode_html( $thumb->url ),
                     $dimensions,
                     $wrap_style,
@@ -332,8 +333,9 @@
             }
             else {
                 $text = sprintf(
-                    '<img alt="%s" src="%s" %s %s />',
+                    '<img alt="%s" title="%s" src="%s" %s %s />',
                     MT::Util::encode_html( $asset->label ),
+                    MT::Util::encode_html( $asset->description ),
                     MT::Util::encode_html( $asset->url ),
                     $dimensions, $wrap_style,
                 );

パッチが分からない方は、lib/MT/Asset/Image.pm をダウンロードして任意のエディタで開き、322行目あたりに、下記の青色部分の内容を追加してください。変更後、元のディレクトリにアップロードすれば完了です。
作業前にファイルのバックアップをとっておくと良いでしょう。

...前略...
        else {
            if ( $param->{thumb} ) {
                $text = sprintf(
                    '<a href="%s"><img alt="%s" title="%s" src="%s" %s %s /></a>',
                    MT::Util::encode_html( $asset->url ),
                    MT::Util::encode_html( $asset->label ),
                    MT::Util::encode_html( $asset->description ),
                    MT::Util::encode_html( $thumb->url ),
                    $dimensions,
                    $wrap_style,
                );
            }
            else {
                $text = sprintf(
                    '<img alt="%s" title="%s" src="%s" %s %s />',
                    MT::Util::encode_html( $asset->label ),
                    MT::Util::encode_html( $asset->description ),
                    MT::Util::encode_html( $asset->url ),
                    $dimensions, $wrap_style,
                );
            }
...後略...

以上です。

今回、プラグインが使えそうになかったので、久しぶりに力技のカスタマイズになってしまいました。エレガントな変更方法がありましたらご教示ください。

Comments [4] | Trackbacks [1]

2008年8月21日

【重要】MT4.1x → MT4.2 へのアップグレード注意

August 21,2008 12:00 AM
Tag：[4.2, MovableType]
Permalink

Movable Type 4.1x でカスタムフィールドを利用している場合、Movable Type 4.2 へのアップグレードは行わないでください、というニュースがシックス・アパートより公開されました。

Movable Type News - MT4.1x とカスタムフィールドをお使いの場合は MT4.2 へのアップグレードはおまちください

Movable Type 4.1x をお使いで、カスタムフィールドを利用している場合、4.2 へアップグレードは行わないでください。MT4.1x から MT4.2 にアップグレードを行う際、カスタムフィールドのデータを一部消失する可能性があるためです。

アップグレード禁止となる条件は次の通りです。

Movable Type 4.1x でカスタムフィールド機能をお使いの場合
Movable Type 4.1x でカスタムフィールド機能をお使いかどうかわからない場合

おそらく近日中に 4.21 がリリースされると思います。

便乗ですが、「Movable Type 4.1x から 4.2 へのアップグレード」で頂いたコメントで、いくつかの問題が発生しているようです。参考になれば幸いです。

Comments [0] | Trackbacks [0]

2008年8月19日

Movable Type 4.2 テンプレートセット（スタイル対応版）

August 19,2008 1:13 AM
Tag：[4.2, MovableType, TemplateSet]
Permalink

Movable Type 4.2 用のテンプレートセット（スタイル対応版）の配布を開始します。

テンプレート

Movable Type 4.1 で追加されたテンプレートセット機能を用いれば、これまでのようにテキストエリアにテンプレートをペーストせずに、簡単に入れ替えることができます。

バージョン 4.1 では、ウィジェットセットがテンプレートセットに未対応でしたが、バージョン 4.2 からウィジェットセットもテンプレートセットに含めることができるようになったため、サイドバーのパーツをウィジェットに移動しました。

ウィジェットに移動

１．テンプレートセットのダウンロード

「4.2 スタイル対応版」のテンプレートセットアーカイブを、下記のページからダウンロードしてください。

Movable Type テンプレート

以下、テンプレートセットの利用方法です。

２．テンプレートセットのインストール

また、mt-static/plugins 配下にある KoikikukanTemplateSet フォルダを Movable Type の mt-static/plugins フォルダに丸ごとアップロードしてください。

「システムメニュー」→「プラグイン」でプラグインの一覧が表示されるので、「KoikikukanTemplateSet」が表示されていればインストールOKです。

プラグインの一覧

３．テンプレートセットの入れ替え

ここではインストールされた状態で入れ替える方法を説明します。

ブログ管理画面より「デザイン」→「テンプレート」をクリック。

ブログ管理画面

右下にある「ブログのテンプレートを初期化」をクリック。

ブログのテンプレートを初期化

新しいテンプレートセットを適用

「確認」をクリック。これでテンプレートセットの入れ替えが開始します。

テンプレートセットの入れ替え開始

「テンプレートの初期化を完了しました。」が表示されれば完了です。

テンプレートの初期化完了

サイトの再構築アイコンをクリック。

サイトの再構築

「すべてのファイル」を選択して「再構築」をクリック。

再構築

「すべてのファイルを再構築しました。」が表示されたら再構築完了です。

再構築完了

前の画面の「サイトを見る」をクリックするか、ブログ管理画面の「サイト表示」のアイコンをクリック。

サイト表示

当サイトのテンプレートセットのデザインで表示されれば完了です。デフォルトデザインのままであればブラウザをリロードしてください。

４．スタイルの切り替え

ここではカラムレイアウトを切り替える方法を説明します。

ブログ管理画面より「デザイン」→「スタイル」をクリック。

ブログ管理画面

「既定のスタイル」の左側にある + マークのアイコンをクリック（「既定のスタイル」の部分は選択状態によって異なります）。

アイコンをクリック

開いたウィンドウに小粋空間テンプレートセットをインストールしたスタティックディレクトリのテーマURLを入力。

テーマURLを

具体的には、次のような URL になります。

http://[user-domain]/mt-static/plugins/KoikikukanTemplateSet/themes/

赤色の部分は、MT のスタティックディレクトリ（mt-static ディレクトリがある位置）までの URL を設定してください。

正しい URL であれば、次のような画面になるので、表示されたサムネイル画像をクリック。

サムネイル画像

右側に大きな画像が表示され、その下にレイアウト選択用のセレクトボックスが表示されます。

セレクトボックス

セレクトボックスからお好きなレイアウトを選択してください。ここでは「layout-two-column-right」を選択します。

レイアウトを選択

レイアウトの対応は次の通りです。このテンプレートセットには3カラム（右サイドバー）を新しく追加しました。

名称	意味
layout-three-column	3カラム・固定レイアウト
layout-three-column-right	3カラム・固定レイアウト（右サイドバー）
layout-three-column-liquid	3カラム・リキッドレイアウト
layout-two-column-right	2カラム（右サイドバー）・固定レイアウト
layout-two-column-liquid-right	2カラム（右サイドバー）・リキッドレイアウト
layout-two-column-left	2カラム（左サイドバー）・固定レイアウト
layout-two-column-liquid-left	2カラム（左サイドバー）・リキッドレイアウト
layout-one-column	1カラム・固定レイアウト
layout-one-column-liquid	1カラム・リキッドレイアウト

選択後、「デザインを適用」をクリック。

デザインを適用

テーマを適用

スタイルが切り替わりました。サイドバーの内容もテンプレート編集画面で入れ替える必要はありません。

スタイルが切り替わりました

５．スタイルの編集

スタイルを変更する場合は、インデックステンプレートにある、「スタイルシート（styles-site.css）」を編集してください。

Comments [8] | Trackbacks [2]

2008年8月17日

Movable Type 4.2 にアップグレード

August 17,2008 1:33 AM
Tag：[4.2, MovableType]
Permalink

当ブログを Movable Type 4.2 にアップグレードしました。

4.2

アップグレード方法は「Movable Type 4.1x から 4.2 へのアップグレード」の通りです。

以下、感想など。

１．ブログ管理画面間の移動

軽くなりました。

２．再構築時間の短縮

再構築時間が格段に早くなりました。4.1 では約2200 ブログ記事の再構築が2時間近くかかっていたのに対し、バージョンアップ後は 20 分に短縮されました。

３．テンプレートの再構築オプション

4.1 まではインデックステンプレートに「再構築オプション（インデックステンプレートを再構築するとき、このテンプレートも再構築するかしないかを設定する）」がありました。私のサイトではインデックステンプレートを使ってモジュール化を行っているので、スタティックな内容のインデックステンプレートはこのチェックを外していたのですが、4.2 ではこの項目がなくなっているため、4.2 のアップグレード後、「テンプレートの設定」の「公開」を「手動」に変更する必要があります。

４．プラグイン

ほとんどのプラグインは 4.2 でもそのまま使えますが、MTArchiveDateFooter プラグインは 4.2 対応のものに変更してください。

ちなみに「Movable Type 4.2 パーフェクトガイド」では、MTArchiveDateHeader/MTArchiveDateFooter プラグインを使わずに、月別アーカイブリストを年別に区切るカスタマイズを紹介しています。

また、頂いたコメントから、VisibleCustomFieldImage プラグイン 0.03 は、バージョン 4.2 に対応していないことが判明しています。

なお、カスタムフィールドについては、標準機能として、サムネイルがある場合は画像を表示するように変更されているようです。また画像アップロード時のオプション画面が表示されなくなっています。

Comments [0] | Trackbacks [0]

2008年8月15日

Movable Type 4.1x から 4.2 へのアップグレード

August 15,2008 2:17 AM
Tag：[MovableType, Upgrade]
Permalink

ローカル環境で、Movable Type 4.13 から 4.2 へアップグレードしてみました。簡素な環境ですが正常にアップグレードできたことを確認できたので、手順を紹介します。

なお、アップグレードは個人の責任で行ってください。正常にアップグレードできなかった場合、申し訳ありませんが当ブログに質問を頂いても解決するお手伝いをすることはできません。作業前には１項に示すバックアップ作業などを行い、ブログのバックアップを行ってください。

１．ブログのバックアップ

4.1 の状態でブログのバックアップを取得します。

注：ブログのバックアップファイルは4.1と4.2で互換性がありません。ドキュメントにも次のように書かれており、4.2 で復元する場合は、4.2 のバックアップファイルしか対象にできません。

Movable Type 4 ドキュメント - バックアップしたブログの復元

バックアップファイルは、必ずバックアップを行った Movable Type と同じ環境で復元してください。例えば、Movable Type 4.1 の環境で、バックアップしたファイルを Movable Type 4.2 で復元したいとき、まず、Movable Type 4.1 で (緊急時用) バックアップを作成後、その Movable Type を Movanle Type 4.2 にアップグレードし、再度バックアップファイルを作成します。その Movable Type 4.2 の環境で作成したバックアップファイルを使用して、復元したい Movable Type 4.2 の環境で復元します。

この件については下記の記事が参考になると思います。

WingMemo - MT4.2RC4　4.2のダイナミックと再構築

バックアップした後、正しくバックアップされているかどうか、バックアップファイルを確認した方が良いでしょう。圧縮ファイルでバックアップした場合、バックアップファイルを解凍すれば、XMLファイルなどがテキストエディタで確認できます。
またはバックアップを2回繰り返し、同じサイズになっていれば、経験上大丈夫だと思います。

バックアップはこれ以外にも方法があります。SQLiteであれば、mt-config.cgi に指定してる DBファイルを丸ごとダウンロードしておけば良いでしょう。MySQL であれば、コマンドラインからバックアップを実行するか、phpMyAdmin によるバックアップが可能です。

バックアップはアップグレード前だけでなく、定期的に行いましょう。

２．アプリケーションディレクトリのリネーム

「アプリケーションディレクトリ」は、mt.cgi などがあるディレクトリです。このアプリケーションディレクトリ自体を FTP ツールでリネームして、プログラムを上書きしないようにしています。

例えば、アプリケーションディレクトリ名が

mt

であれば、

mt--

などに変更します。

なお、アプリケーションディレクトリ名を変更した後、一時的にブログ管理画面にアクセスできなくなりますので、注意してください。

３．アプリケーションディレクトリ作成

リネーム前と同じディレクトリを FTP ツールで（同じ位置に）作成します。上の例では、

mt

というディレクトリを作成します。

４．Movable Type 4.2のアップロード

Movable Type 4.2 のプログラム一式を、アプリケーションディレクトリ配下にアップロードします。

スタティックディレクトリをアプリケーションディレクトリと別のディレクトリに配置している場合は、スタティックディレクトリも手順２～３と同じ要領でディレクトリを作成すると良いでしょう。

５．mt-config.cgi のコピー

旧アプリケーションディレクトリ（mt--）にある mt-config.cgi をFTPツールで一旦ローカルPCにダウンロードし、新アプリケーションディレクトリ（mt）にアップロードします。

この作業を行わずに、うっかり mt.cgi にアクセスすると、新規インストールの動作になってしまう場合があるので注意してください。間違ってアクセスしても、６項のパーミッション変更が行われていなければエラーになります。正常にアクセスできた場合も、ブラウザの操作をそれ以上行わなければ問題ありません。

６．SQLiteのデータベースをコピー（データベースにSQLite/SQLite2を使用している場合）

SQLite を使用していて、データベースファイルが旧アプリケーションディレクトリ（mt--）配下にある場合は、FTP ツールで一旦ローカル PC にダウンロードし、新アプリケーションディレクトリ（mt）配下の同じディレクトリにアップロードします。

SQLite のデータベースファイルがどれか分からない場合は、mt-config.cgi を任意のエディタで開き、Database という項目の右側に書かれている内容が SQLite のデータベースへのパスとファイル名になります。

７．CGIファイルの属性変更

５項でアップロードした、アプリケーションディレクトリ直下にある、各CGIファイル（.cgi）の属性を 644 から 755 や 705 などに変更します。属性が分からない場合は、旧アプリケーションディレクトリの CGI ファイルを参照してください。

８．ブラウザから mt.cgi にアクセス

mt.cgi にアクセスするとアップグレードが開始します。「アップグレード開始」をクリック。

アップグレード開始

サインインします。

サインイン

アップグレードを実行します。完了したら「Movable Typeに戻る」をクリック。

アップグレード完了

アップグレードが完了しました。これでブログ管理画面にアクセスできれば完了です。

アップグレード完了

９．プラグインファイルのコピー

旧アプリケーションディレクトリから必要なプラグインをコピーします。4.1 で外部のテンプレートセットを利用していた場合は、必ず新しい plugins ディレクトリに外部テンプレートセットのディレクトリを、plugins ディレクトリ（場合によっては mt-static/plugins ディレクトリも必要）にコピーしてください。

なお、下記の2つのプラグインはコア機能に統合されたので、旧ディレクトリからコピーしないでください（4.1からブログを開始した場合、Template Refresh プラグインは含まれていません）。

Widget Manager
Template Refresh

以上です。

2008.08.17
６項を追加しました。

2008.08.31
９項にテンプレートセットの記述を追加しました。

Comments [57] | Trackbacks [5]

2008年8月14日

Movable Type 4.2 日本語版リリース

August 14,2008 3:30 PM
Tag：[4.2, MovableType]
Permalink

Movable Type 4.2 日本語版がリリースされました。

Movable Type 4.2 出荷開始

おまたせしました!本日 Movable Type の最新版、バージョン 4.2 のをリリースしました。コミュニティから寄せられたアイデアやソースコード、ユーザーからのフィードバック、そして、素晴しいチームが生んだ Movable Type 4.2 は、これまでよりも速く、安全です。また、今回のバージョンアップでは、様々な機能を追加しました。

日本語版は次のものがリリースされています。

製品名
Movable Type 4.2 (Open Source)
Movable Type 4.2 (Professional Pack, Community Pack 同梱)
Movable Type Commercial 4.2 (Professional Pack 同梱)
Movable Type Enterprise 4.2

個人無償版は、Movable Type 4.2（コミュニティ機能あり）、または Movable Type Commercial 4.2（コミュニティ機能なし）のいずれかを選択できます。

Movable Type 4.2 日本語版

シックスアパートの皆様、お盆休みを返上してのリリース、大変お疲れ様でした！

Comments [0] | Trackbacks [2]

Movable Type 4.2 リリース

August 14,2008 12:03 AM
Tag：[4.2, MovableType]
Permalink

Movable Type 4.2 がリリースされました。

Movable Type 4.2（en/fr/es/de/nl）は下記のページからダウンロードできます。

Movable Type - Download

なお日本語版については、藤本壱さんのブログにある通り、本日15時頃リリースされるようです。

The blog of H.Fujimoto - Movable Type 4.2正式版が公開(日本語版は明日公開予定)

また、4.2 のリリースに伴い、名称が一部変更されています。

旧	新
Movable Type	Movable Type Pro
Movable Type Open Source（MTOS）	Movable Type
Movable Type Enterprise	同左

ということで、早速 Movable Type Pro（en）をダウンロードし、日本語化して「既定のブログ」でサイトを構築してみたのが下です。

Movable Type 4.2

一番下のクレジット表記が「Movable Type Pro」になっています。

お詫び：都合により、このパーマリンクの内容を「YUI Compressor で JavaScript ファイルを圧縮する」から本エントリーに変更しています。

Comments [0] | Trackbacks [0]

2008年8月 1日

Movable Type 4.2 リリース延期

August 1,2008 12:55 AM
Tag：[4.2, MovableType]
Permalink

7月中にリリース予定だった Movable Type 4.2 が延期となりました。

Movable Type 4.2 リリース延期のお知らせ

7月中のリリースを目指していた「Movable Type 4.2」につきまして、さらなる品質向上のため、当初予定していた7月中から8月中のリリースに延期をさせていただきます。

ひそかに「Movable Type 4.2 パーフェクトガイド」の発売と同時リリースを期待していたのですが、思い切りフライング出版になってしまいました。これは予想外でした。

そういうわけで、正直なところ、内部処理の改善は大変嬉しいのですが、テンプレートタグの追加やテンプレートの変更、管理画面の大幅な変更がないことを願ってます。

Comments [2] | Trackbacks [0]

2008年7月30日

Movable Type（MT） 4.2 テンプレートセット

July 30,2008 1:55 AM
Tag：[4.2, MovableType, Template]
Permalink

Movable Type（MT） 4.2 用のテンプレートセット配布を開始します。

2008.09.02
フッタ付きリキッドレイアウト対応 Movable Type テンプレートセットの配布を開始しました。

Movable Type テンプレート

Movable Type 4.2 で追加されたテンプレートセット機能を用いれば、これまでのようにテキストエリアにテンプレートをペーストせずに、簡単に入れ替えることができます。

１．Movable Type（MT）テンプレートセットのダウンロード

Movable Type（MT）テンプレートセットアーカイブを下記のページからダウンロードしてください。

Movable Type テンプレート

以下、Movable Type（MT）テンプレートセットの利用方法です。

２．Movable Type（MT）テンプレートセットのインストール

「システムメニュー」→「プラグイン」でプラグインの一覧が表示されるので、「KoikikukanTemplateSet」が表示されていればインストールOKです。

プラグイン一覧

また、mt-static/plugins フォルダにある KoikikukanTemplateSet フォルダを、スタティックディレクトリ（mt-static）の plugins ディレクトリにアップロードしてください。

３．Movable Type（MT）テンプレートセットの入れ替え

ここではインストールされた状態で入れ替える方法を説明します。

ブログ管理画面より「デザイン」→「テンプレート」をクリック。

ブログ管理画面1

右下にある「ブログのテンプレートを初期化」をクリック。

ブログ管理画面2

テンプレートセット選択画面1

「確認」をクリック。これでテンプレートセットの入れ替えが開始します。

テンプレートセット選択画面2

「テンプレートの初期化を完了しました。」が表示されれば完了です。

テンプレートセット選択完了画面

サイトの再構築アイコンをクリック。

ブログ管理画面3

「すべてのファイル」を選択して「再構築」をクリック。

再構築画面1

「すべてのファイルを再構築しました。」が表示されたら再構築完了です。

再構築画面2

前の画面の「サイトを見る」をクリックするか、ブログ管理画面の「サイト表示」のアイコンをクリック。

再構築画面3

当サイトのテンプレートセットのデザインで表示されれば完了です。デフォルトデザインのままであればブラウザをリロードしてください。

表示されたテンプレート

不具合がありましたら、本エントリーにご連絡ください。

Comments [40] | Trackbacks [0]

2008年7月26日

「Movable Type 4.2 パーフェクトガイド」見本誌到着

July 26,2008 1:33 AM
Tag：[Amazon, Book, MovableType]
Permalink

「Movable Type 4.2 パーフェクトガイド」の見本誌が到着しました。シンプルなカバーが結構気に入ってます。

Movable Type 4.2 パーフェクトガイド

オビのキャッチコピー「最強解説」については、最強かどうかは個人差があると思いますので、文言をそのまま受け止める必要はないと思います。ちなみにキャッチコピーは私の要望ではありません（OKはしました）。

この本は、私が知る限りでは、これまでのMT本の中で最もページ数が多いと思います（776ページ）。どのくらいページ数が多いかというのを分かりやすくするために、これまで執筆させて頂いた書籍と並べて比較してみました。

Movable Type 4.2 パーフェクトガイド

左から順に、「WEBデザインの新しいルール」が264ページ、「CMSとして使うMovable Type」が304ページ、「Movable Type プロフェッショナル・スタイル」が336ページです。

「Movable Type 4.2 パーフェクトガイド」は、見た目は他書の2倍程度ですが、中身をぎゅうぎゅうに詰め込んでいるので、体感的には2.5～3冊分の内容があると思います。そういう意味では、ページ数の都合で値段も通常の本より1000円ほど高めとはいえ、目的が合う方にとってはコストパフォーマンスは良いのではないかと。

Movable Type 4.2 パーフェクトガイド
荒木勇次郎

毎日コミュニケーションズ 2008-07-31
売り上げランキング : 56222

Amazonで詳しく見る by G-Tools

Comments [4] | Trackbacks [0]

2008年7月24日

Movable Type 4.2 リリース候補第4版公開

July 24,2008 1:17 AM
Tag：[4.2, MovableType]
Permalink

Movable Type 4.2 リリース候補第4版が公開されました。

Movable Type 4.2 ベータ

リリース候補第4版の「コマーシャル版・個人無償版 (プロフェッシュナルパック・コミュニティパック同梱)」では、テンプレートセットにコミュニティブログ・コミュニティ掲示板が標準で選択できます。また、「汎用ウェブサイト」の名称が「プロフェッショナルウェブサイト」に変更されています。

MT42rc4

「Template Set Exporter Tool」もリリースされているので、これについては明日エントリーしようと思います。

Comments [0] | Trackbacks [0]

2008年7月17日

「Movable Type 4.2 パーフェクトガイド」予約開始

July 17,2008 12:33 AM
Tag：[Amazon, Book, MovableType]
Permalink

先日校了したMT本の予約が始まりました。

Movable Type 4.2 パーフェクトガイド
荒木勇次郎

毎日コミュニケーションズ 2008-07-31
売り上げランキング : 56222

Amazonで詳しく見る by G-Tools

とりあえず、この本に関する裏話から。

この本のお話を頂いたのは、昨年の後半です。これまでの書籍では、出版社からある程度決まった構成や、書籍の方針にしたがって執筆していたのですが、今回は「何を書いても構いません」ということで、自分のカラーをかなり出せたと思います。

書籍の内容をおおざっぱに申し上げますと、インストールから操作方法、カスタマイズ、MTの付加機能などを網羅しています。テンプレートの解説とカスタマイズが本書のメインで、この部分に通常の書籍の1冊分を費やしています。

カスタマイズは、このブログで公開してきたものを多く含んでますが、（今のところ）ブログで公開していないカスタマイズもあります。テンプレートのカスタマイズは執筆途中で他のサイトで紹介されてしまったものもあり、バッティングしているかもしれませんので予めご容赦ください。逆に、参考にさせて頂いたものは参考記事として、サイト名とパーマリンクを掲載するようにしました。

この本はビギナーや中・上級者など、誰に対してというのは特に意識せず、単に自分が書きたいこと、書けることを綴った、というのが正直なところです。前書きにはそれらしいことを書いてしまってますが、そういう方針めいたものは何もありません。
あえて誰かに向けて書いたか？と問われれば、「自分」です。

また当初、「250～300ページ以上（あまり薄いと、書店に立てて並べたときにタイトルが見えないらしい）であれば何ページでも構いません」というようなことを言われたので、がむしゃらに書き綴ったところ、終盤でストップがかかりました（が、書きたいことは大体盛り込みました）。したがって、フォントサイズや行間を詰めに詰めて、ページ数をかなり絞っています。

さらに、パーフェクトな内容ではないので、タイトルの「パーフェクト」は私自身としては本意ではありませんでしたが、ページ数の関係でそういうタイトルにせざるを得ませんでした。

タイトルの通り、バージョン 4.2 をターゲットにしています。ただし、執筆時点で確認できたのは RC3 （厳密には RC3 以降にリリースされた MTOS のナイトリービルドで差分をチェック）だったため、正式リリース版と食い違いがあるかもしれません。このあたりはサポートサイトでカバーしたいと思います。

目次などは別の機会にエントリーします。

Comments [0] | Trackbacks [0]

2008年7月 2日

MTDate タグ・モディファイア詳説

July 2,2008 2:02 AM
Tag：[MovableType, MTDate]
Permalink

MTDate タグの、Movable Type 4.2 におけるローカルモディファイア詳細です。MTDate タグは再構築の日付を表示するタグです。次の Date 系タグのローカルモディファイアはすべて共通です。

MTArchiveDate
MTArchiveDateEnd
MTAssetDateAdded
MTCalendarDate
MTCommentDate
MTDate
MTEntryCreatedDate
MTEntryDate
MTEntryModifiedDate
MTPageDate
MTPageModifiedDate
MTPingDate
MTScoreDate

１．モディファイアなし

モディファイアを指定しない場合は次のように出力されます。出力フォーマットは、ブログ管理画面の「設定」→「ブログ記事」→「日付の言語」の設定に依存します。

<$MTDate$>

2008年7月 2日 01:23

２．utc モディファイア

utc モディファイアは、協定世界時（Coordinated Universal Time）を示します。タイムゾーンの設定で「UTC+9」とか設定するときの UTC です。1を設定するとタイムゾーンを無視して UTC で出力します。
分かりにくいですが、１項のサンプルから -9 時間で表示されます。

テンプレートタグの記述

<$MTDate utc="1"$>

出力

2008年7月 1日 16:23

３．format_name モディファイア

format_name モディファイアは出力フォーマットを決定します。rfc822 を設定すると、RFC822 に準拠したフォーマットで出力します。

テンプレートタグの記述

<$MTDate format_name="rfc822"$>

出力

Wed, 02 Jul 2008 01:23:56 +0900

iso8601 を設定すると、ISO8601 に準拠したフォーマットで出力します。

テンプレートタグの記述

<$MTDate format_name="iso8601"$>

出力

2008-07-02T01:23:56+09:00

utc モディファイアと組み合わせると、タイムゾーン指定子が UTC を表す「Z」になります。

テンプレートタグの記述

<$MTDate utc="1" format_name="rfc822"$>

出力

Tue, 01 Jul 2008 16:23:56 Z

テンプレートタグの記述

<$MTDate utc="1" format_name="iso8601"$>

出力

2008-07-01T16:23:56Z

３．relative モディファイア

Movable Type 4.2 で追加されたモディファイアです。名前の通り、相対時刻を出力します。JavaScript を利用するので、リアルタイムな相対時刻を表示します。
js を指定すると、JavaScript を利用して相対時刻を表示します。js 以外（1とか）であれば、再構築時間の相対時刻を表示します。
JavaScript を利用する場合は、mt.js のインクルードが必要です。

テンプレートタグの記述

<script src="<$MTBlogURL$>mt.js"></script>
...中略...
<$MTDate relative="js"$>

出力

5 分前

ソースコード

<script type="text/javascript">
/* <![CDATA[ */
document.write(mtRelativeDate(new Date(2008,7,02,01,23,56), '2008年7月 2日 01:23'));
/* ]]> */
</script><noscript>2008年7月 2日 01:32</noscript>

テンプレートタグの記述

<$MTDate relative="1"$>

出力

5 分前

４．mail モディファイア

1を設定すると出力内容をメールの文字コードにエンコードします。グローバルテンプレートのメール通知系で利用します。

テンプレートタグの記述

<$MTDate mail="1"$>

出力

2008年7月 2日 01:23

１項と同じに見えますが、１項の「月」や「日」は、次のように数字実体参照されています。

ソースコード

2008&#24180;7&#26376; 2&#26085; 01:23

５．language モディファイア

出力する言語を指定します。フランス語を指定すると次のようになります。

テンプレートタグの記述

<$MTDate language="fr"$>

出力

2 juillet 2008 1h23

Comments [0] | Trackbacks [0]

2008年6月30日

Movable Type コミュニティソリューション（MTCS）概要

June 30,2008 12:55 PM
Tag：[MovableType, MTCS]
Permalink

先日の「Movable Type 4.2 リリース候補第3版公開」でお伝えしていました、Movable Type コミュニティソリューション（MTCS）の概要です。

誤解をおそれずに言えば、MTCS は、提供されているコミュニティソリューション用のテンプレートセットを使用することで、グループブログや掲示板機能の基本的な利用が可能になるものです。

テンプレートセット

それに伴い、4.2の出荷が延期されたようです。

シックス・アパートが、Movable Typeにコミュニティ・ソリューションを無償でバンドル

「Movable Type 4」プラットフォームにソーシャル･メディア機能を追加するオプション・ソフトウェア「Movable Type コミュニティ・ソリューション（MTCS）」を、「Movable Type」本体に無償でバンドルし、最新版の「Movable Type 4.2」から統合した形で提供することを発表いたします。これにともない、現在実施中のベータテスト期間を当初の予定より延長し、MTCSをバンドルした「Movable Type 4.2」を2008年7月中に出荷開始する予定です。

Via：The blog of H.Fujimoto - MT4.2にコミュニティ・ソリューションが標準添付＆リリース延期

１．コミュニティブログ

グループで投稿ができるブログです。ブログ記事に対する投票機能（スターアイコンをクリックして投票）がデフォルトで用意されています。ブログの[設定]-[コミュニティの設定]から、匿名による投票の許可も可能です。

コミュニティブログ

外部ユーザーもブログ記事投稿者としてのサインアップが可能なようです。なお、サインアップを有効にするために、システム管理者による権限の設定が別途必要です。

サインアップ

こんな感じでサインアップします。

サインアップ

登録メールアドレスに確認用のメールが送信されます。

サインアップ

２．コミュニティ掲示板

フォーラムとトピックによる掲示板です。フォーラムはカテゴリ機能を利用し、トピックはブログ記事を利用しています。先程と同様、サインアップが可能です。

サインアップ

トピックの投稿時にフォーラムを選択することで、トピックをフォーラムごとにまとめることができます。

サインアップ

作成した最新トピックは、フォーラム単位でサイドバーに表示されます。

サインアップ

３．その他

コミュニティ・ソリューションドキュメント

Comments [0] | Trackbacks [1]

2008年6月28日

Movable Type 4.2 リリース候補第3版公開

June 28,2008 3:10 PM
Tag：[4.2, MovableType]
Permalink

Movable Type 4.2 リリース候補第3版が公開されました。

Movable Type 4.2 ベータ

リリース候補第3版では、コミュニティソリューション（MTCS）が追加されました。これについては追ってエントリーしたいと思います。

MT42rc3

コミュニティ・ソリューションドキュメント

細かいところでは、コメント返信用テンプレートタグ名が、MTCommentReplyLink から MTCommentReplyToLink に変更されています。

Comments [0] | Trackbacks [0]

2008年6月24日

Movable Type でメールマガジンを作る

June 24,2008 12:55 PM
Tag：[Address, MovableType]
Permalink

昨日の「Movable Type 4.2 でアドレス帳機能を利用する」の続きで、ブログ管理者が手動でアドレス帳にメールアドレスを登録するのではなく、ブログにアドレス登録用のフォームを掲載し、外部のユーザーが登録したメールアドレスをアドレス帳に登録する方法を紹介します。

メルマガ登録

この機能と「Movable Type 4.2 でアドレス帳機能を利用する」を組み合わせれば、Movable Typeを利用してメールマガジンのようなものを構築できそうです（タイトルはちょっと言い過ぎです）。

本エントリーではメールアドレス登録までの流れを紹介します。この機能を利用するには、事前に次の作業を行ってください。

システムメニュー「全般」のメールアドレスを設定する
アドレス帳機能を有効にする

１．メールアドレス登録フォームの作成

次のようなメールアドレス登録フォーム用のテンプレートモジュール（またはウィジェット）を作成します。

<form method="post" action="<$MTCGIPath$>mt-add-notify.cgi">
    <input type="hidden" name="blog_id" value="<$MTBlogID$>" />
    <input type="hidden" name="_redirect" value="<$MTBlogURL$>" />
    <input name="email" size="20" />
    <input type="submit" value="add" />
</form>

mt-add-notify.cgi がアドレス帳追加用のCGIです。他の input 要素についてはそのまま使用してください。

２．メールアドレスの登録

ブログ閲覧ユーザは、表示されたフォームからメールアドレスを登録します。「add」をクリックすると、「登録したメールアドレスにメールを送信しました。メールアドレスを認証するため、メールの内容に従って登録を完了してください。」というメッセージが表示されます。

登録ユーザーが、送信されたメールに掲載されたURLをクリックすれば、アドレス帳への追加が完了します。逆に、クリックをしないと登録は完了しないので、スパム攻撃を防ぐことができます。

３．メールマガジンを送る

送信方法は「Movable Type 4.2 でアドレス帳機能を利用する」を参照してください。

メールマガジンの送信時に使われるテンプレートは、システムテンプレートの「ブログ記事の共有」です。このテンプレートをカスタマイズすれば、好きなフォーマットで送信できます。

メールマガジン本文は、ブログ記事本文の内容をそのまま利用すると良いでしょう。
なお、ブログ記事の「テキストフォーマット」の指定は適用されません。メールで送信する際は、プレーンテキストで送られます。

４．その他

以前のバージョン（～3.3）では環境変数EmailVerificationSecretの設定が必要でしたが、Movable Type 4では環境変数自体が削除されています。

Comments [15] | Trackbacks [1]

2008年6月23日

Movable Type 4.2 でアドレス帳機能を利用する

June 23,2008 1:33 AM
Tag：[4.2, Adress, MovableType]
Permalink

Movable Type 4.1 まで表示されていた「アドレス帳」が、Movable Type 4.2 では表示されなくなっています。

下は 4.1 のブログ管理画面です。[設定]メニューに[アドレス帳]があります。

ブログ管理画面（4.1）

下は 4.2 のブログ管理画面です。[設定]メニューに[アドレス帳]はありません。他のメニューにも表示されません。

ブログ管理画面（4.2）

アドレス帳機能が落とされたかと思ったのですが、mt-config.cgi に、次の環境変数 EnableAddressBook を設定（値を1）すれば、アドレス帳機能を有効にすることができます。

EnableAddressBook 1

mt-config.cgi に設定後、管理画面にアクセスすれば、「一覧」メニューにアドレス帳が表示されます。

「一覧」メニューにアドレス帳が表示

ちなみに「アドレス帳機能」とは、指定したメールアドレスにブログ記事を投稿をお知らせする機能で、ブログ記事のタイトルやリンク、あるいはブログ記事の概要や本文にメッセージを加えて送信することができます。

アドレス帳にメールアドレスやURLを追加すると、アドレス帳一覧画面でこのように表示されます。

アドレス帳一覧画面

ブログ記事投稿後に「共有」のリンクをクリックします。

「共有」のリンクをクリック

送信画面が表示されます。アドレス帳に登録済のメールアドレスがあれば、ひとつずつメールアドレスを設定せずに、一括送信することができます。

送信画面

Comments [11] | Trackbacks [1]

2008年6月20日

Movable Type 4.2 の Ajax 検索機能

June 20,2008 12:55 PM
Tag：[Ajax, MovableType, Search]
Permalink

Movable Type 4.2 の検索機能ではページ分割が導入されました。

検索結果のページ分割

検索結果が複数のページに跨る場合（=ページ分割された場合）は、Google マップのスクロールのように、次の検索結果ページを Ajax で事前に取得します。
その結果、分割ページに移動するときは、ストレスのないページ送りができるようになっています。瞬時に前後ページに移動できるので、かなり快適です。
ただし、初回の検索は Ajax ではありません。

本エントリーでは、検索結果ページで使われている JavaScript をかなり簡単に紹介します。

１．getResults

MTIfMoreResultsタグで、検索結果がページ分割されている場合にこのコードがページに展開され、現在の検索結果の表示中にバックグラウンドで Ajax を起動し、次のページの検索結果を取得・保持します。

<MTIgnore>Below Javascript adds ajax search capability</MTIgnore>
<script type="text/javascript">
/* <![CDATA[ */
<MTIfMoreResults>
function getResults(page) {
    page = parseInt(page);
    if (timer) window.clearTimeout(timer);
    var xh = mtGetXmlHttp();
    if (!xh) return false;
    var res = results[page];
    if (!res) return;
    var url = res['next_url'];
    if (!url) return;
 
    xh.open('GET', url + '&format=js', true);
    xh.onreadystatechange = function() {
        if ( xh.readyState == 4 ) {
            if ( xh.status && ( xh.status != 200 ) ) {
                // error - ignore
            } else {
                try {
                    var page_results = eval("(" + xh.responseText + ")");
                    if ( page_results['error'] == null )
                        results[page + 1] = page_results['result'];
                } catch (e) {
                }
            }
        }
    };
    xh.send(null);
}
...中略...
</MTIfMoreResults>
/* ]]> */
</script>

この関数は、検索結果ページに埋め込まれた次のスクリプトで実行されます。

<MTIgnore><!-- Used with the ajax search capability of the new search class --></MTIgnore>
<MTIfMoreResults>
<script type="text/javascript">
<!--
var div = document.getElementById('search-results');
var results = {
    '<MTCurrentPage>': {
        'content': div.innerHTML,
        'next_url': '<MTNextLink>'
    }
};
var timer = window.setTimeout("getResults(" + <MTCurrentPage> + ")", 1*1000);
//-->
</script>
</MTIfMoreResults>

次のページのURLは、getResults の内部処理で JSON 型の変数 results の next_url にアクセスし、MTNextLinkタグで展開された URL を取得します。

getResults は、周期処理を行うための window.setTimeout で起動され、getResults の内部処理の window.clearTimeout で周期処理を停止します。つまり1回しか起動されません。また、1秒周期で実行するため、検索結果が表示されてからすぐにリンクをクリックすると、Ajax による次のページ取得が完了していない場合があります。

２．swapContent

検索結果本文を、保持している前後の検索結果と置き換えます。

<script type="text/javascript">
/* <![CDATA[ */
<MTIfMoreResults>
...中略...
function swapContent(direction) {
    if ( direction == undefined ) direction = 1;
    var page_span = document.getElementById('current-page');
    if (!page_span) return true;
    var next_page = direction + parseInt(page_span.innerHTML);
    var res = results[next_page];
    if (!res) return true;
    var content = res['content'];
    if (!content) return true;
    var div = document.getElementById('search-results');
    if (!div) return true;
    div.innerHTML = content;
    timer = window.setTimeout("getResults(" + next_page + ")", 1*1000);
    window.scroll(0, 0);
    return false;
}
<MTElse><MTIfPreviousResults>
function swapContent(direction) {
    return true;
}</MTIfPreviousResults>
</MTIfMoreResults>
/* ]]> */
</script>

この関数は、検索結果ページに埋め込まれたページ移動用のナビゲーションの「前」「次」のリンクから実行されます。

<MTIgnore><!-- Used with the ajax search capability of the new search class --></MTIgnore>
<div class="content-nav">
<MTIfPreviousResults>
  <a href="<MTPreviousLink>" rel="prev" onclick="return swapContent(-1);">&lt; 前</a>&nbsp;&nbsp;
</MTIfPreviousResults>
<MTPagerBlock>
  <MTIfCurrentPage>
    <MTVar name="__value__">
  <MTElse>
    <a href="<MTPagerLink>"><MTVar name="__value__"></a>
  </MTIfCurrentPage>
  <mt:unless name="__last__">&nbsp;</mt:unless>
</MTPagerBlock>
<MTIfMoreResults>&nbsp;&nbsp;<a href="<MTNextLink>" rel="next" onclick="return swapContent();">次 &gt;</a>
</MTIfMoreResults>

なお、Ajax によるページ移動は「前」「次」のリンクを使った場合のみ有効で、ページ番号のリンクをクリックしたときは通常のCGI起動になります。

３．注意事項

ページ分割時の Ajax を有効に活用するには、次の青色の1行が必要です。

...前略...
<MTSearchResults>
  <MTSearchResultsHeader>
    <div id="search-results">
      <span id="current-page" class="hidden"><MTCurrentPage></span>
      <h1 id="page-title" class="search-results-header">
...後略...

関数 swapContent の内部処理で、現在のページ番号をここから取得しています。

Comments [4] | Trackbacks [0]

2008年6月17日

Movable Type 4.2 RC2 モジュールキャッシュ実測

June 17,2008 1:55 AM
Tag：[4.2, Cache, MovableType]
Permalink

藤本さんの記事に触発されて、Movable Type 4.2 RC2 のモジュールキャッシュを試してみました。

私の場合は、「小粋空間」の昨日までのデータを Movable Type 4.2 RC2 にインポートしました。

０．ブログのテストデータと動作環境

ブログ記事数：2131件
コメント：13364件
トラックバック：4481
カテゴリ：179
月数：56ヶ月

サーバ：さくらインターネット（スタンダード）
データベース：MySQL
テンプレート：既定のブログ（キャッシュの設定以外はカスタマイズなし）
スタティックパブリッシング

以下、ブログ記事アーカイブのみの再構築時間の実測値（再構築画面に表示された時間）です。結構時間がかかったので、それぞれ1回ずつしか試していません。

追記：「1回ずつ」というのは、モジュールキャッシュした後の話です。したがって実際には再構築は2回ずつ行っています。

１．モジュールキャッシュなし

再構築時間：1時間51分

２．モジュールキャッシュあり（ケース1）

以下の項目をモジュールキャッシュ（keyモディファイアあり）

ブログ記事本文（タイトル・本文・追記をモジュール化してキャッシュ）
コメント（「コメント」テンプレートモジュールをキャッシュ）
トラックバック（「トラックバック」テンプレートモジュールをキャッシュ）

再構築時間：1時間43分

３．モジュールキャッシュあり（ケース2）

以下の項目をモジュールキャッシュ（keyモディファイアなし）

月別アーカイブ一覧
最近のブログ記事
最近のコメント

再構築時間：1時間33分

４．モジュールキャッシュあり（ケース3）

以下の項目をモジュールキャッシュ（keyモディファイアなし）

カテゴリ一覧
月別アーカイブ一覧
最近のブログ記事
最近のコメント

再構築時間：9分50秒

５．モジュールキャッシュあり（ケース4）

以下の項目をモジュールキャッシュ（ケース1 + ケース3）

ブログ記事本文
コメント
トラックバック
カテゴリ一覧
月別アーカイブ一覧
最近のブログ記事
最近のコメント

再構築時間：8分51秒

６．所感

テストデータが一種類なのと組み合わせが適当なので、結論とはいえませんが、とりあえず感じたところを。

ブログ記事単位のモジュールキャッシュ（本文・コメント・トラックバック）は意外にも大差なし。
カテゴリアーカイブのモジュールキャッシュの効果絶大（カテゴリ数や階層構造にもよると思いますが...）

2008.08.23
本文に、再構築回数について補足しました。

Comments [4] | Trackbacks [1]

2008年6月14日

Movable Type 4.2 リリース候補第2版公開

June 14,2008 3:17 AM
Tag：[4.2, MovableType]
Permalink

出遅れましたが、Movable Type 4.2 リリース候補第2版が公開されました。

More Reasons to Upgrade to Movable Type 4.2 and RC2

Movable Type 4.2 ベータ

SQLite3 がダイナミックパブリッシング対応になったようです。また、特殊変数もダイナミックパブリッシング対応になったようです。

Wing Memo - MT4.2RC2　SQLiteでダイナミック・パブリッシング！

また、ダイナミックパブリッシング利用でのアーカイブのページ分割ができるようになっています（実験段階のためサポート対象外）

MovableType.jp - ダイナミックパブリッシングでのページ分割

それを受けて、野田さんが配布されている静的ページ分割プラグインを改修されています。

Junnama Online (Mirror) - MT4.2のダイナミックパブリッシングでのページ分割互換、静的ページ分割プラグイン。

Comments [0] | Trackbacks [0]

2008年6月13日

mteval モディファイアと numify モディファイア

June 13,2008 2:22 AM
Tag：[Modifier]
Permalink

Movable Type 4.2rc1 に新しいモディファイアが追加されています。

１．mteval モディファイア

テンプレートの出力内容に含まれるテンプレートタグを実行し、出力します。つまり、ブログ記事の中に記述したテンプレートタグを評価してくれます。

これは以前「エントリーの中でMTタグを使う」で紹介した、EvalTemplate や Process Tags plugin と同じ目的です。

個人的には、このモディファイアがようやく標準で装備されて、感慨深いです。

mteval モディファイアは、次のように設定してください。

<MTEntries>
<$MTEntryBody mteval="1"$>
</MTEntries>

これでブログ記事の本文に <$MTBlogURL$> などを書いて公開すれば、URLが表示されます。

２．numify モディファイア

数字の桁を区切るモディファイアです。

このモディファイアは、次のように設定してください。

<MTSetVar name="number" value="10000000000" />
<MTGetVar name="number" numify="," />

上のサブテンプレートを実行すると、

10,000,000,000

となります。
桁区切りは、デフォルトがカンマで、ピリオドなど何でもOKだと思います。numify="1" でも大丈夫です。

Comments [0] | Trackbacks [1]

2008年6月11日

Movable Type 4.2 における mt.js の変更点（その1：Ajax 対応と window.onload の代替スクリプト）

June 11,2008 12:22 PM
Tag：[4.2, Ajax, MovableType]
Permalink

先日、Movable Type 4.2 におけるコメント投稿フォームの機能追加と改善点をエントリーしましたが、動作を制御する mt.js（インデックステンプレートの「JavaScript」）が、新しく実装し直されていますので、気がついたところを紹介したいと思います。

１．Ajax 用関数の追加

mt.js は今までコメントフォーム専用でしたが、検索結果（ページ分割された場合）を Ajax で表示するための関数 mtGetXmlHttp が追加されています。

<mt:Ignore>
/***
 * Returns a XMLHttpRequest object (for Ajax operations).
 */
</mt:Ignore>
function mtGetXmlHttp() {
    if ( !window.XMLHttpRequest ) {
        window.XMLHttpRequest = function() {
            var types = [
                "Microsoft.XMLHTTP",
                "MSXML2.XMLHTTP.5.0",
                "MSXML2.XMLHTTP.4.0",
                "MSXML2.XMLHTTP.3.0",
                "MSXML2.XMLHTTP"
            ];
 
            for ( var i = 0; i < types.length; i++ ) {
                try {
                    return new ActiveXObject( types[ i ] );
                } catch( e ) {}
            }
 
            return undefined;
        };
    }
    if ( window.XMLHttpRequest )
        return new XMLHttpRequest();
}

２．window.onload の代替スクリプト

もうひとつは、JavaScript マスター Dean Edwards 氏による、window.onload の代替スクリプトが追加されています。

// BEGIN: fast browser onload init
// Modifications by David Davis, DWD
// Dean Edwards/Matthias Miller/John Resig
// http://dean.edwards.name/weblog/2006/06/again/?full#comment5338
 
function mtInit() {
    // quit if this function has already been called
    if (arguments.callee.done) return;
 
    // flag this function so we don't do the same thing twice
    arguments.callee.done = true;
 
    // kill the timer
    // DWD - check against window
    if ( window._timer ) clearInterval(window._timer);
 
    // DWD - fire the window onload now, and replace it
    if ( window.onload && ( window.onload !== window.mtInit ) ) {
        window.onload();
        window.onload = function() {};
    }
}
 
/* for Mozilla/Opera9 */
if (document.addEventListener) {
    document.addEventListener("DOMContentLoaded", mtInit, false);
}
 
/* for Internet Explorer */
/*@cc_on @*/
/*@if (@_win32)
document.write("<script id=__ie_onload defer src=javascript:void(0)><\/script>");
var script = document.getElementById("__ie_onload");
script.onreadystatechange = function() {
    if (this.readyState == "complete") {
        mtInit(); // call the onload handler
    }
};
/*@end @*/
 
/* for Safari */
if (/WebKit/i.test(navigator.userAgent)) { // sniff
    _timer = setInterval(function() {
        if (/loaded|complete/.test(document.readyState)) {
            mtInit(); // call the onload handler
        }
    }, 10);
}
  
/* for other browsers */
window.onload = mtInit;
 
// END: fast browser onload init

これは、window.onload 前でも DOM 処理が可能になった時点で JavaScript を実行可能にしてくれるものです。
通常、JavaScript は、表示するページにサイズの大きな画像などがあると、それが全部読み込まれた後にしか動作しません。このスクリプトは画像の読み込みに関係なく、ページのDOM処理が可能になれば、JavaScriptが開始します。つまり、Ajax がページの描画に影響なく動作します。

参考サイト：

Comments [0] | Trackbacks [1]

2008年6月 6日

Movable Type 4.2のコメント投稿フォームの変更点

June 6,2008 12:00 PM
Tag：[4.2, Comment, MovableType]
Permalink

Movable Type 4.2における、コメント投稿フォームの変更点を紹介します。

１．コメントフォームとメッセージの表示方法

コメントポリシーや認証の設定によって、表示状態や表示メッセージが切り替わるコメントフォームですが、4.2では次のように変更されています。

１．１「認証なしコメント」のみを選択

メッセージを表示せず、コメントフォームをデフォルトで表示します。

メッセージを表示2

１．２「認証なしコメント」と1つ以上の認証方式を選択

「コメントする前にサインインすることもできます」というメッセージを表示し、コメントフォームをデフォルトで表示します。

メッセージを表示1

１．３「認証なしコメント」を選択せず、1つ以上の認証方式を選択

「コメントするにはまずサインインしてください」というメッセージを表示し、コメントフォームは表示しません。

メッセージを表示3

２．サインイン時にローディング画像表示

「サインイン」をクリックすると、サインイン画面に遷移するまでの間、ローディング画像を表示します。

ローディング画像を表示

３．匿名表示

名前フィールドを入力せずに、コメントプレビューすると、名前フィールドに「匿名」が自動的に表示されます。

匿名表示

４．サインイン状態のコメントプレビュー

サインイン状態のコメント投稿フォームは、URL入力が消え、テキストエリアのみの表示に変更されています。

テキストエリアのみの表示

コメントプレビュー画面も同様です。

テキストエリアのみの表示

５．親コメントへの返信

コメント本文に表示された「返信」をクリックすると、「～のコメントに返信」のチェックボックスが表示されます。チェックを外すと返信が解除されます。ことなるコメントの「返信」をクリックすると、チェックボックスの表示や保持する情報も切り替わります。

親コメントへの返信

コメントプレビュー時も返信コメントの情報は保持されます。

コメントプレビュー時も返信コメントの情報は保持

６．CAPTCHA

CAPTCHAを有効にしていて、かつ「認証なしコメント」と1つ以上の認証方式を選択している場合、デフォルトではCAPTCHAは表示されず、任意の入力フィールドをクリックするとCAPTCHAが表示されます。これは、コメントフォームを表示する方式に変更したことにより、コメント投稿者のサインイン認証の可否が判断するための対処と思われます。

CAPTCHAフィールドが表示されていない状態

サインインせずに入力フィールドをクリックすると、CAPTCHAを表示
サインインせずに、入力フィールドをクリックするとCAPTCHAを表示

７．フォームボタン

投稿すると、フォームボタンをグレーアウトします。

フォームボタンをグレーアウト

以上です。
JavaScriptも大きく変更されています。これについては別エントリーします。

Comments [15] | Trackbacks [0]

2008年6月 5日

予約変数一覧 for Movable Type 4.2

June 5,2008 12:12 PM
Tag：[4.2, MovableType, Template]
Permalink

MTIf タグ等でアーカイブ種別を判定するための、Movable Type 4.2 ベータで予め用意された予約変数一覧です。

このエントリーは、MT4.1 用にエントリーした「予約変数一覧 for Movable Type 4.1」を MT4.2 ベータ版の内容に書き換えたものです。赤字は 4.1 から削除された変数、青字は追加された変数です。

これらは lib/MT/WeblogPublisher.pm と lib/MT/ArchiveType 配下に記載されているものを抜粋して、下記の表にまとめました（使用方法は後述）。

	Y	M	W	D	C	C				A	A				I	P
	Y	M	W	D	C	Y	M	W	D	A	Y	M	W	D	I	P
archive_template ~~main_template~~	○	○	○	○	○	○	○	○	○	○	○	○	○	○	○	○
datebased_archive	○	○	○	○		○	○	○	○		○	○	○	○
archive_listing	○	○	○	○	○	○	○	○	○	○	○	○	○	○
datebased_only_archive	○	○	○	○
category_archive					○	○	○	○	○
author_archive										○	○	○	○	○
entry_archive feedback_template															○	○
module_category-monthly_archives					○		○
module_category_archives					○
module_author-monthly_archives										○		○
datebased_yearly_archive module_yearly_archives	○
datebased_monthly_archive		○
datebased_weekly_archive			○
datebased_daily_archive				○
category_yearly_archive						○
category_monthly_archive							○
category_weekly_archive								○
category_daily_archive									○
author_yearly_archive											○
author_monthly_archive												○
author_weekly_archive													○
author_daily_archive														○
entry_template															○
page_archive page_template																○

一番上にある略号の意味は次の通りです。

Y：年別アーカイブ
M：月別アーカイブ
W：週別アーカイブ
D：日別アーカイブ
C：カテゴリーアーカイブ
A：ユーザーアーカイブ
I：ブログ記事アーカイブ
P：ウェブページアーカイブ

カテゴリーアーカイブとユーザーアーカイブは、年別・月別・週別・日別との組み合わせもあります。

○印がついているのが、そのアーカイブを表示する時に、変数に "1" が設定されていることを示しています。●はデフォルトテンプレートで、テンプレート上に MTSetVar タグで設定されているものを示しています。

例えば、アーカイブ種別が「年別・月別・週別・日別」であることを判定したい場合は、

<MTIf name="datebased_only_archive">
　　：
</MTIf>

とテンプレート（またはテンプレートモジュール）に書きます。

このタグが書かれたテンプレートやテンプレートモジュールが「年別・月別・週別・日別」として実行される場合、MTIf タグのブロック内部が実行されます。

アーカイブ種別が「ブログ記事・ウェブページ」であることを判定したい場合は

<MTIf name="feedback_template">
　　：
</MTIf>

と書きます。このタグが書かれたテンプレートやテンプレートモジュールが「ブログ記事・ウェブページ」として実行される場合、MTIf タグのブロック内部が実行されます。

これらを利用すれば、独自の変数を用意する必要はありません。

Comments [2] | Trackbacks [0]

2008年5月30日

Movable Type 4.2 リリース候補版公開

May 30,2008 3:00 PM
Tag：[4.2, MovableType]
Permalink

Movable Type 4.2 リリース候補版が公開されました。4.2 はこれまでの 4.15 ベータのバージョン番号が改められたもので、製品版の出荷予定は6月下旬のようです。

Movable Type 4.2 を発表しました

シックス・アパートでは Movable Type 4.15 のベータテストを続けてきました。Movable Type 4.15 ベータでは、様々な機能追加され、特にパフォーマンス面に関しては大きな進歩を遂げました。本バージョンをより多くのユーザー様にご利用いただくためにも、バージョンナンバーを 4.2 と改め、本日、リリース候補版 (RC) 1 を発表しました。

Movable Type 4.2 リリース候補版は次のリンク先からダウンロードできます。

Movable Type 4.2 ベータ

4.2では「TypePad AntiSpam (Beta)」プラグインが同梱されています（ベータ版のため日本語は未対応、海外からのスパムブロックは可能）。プラグインの使用方法は、TypePad AntiSpam (Beta)を参照してください。

antispam

また、Movable Type4.2発表記念キャンペーンも実施中です。

Movable Type4.2発表記念　プレゼントキャンペーン実施中

Movable Type4.2発表を記念しまして、アンケートに答えるとプレゼントが当たるキャンペーンを5月30日より実施します。
また、Movable Type基本ライセンスをご購入いただいた先着100名様にプレゼントいたします。

Movable Type 4.2 発表記念キャンペーンサイト

Comments [0] | Trackbacks [0]

小粋空間 - a cheap joke and a play on words site

アップロード画像の img 要素の alt 属性・title 属性をカスタマイズする（サムネイル画像編）

１．概要

２．「説明」フィールドの内容を title 属性に挿入する

フォルダアーカイブとフォルダアーカイブ一覧を作る

１．フォルダアーカイブの作成

１．１ WriteToFile プラグインのダウンロード

１．１ フォルダアーカイブ用テンプレートの作成

１．２ フォルダアーカイブ用テンプレートの修正1

１．３ フォルダアーカイブ用テンプレートの修正2

２．フォルダアーカイブ一覧の作成

３．注意事項1

４．注意事項2

MTEntriesWithSubCategories タグの不具合などについて

Movable Type 4.1 と 4.2 の差分（コメント入力フォーム）

１．コメントプレビュー用データ

4.1

4.2

２．メッセージ表示用エリアのマークアップ

4.1

4.2

３．form要素

4.1

4.2

４．hidden属性のinput要素

4.1

4.2

4.2（コメントプレビュー）

５．input要素（名前・メール・URL）

4.1

4.2

６．input要素（情報を保存）

4.1

4.2（コメントプレビューでは表示させない制御を追加）

７．返信表示用チェックボックス

4.1

4.2

８．textarea要素

4.1

4.2

９．CAPTCHA用フィールド

4.1

4.2

１０．確認用フォームボタン

4.1

4.2

１１．投稿後、フォームボタンをdisableにするJavaScript（二重送信の防止）

4.1

4.2

１２．4.1のテンプレート構成で4.2にバージョンアップする場合のコメント入力フォームサンプル

Movable Type 4.2 テンプレートセット（フッタ付きリキッドレイアウト対応）

１．テンプレートセットのダウンロード

２．テンプレートセットのインストール

３．テンプレートセットの入れ替え

４．スタイルの切り替え

５．スタイルの編集

アップロード画像の img 要素の alt 属性・title 属性をカスタマイズする

１．「説明」フィールドの内容を alt 属性に挿入する

２．「説明」フィールドの内容を title 属性に挿入する

【重要】MT4.1x → MT4.2 へのアップグレード注意

Movable Type 4.2 テンプレートセット（スタイル対応版）

１．テンプレートセットのダウンロード

２．テンプレートセットのインストール

３．テンプレートセットの入れ替え

４．スタイルの切り替え

５．スタイルの編集

Movable Type 4.2 にアップグレード

１．ブログ管理画面間の移動

２．再構築時間の短縮

３．テンプレートの再構築オプション

４．プラグイン

Movable Type 4.1x から 4.2 へのアップグレード

１．ブログのバックアップ

２．アプリケーションディレクトリのリネーム

３．アプリケーションディレクトリ作成

４．Movable Type 4.2のアップロード

５．mt-config.cgi のコピー

６．SQLiteのデータベースをコピー（データベースにSQLite/SQLite2を使用している場合）

７．CGIファイルの属性変更

８．ブラウザから mt.cgi にアクセス

１．１フォルダアーカイブ用テンプレートの作成

１．２フォルダアーカイブ用テンプレートの修正1

１．３フォルダアーカイブ用テンプレートの修正2

１．１「認証なしコメント」のみを選択

１．３「認証なしコメント」を選択せず、1つ以上の認証方式を選択