MovableType カテゴリ・月別アーカイブをINDEX表示する

ACOUSTIC : LATTE (初回盤) (CD+DVD)(音楽)ACOUSTIC LATTE - Every Little Thing

ちょっとBlogをカスタマイズ。
CMSという言葉を知って、MovableTypeのナビゲーションについて少し考えてみた。
Blogには情報が多すぎて、面白そうなページでも読みにくさをとても感じる。
どうすれば見やすくて使いやすいページになるか?これについてはおくが深そうだ。


カテゴリ・月別アーカイブを分割する


カテゴリを選択するとそのカテゴリの情報がすべて表示されてしまい、
ブラウザが固まってしまう(これはIEのせいじゃないかな?)ことがあるので、
カテゴリ表示・月別表示にページングを入れてみた。
(参考)小粋空間さん - カテゴリーアーカイブと月別アーカイブのページ分割

MT ExtensionsさんからMTPaginateというプラグインを取得し、これをPulginフォルダにアップロード。
そうすれば、ページングロジックを入れることができるので、
MTPaginateタグ内にMTEntriesタグを書いてあげるだけでいい。
#ようは、次の○件、前の○件を処理してくれる。

// ソース

<!-- メイン -->
<div id="main">
<div id="mainNavi">
<h2>
<span class="naviTitle">
<$MTCategoryDescription$>
</span>
<span class="naviInfo">

<!-- ページング部分 -->
<MTPaginate>
<MTPaginateIfMultiplePages>
<MTPaginateIfLastPage_>
<a href="<$MTPaginatePreviousPageLink$>">&lt;&lt;</a>
<$MTPaginateNavigator placement_all="after" separator=" | "
format_current="&lt;span class='currentPage'&gt;%d&lt;/span&gt;">
</MTPaginateIfLastPage_>
<MTPaginateIfMiddlePage_>
<a href="<$MTPaginatePreviousPageLink$>">&lt;&lt;</a>
<$MTPaginateNavigator placement_all="after" separator=" | "
format_current="&lt;span class='currentPage'&gt;%d&lt;/span&gt;">
<a href="<$MTPaginateNextPageLink$>">&gt;&gt;</a>
</MTPaginateIfMiddlePage_>
<MTPaginateIfFirstPage_>
<$MTPaginateNavigator placement_all="after" separator=" | "
format_current="&lt;span class='currentPage'&gt;%d&lt;/span&gt;">
<a href="<$MTPaginateNextPageLink$>">&gt;&gt;</a>
</MTPaginateIfFirstPage_>
</MTPaginateIfMultiplePages>
</span>
</h2>
</div>

<!-- エントリーズ -->
<div id="entrys">
<MTPaginateContent max_sections="30">
<MTEntries>
<$MTEntryTrackbackData$>
<!-- エントリー -->
<div class="entry">

// ■ ここにエントリーを記述

</div>
<!-- エントリーエンド -->
<$MTPaginateSectionBreak$>
</MTEntries>
</MTPaginateContent>
</MTPaginate>
</div>
<!-- エントリーズエンド -->

</div>
<!-- メインエンド -->

また、カテゴリ表示を一覧形式に変更することで、カテゴリの記事一覧をシンプルに表示できる。
カテゴリで表示してもエントリの内容までが表示されるため、読みたい記事まで
スクロールしなければならない。なので、タイトルだけを表示し見出しとしてカテゴリ名を
表示してみた。
このページ構成は月別アーカイブでも利用。

上のソース、■部分に以下のソースを記述するだけでいい。

// ソース

<a id="<$MTEntryID pad="1"$>"></a>
<div class="entryHead">
<h3>
<a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a>
<span class="categoryPostedInfo">
<MTDateHeader><$MTEntryDate format="%Y/%m/%d %H:%M"$></MTDateHeader>
</span>
</h3>

これで一覧のタイトル、日付だけを表示すると、「映画一覧」といった具合にINDEX表示できる。
はじめは記事の内容をちょこっと書き出しておこうかと思ったが、trim_toで文章の頭50文字表示。。。
とすると、タグの書かれたエントリーを中途半端に切り出してしまう。
私のページでは文章の頭にimgタグを利用しているため、タグが途中で切られてしまうと
デザインがくずれてしまうことが発覚した。(よってタイトルだけにした)

カテゴリ名を頭に表示するためには、カテゴリの説明文を利用している。
なんでDescriptionなんだろ?というのについては、dh's memorandaさんの

「カテゴリーに日本語を使う方法」
を参考のこと。
・00_laugh
・02_ithink
というようにして、カテゴリ名を数字にして自動的にMovableTypeがソート。。。
というカテゴリのソート順制御もついで利用。
(参考)ウェブログ活用フォーラムさん - カテゴリーを自分の並べたい順番にする

同じカテゴリのエントリ

| |コメント(0) | トラックバック(0)
trackback url:http://daipresents.com/mt/bin/mt-tb.cgi/390

トラックバック(0)

このブログ記事を参照しているブログ一覧: MovableType カテゴリ・月別アーカイブをINDEX表示する

コメントする(反映に時間がかかる場合があります)


画像の中に見える文字を入力してください。

賢者のコンテンツ

  • 働く(72)
  • 嫁(ベータ)(37)
  • 思い出し笑う(351)
  • 我思う(532)
  • 映画/ドラマ(155)
  • 読む/聴く(225)
  • 過去を語る(21)
  • 風景/場所(84)
  • プロフィール
 daipresents!! フジハラボ 藤原のpicasa