MTでウェブページを任意の順番に並べる

  • 投稿者:
  • カテゴリ:
このエントリーをはてなブックマークに追加

MovableType(以下 MT)のエントリー記事の並び順は日付けの新しいものからの降順ですが、これはウェブページでも同じです。ブログのエントリー記事はともかく、ウェブページは任意の順番で並べたい事が多いのではと思います。

コーポレートサイトなどでMTを使った場合、会社概要、代表あいさつ、アクセス、業務内容などはウェブページで作るのがオーソドックスな方法ではないでしょうか?

これらのウェブページはタイトルにリンクを張ってサイドバーに一覧表示させたり、グローバルナビゲーションのメニューとして使われたりすると思いますが、<mt:Pages>を使って一覧表示させると、作成日が新しい順にタイトルが並びます。

リスト表示させる基本的なテンプレートはこんな感じ
<ul>
<mt:Pages>
<li><a href="<$mt:PagePermalink$>"><$mt:PageTitle$></a></li>
</mt:Pages>
</ul>

ブログ記事とは違いウェブページは時系列で並べる必要性は少なく、コンテンツの重要度など表示させる順番はサイトの目的で変わってくることがほとんどだと思います。MTでウェブページを任意の順番で並ばせる方法は色々あると思いますが、大まかには下記の方法になると思います。

  1. MTAppjQueryを使って並び替える。→かたつむりさん経由で知った方法。自分では使ったことないです。
  2. 任意の並び順でHTMLソースをテンプレートに直に書いてしまう。新しいページの追加がないならこの方法もありだと思います。
  3. タイトルでソートすると希望する順番で並ぶように、タイトルの初めに任意の文字列を追加する。

などが、自分では思いつく方法です。カタツムリさん経由で知った方法は数日前に知ったものです。もし、この方法を知らなかったら、自分は3番目の方法を使うと思います。

3番目の方法でウェブページを並べ替える方法です。並べ替えるページは「連絡先」、「新しいウェブサイトへようこそ!」、「About」の3ページです。

MTでウェブページを任意の順番に並べる

管理画面のウェブページの一覧ページはこんな感じ。

MTでウェブページを任意の順番に並べる

キャプチャー画像のように各タイトルをHTMLタグ風の<abc10></abc10>、<abc20></abc20>、<abc30></abc30>でくくります。

MTでウェブページを任意の順番に並べる

そして次に、テンプレートを編集します。

こんなだったテンプレートを
<ul>
<mt:Pages>
<li><a href="<$mt:PagePermalink$>"><$mt:PageTitle$></a></li>
</mt:Pages>
</ul>
こんな風に変更します。 <ul>
<mt:Pages sort_by="title" sort_order="ascend">
<li><a href="<$mt:PagePermalink$>"><$mt:PageTitle remove_html="1"$></a></li>
</mt:Pages>
</ul>​
sort_by="title"でタイトルで並べ替えるようにして、sort_order="ascend"で昇順になるようにしてます。sort_order="ascend"をつけないと降順になるので数字の大きい順に並びます。MTタグのmt:PageTitleにモディファイア「remove_html="1"」を設定して、HTMLタグ風の「<abc10></abc10>」などを削除します。

これで、ウェブページを書き出す、またはサイトを再構築するとmt:PageTitleに設定したremove_htmlモディファイアによって、ウェブページのタイトルからHTMLタグ風の<abc10></abc10>、<abc20></abc20>、<abc30></abc30>は削除されて、「連絡先」、「新しいウェブサイトへようこそ!」、「About」と言う部分だけが残り書き出されます。

MTでウェブページを任意の順番に並べる

ここで数字を10、20としたのは、後々、新しくウェブページを作る際に、表示順を既存のウェブページの間に入れたくなった時、<abc15>新しいウェブページ</abc15>とすれば、「新しいウェブページ」は他のウェブページに修正を加えることなく、<abc10></abc10>と<abc20></abc20>の間に表示させることが出来ます。

ただ、この方法はある程度、仕組みを理解する必要があると思うので、ちょっと敷居が高いかなとも思っています。

MTで構築して納品して更新は納品先に任せるのであれば、視覚的に順番を並べ替えられるMTAppjQueryを利用した方法が1番いいかなと思います。

ちなみに、ウェブページではないですが、高田馬場グルメではカテゴリーの順番を制御するのにこの方法を使ってます。今のMTはカテゴリーの並び順を自由に出来ますが、以前は出来ませんでした。高田馬場グルメでは親カテゴリーである「店舗名で探す」「メニューで探す」「予算で探す」「住所で探す」の並び順は、このremove_htmlを使う方法で順番を並べ替えています。

このエントリーをはてなブックマークに追加