もっさりMTブログ

MTで遊べば遊ぶほど、管理画面をオリジナルにカスタマイズしたい！という衝動に駆られます。
管理画面の表示を少し変えたかったり、使いやすい様にカスタマイズしたり、色々できるので割と面白いです。
MTを利用してサイトを作る案件では、クライアントのために補足説明を付け足すなど覚えておくとやはり便利です。

管理画面をいじる前に、どのテンプレートがどの管理画面のものなのか、いちいち調べるのが面倒なので、何か良い方法は無いかと探していた所、管理画面自体にテンプレートファイル名を出力する方法が、小粋空間さんのブログで紹介されていました。

Movable Type の管理画面用テンプレートファイル名を管理画面に表示する

まずは、lib/MT.pmを修正します。load_tmplに下記の赤字部分を追記します。

～前略～
sub load_tmpl {
    my $mt = shift;
～中略～
    return $mt->error(
        $mt->translate("Loading template '[_1]' failed.", $file)) unless $tmpl;
    $mt->set_default_tmpl_params($tmpl);
    $param->{template_file} = $file;
    $tmpl->param($param) if $param;
    $tmpl;
}～後略～

次にfooter.tmplを修正します。
tmpl/cms/include/footer.tmplを開いて、下記の赤字部分を追記します。

～前略～
            <p id="version">
                <strong><__trans phrase="<a href="[_1]"><mt:var name="mt_product_name"></a> version [_2]" params="<mt:var name="portal_url">%%<mt:var name="mt_version_id">"></strong>
<mt:if name="packs_installed">
                <__trans phrase="with">: <mt:loop name="packs_installed" glue=", "><a href="<__trans phrase="http://www.sixapart.com/movabletype/">pack/<mt:var name="id">/"><mt:var name="label" escape="html"> <mt:var name="version" escape="html"></a></mt:loop>
</mt:if>
, <mt:var name="template_file">
            </p>
～後略～

これで管理画面のフッターにテンプレートのファイル名が表示されるはず。

MTを利用してサイトを構築する時に多々使うのが、特定のカテゴリーをリストに表示させたくない場合の処理です。
特定のカテゴリーを非表示にするには、<MTUnless>タグを使用します。

<mt:categories>
  <mt:unless tag="CategoryLabel" like="表示したくないカテゴリー名1|表示したくないカテゴリー名2">
----表示するカテゴリーの処理----
  </mt:unless>
</mt:categories>

「表示したくないカテゴリー名1」と「表示したくないカテゴリー名2」を非表示にします。
また、likeモディファイアでは、正規表現が使えるので、複雑なフィルタリングも可能です。

前回取り上げた「全ページに最新記事のリストを表示する方法」は、MT内の別ブログの最新記事を、メインブログの全ページに表示したい場合にも有効です。

複数のブログの情報を取り扱う時は、<MTMultiBlog>タグを利用する事が多いのですが、それを使わなくても、簡単に表示する事ができます。

<mt:Blogs include_blogs="ブログID" ignore_archive_context="1">
<mt:Entries include_blogs="ブログID" lastn="件数">
<mt:EntriesHeader>
<h3><$mt:BlogName$></h3>
<ul>
</mt:EntriesHeader>
<li><a href="<$mt:EntryPermalink$>"><$mt:EntryTitle$></a> (<$mt:EntryDate$>)</li>
<mt:EntriesFooter></ul></mt:EntriesFooter>
</mt:Entries>
</mt:Blogs>

上記の「ブログID」に表示したいブログのIDを入れ、件数を指定します。
これをウィジェットやモジュールで作成し、表示したい場所にインクルードして再構築します。

全ページに表示されない仕様も回避できるし、シンプルで良い感じです。

MTのデフォルトのウィジェットに「最近のブログ記事」が用意されていますが、これをそのまま使うと、各カテゴリーアーカイブなどのページには、そのカテゴリーに属している記事の最新記事しか表示されません。

ブログの全ページに全ての記事の最新記事リストを表示しようと思うと、これが案外大変だったりするわけです。

そこで参考にさせていただいたのがこちらの記事
ブログの全ページに最新記事のリストを出力する裏ワザ

PHPもプラグインも使わずに、全ページに記事リストを表示する方法を、とても丁寧にわかりやすく説明されています。

このブログでもこの方法で最新記事を全てのページに表示しています。

というわけで「最近のブログ記事」ウィジェットはこんな感じになりました。

<mt:BlogID setvar="blog_id">
<mt:Blogs include_blogs="$blog_id" ignore_archive_context="1">
<mt:If tag="BlogEntryCount">
    <mt:Entries include_blogs="$blog_id" lastn="20">
        <mt:EntriesHeader>
<div class="widget-recent-entries widget-archives widget">
    <h3 class="widget-header">最近のブログ記事</h3>
    <div class="widget-content">
        <ul>
        </mt:EntriesHeader>
        <li class="<mt:If name="__odd__">liodd<mtElse>lieven</mtif>"><a href="<$mt:EntryPermalink$>"><$mt:EntryTitle$></a></li>
        <mt:EntriesFooter>
        </ul>
    </div>
</div>
        </mt:EntriesFooter>
    </mt:Entries>
</mt:If>
</mt:Blogs>

変更した部分は、

<mt:BlogID setvar="blog_id">
<mt:Blogs include_blogs="$blog_id" ignore_archive_context="1">
    <mt:Entries include_blogs="$blog_id" lastn="20">
        ----処理内容----
    </mt:Entries>
</mt:Blogs>

上記の通り。
現在のブログのIDを「blog_id」にセットして、「MTBlogs」タグで現在のブログのIDを「include_blogs」モディファイアで指定し、「ignore_archive_context」モディファイアでコンテキストを外します。
これを利用することで、テンプレートに関係なく、最新の記事リストを出力する事が可能になります。

また、「MTEntries」には「include_blogs="$blog_id"」のモディファイアを入れないと、再構築中にエラーが出ます。

これで全ページに最新記事リストを表示する事ができました。

自分用メモみたいなものですが、MTでテンプレートのカスタマイズをしていると、よく使う予約変数がいくつかあります。
各テンプレート、ページ毎に出力結果を変えたい時は多用するので、その中でもよく使うものをメモっておきます。

よく使うMTの予約変数

変数名	場所
>>アーカイブテンプレートに設定される予約変数
main_index	メインページ
archive_index	アーカイブインデックス
archive_template	アーカイブテンプレート
entry_template entry_archive	ブログ記事
page_archive page_template	ウェブページ
category_archive	カテゴリアーカイブ

使い方はこんな感じ。

<mt:if name="main_index">
---処理内容---
</mt:if>

特定のカテゴリーやタグで、ブログ記事リストを出力するケースは以前取り上げましたが、特定のキーワードで記事一覧を表示したいケースはどう出力するのか、今回は特定のキーワードでの記事リストを作ってみました。

タグやカテゴリーを利用せず、どうしてもキーワードを生かしたい場合や、キーワードで抽出せざるを得ない状況になった時には役立つかもしれないです。

まず知っておかなければならない事は、キーワードの欄に入力された値は、例え（,）カンマ区切りで入力しても、「キーワード1,キーワード2,キーワード3」がそれぞれ別のキーワードと認識されない事です。

タグの場合は、「タグ1」,「タグ2」,「タグ3」とカンマで区切られた前後の文字列は別のものと認識されますが、キーワードは、「キーワード1,キーワード2,キーワード3」とカンマを含めた全ての文字列がキーワードになります。

ちなみにこのブログでは、<meta name="keywords">にブログ記事のキーワードの値を使用しているので、キーワードを入力する際は、カンマ区切りで複数入力しています。

本題の特定のキーワードでブログ記事リストを作る方法ですが、

<MTEntries lastn="5">
<mt:if tag="EntryKeywords" like="キーワード名">
<a href="<MTEntryPermalink>"><$MTEntryTitle$></a>
</mt:If>
</MTEntries>

これで、「キーワード名」に一致するブログ記事の一覧が最新5件表示されます。

likeモディファイアを利用している理由は、eq="キーワード名"だと、完全一致になってしまうためです。
キーワードの欄に一つの単語のみ入力している場合は問題ありませんが、このブログの様に複数入力している場合は、完全一致で抽出すると、何も抽出されないケースが多いため、部分一致で抽出します。

また、複数のキーワードで記事リストを作成したい場合は、「|」で区切ります。

例えば、「人気商品」または「日本酒」のキーワードが入力されている記事をリストにしたい場合は、

<MTEntries lastn="5">
<mt:if tag="EntryKeywords" like="人気商品|日本酒">
<a href="<MTEntryPermalink>"><$MTEntryTitle$></a>
</mt:If>
</MTEntries>

となります。

訪問者の検索キーワードから、人気のキーワードで記事をピックアップしたい場合に、利用すると面白いかもしれないです。

tableのデザインを作るのが面倒で今まで放置してたのですが、このままではまずい・・・。と思い直して、やっと作りました。
MTの場合、ウィジェットでカレンダーを使っていると、そこにも影響したりするので手間が・・・。
その辺に落ちてるお手本をちょこちょこいじって出来上がりなtableデザインですが、だいぶ見やすくなりました。

というわけで、以前取り上げたMTのループで使える予約変数を表にしました。

MTの繰り返し処理で使える予約変数

name="○○○"	実行内容
>>MTテンプレートタグリファレンス（MTfor）
__first__	ループ処理の先頭の場合実行
__last__	ループ処理の最後の場合実行
__odd__	ループ処理の奇数回目の場合実行
__even__	ループ処理の偶数回目の場合実行
__index__	ループインデックスを格納
__counter__	ループ回数を格納

うん。だいぶ見やすいです。

CSSはこんな感じ

/*テーブル*/
table {
    border-spacing:1px;
    font-size:12px;
    background-color:#e7e7e7;
    color:#333;
    width:100%;
}
caption {
    font-weight:bold;
    border-bottom:2px solid #164B71;
    background:#5c8bad;
    color:#FFF;
    text-transform:uppercase;
    padding:8px;
}
tbody th a:link, tbody th a:visited{
    color:#96d030;
}
td, th {
    padding:5px 5px 5px 18px;
    line-height:1.5;
}
thead th {
    text-align:center;
    background:#f5f5f5;
    color:#666;
    border:1px solid #fff;
    text-transform:uppercase;
}
tbody th {
    font-weight:bold;
}
tbody tr {
    background-color:#fff;
    text-align:left;
}
tbody tr.odd {
    background:#f9f9f9;
    border-top:1px solid #fff;
}

tbody th a:hover {
    color:#ff8601;
}
tbody tr td {
    background:#fff;
    border:1px solid #fff;
}
tbody tr.odd td {
    background:#f9f9f9;
    border-top:1px solid #fff;
}
table td a:link, table td a:visited {
    color:#1975d7;
    text-decoration:none;
}
table td a:hover {
    color:#50adea;
    border-bottom:2px solid #8fd5ff;
    text-decoration:none ;
}
tfoot th, tfoot td {
    background-color:#e7e7e7;
    font-weight:bold;
    border-bottom:3px solid #ccc;
    border-top:1px solid #dfdfdf;
}
tfoot a{
    color:#666;
}

ソースは下記

    <table summary="MTの繰り返し処理で使える予約変数">
        <caption>MTの繰り返し処理で使える予約変数</caption>
        <thead>
            <tr>
                <th scope="col">name="○○○"</th>
                <th scope="col">実行内容</th>
            </tr>
        </thead>
        <tfoot>
            <tr>
                <th colspan="2" scope="row"><a href="http://www.movabletype.jp/documentation/appendices/tags/for.html" target="_brank">&gt;&gt;MTテンプレートタグリファレンス（MTfor）</a></th>
            </tr>
        </tfoot>
        <tbody>
            <tr>
                <th scope="row">__first__</th>
                <td>ループ処理の先頭の場合実行</td>
            </tr>
            <tr class="odd">
                <th scope="row">__last__</th>
                <td>ループ処理の最後の場合実行</td>
            </tr>
            <tr>
                <th scope="row">__odd__</th>
                <td>ループ処理の奇数回目の場合実行</td>
            </tr>
            <tr class="odd">
                <th scope="row">__even__</th>
                <td>ループ処理の偶数回目の場合実行</td>
            </tr>
            <tr>
                <th scope="row">__index__</th>
                <td>ループインデックスを格納</td>
            </tr>
            <tr class="odd">
                <th scope="row">__counter__</th>
                <td>ループ回数を格納</td>
            </tr>
        </tbody>
    </table>

見やすいって素晴らしい。

<MTIf>タグを使って、ファンクションタグの値と変数を比較することができます。
MTをカスタマイズする上では、多々お世話になるので、覚えておきたい使い方の一つです。

<mt:SetVarBlock name="foo">fooに入れる値</mt:SetVarBlock>
<mt:If tag="ファンクションタグ名" eq="$foo">
----処理内容----
</mt:If>

ここでの注意点は、「ファンクションタグ名の書き方」と「変数の書き方」です。
ファンクションタグが「<$MTEntryID$>」の場合、

<mt:SetVarBlock name="foo">fooに入れる値</mt:SetVarBlock>
<mt:If tag="EntryID" eq="$foo">
----処理内容----
</mt:If>

または、

<mt:SetVarBlock name="foo">fooに入れる値</mt:SetVarBlock>
<mt:If tag="MTEntryID" eq="$foo">
----処理内容----
</mt:If>

となります。
tagモディファイアにファンクションタグを利用する場合は「<、$、>」を記入しません。
変数の書き方の注意点は「eq="$foo"」の様に、fooの前に$を記入する事です。

MTのカスタマイズを始めた頃は、これがわからなくて随分悩まされました。
MTIfタグを使って、変数と変数の比較もできるので、いずれ変数同士の比較についても取り上げようと思います。

ソースコードを表示する際にとっても役立つJavaScriptを、やっと導入しました。
以前から自分のブログのソースコードは見辛いと分かっていたのに、なかなか改善しなかった・・・。

というわけで、SyntaxHighlighterを入れてみました。
だいぶすっきり。
ただ、う～～ん・・・CSSがちょっと気になる部分がいくつか、その辺もいずれちくちく直そうかな。

入れ方は簡単でした。

1.SyntaxHighlighterをダウンロード。

2.展開して「Scripts」フォルダと「Styles」フォルダをお好きな場所にアップロード。

3.下記を</body>前に入れる。

<script class="javascript" src="http://example.com/Scripts/shCore.js"></script>
<script class="javascript" src="http://example.com/Scripts/shBrushPhp.js"></script>
<script class="javascript" src="http://example.com/Scripts/shBrushXml.js"></script>
<script class="javascript" src="http://example.com/Scripts/shBrushCss.js"></script>
<script class="javascript" type="text/javascript">
dp.SyntaxHighlighter.ClipboardSwf = 'http://example.com/Scripts/clipboard.swf';
dp.SyntaxHighlighter.HighlightAll('code');  
</script>

上記の場合は「php」「html」「css」のコードが色分けされます。
その他のコードの色分けも用意されているので、この辺は使うものを好みで入れます。

4.<head>~</head>の間にスタイルシートへのリンクを入れる。

<link rel="stylesheet" href="http://example.com/styles/SyntaxHighlighter.css" type="text/css" />

以上で終了です。 あとは自分の好みにCSSをいじったり、ブログ等で取り上げるソースに合わせてリンクを張り替えればOK。

MTの記事リストを表示する際、「<mt:Entries>」などのブロックタグで囲った内容をループ処理させます。
その処理の奇数回目の処理と、偶数回目の処理を別ける変数を利用して、記事リストの背景を色分けします。

デフォルトの最近のブログ記事ウィジェットは

<mt:Entries lastn="10">
<mt:EntriesHeader>
<div class="widget-recent-entries widget-archives widget">
<h3 class="widget-header">最近のブログ記事</h3>
<div class="widget-content">
<ul>
</mt:EntriesHeader>
<li><a href="<$mt:EntryPermalink$>"><$mt:EntryTitle$></a></li>
<mt:EntriesFooter>
</ul>
</div>
</div>
</mt:EntriesFooter>
</mt:Entries>

となっています。
この「<li>」にclassを付けて、CSSで色分けします。

<mt:Entries lastn="10">
<mt:EntriesHeader>
<div class="widget-recent-entries widget-archives widget">
<h3 class="widget-header">最近のブログ記事</h3>
<div class="widget-content">
<ul>
</mt:EntriesHeader>
<li class="<mt:If name="__odd__">odd<mtElse>even</mtif>"><a href="<$mt:EntryPermalink$>"><$mt:EntryTitle$></a></li>
<mt:EntriesFooter>
</ul>
</div>
</div>
</mt:EntriesFooter>
</mt:Entries>

classに付ける値を「<mt:If name="__odd__">」で分岐させる事で、奇数回目の処理時に、class="odd"、偶数回目の処理時に、class="even"が付きます。
あとは、各classのCSSの背景などをいじって再構築すれば完了です。

この変数は、MTで使える予約変数で、その他にもいくつか種類があります。

MTの繰り返し処理で使える予約変数

name="○○○"	実行内容
>>MTテンプレートタグリファレンス（MTfor）
__first__	ループ処理の先頭の場合実行
__last__	ループ処理の最後の場合実行
__odd__	ループ処理の奇数回目の場合実行
__even__	ループ処理の偶数回目の場合実行
__index__	ループインデックスを格納
__counter__	ループ回数を格納

今回は、記事リストの表示の変え方を紹介しましたが、他にもループ処理中に最初だけ処理を変えたい場合や、奇数回目だけ処理を変えたい場合などに、使える変数なので、覚えておくと便利です。