カテゴリーリストにエントリータイトルを表示する

カテゴリーリストにエントリータイトルを表示する

Posted at July 25,2007 1:37 AM
Tag:[Category, Customize, Entry, MovableType]

Movable Type のカテゴリーリストにエントリータイトルを表示するカスタマイズです。

オーソドックスなカスタマイズですが、MT をブログとして用いるのではなく、投稿するエントリー数がある程度決まっていて、それらを更新するというスタイルで使う場合、カテゴリーリストをメニューリストとして代用することができ、非常に有効な方法です。

1.デフォルトテンプレートの場合

カテゴリーリストに青色の部分を追加してください。

<MTIfArchiveTypeEnabled archive_type="Category"><div class="module-categories module">
   <h2 class="module-header">カテゴリー</h2>
   <div class="module-content">
   <MTTopLevelCategories>
   <MTSubCatIsFirst><ul class="module-list"></MTSubCatIsFirst>
      <MTIfNonZero tag="MTCategoryCount">
      <li class="module-list-item"><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><MTCategoryLabel></a>
        <ul class="module-list"><MTEntries><li class="module-list-item"><a href="<$MTEntryPermalink$>"><$MTEntryTitle encode_html="1"$></a></li></MTEntries></ul>
      <MTElse>
      <li class="module-list-item"><MTCategoryLabel>
      </MTElse>
      </MTIfNonZero>
         <MTSubCatsRecurse>
      </li>
   <MTSubCatIsLast></ul></MTSubCatIsLast>
   </MTTopLevelCategories>
   </div>
</div>
</MTIfArchiveTypeEnabled>

2.公開テンプレートの場合

カテゴリーリストに青色の部分を追加してください。サンプルは XHTML 1.0 Strict 版を使っていますが、それ以外のものでも追加位置と追加内容は同じです。

<MTIfArchiveTypeEnabled archive_type="Category">
<dt class="sidetitle">
Categories
</dt>
 
<dd class="side">
<div id="categories">
<MTSubCategories>
<MTSubCatIsFirst><ul></MTSubCatIsFirst>
<MTIfNonZero tag="MTCategoryCount">
<li><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><MTCategoryLabel></a> [<$MTCategoryCount$>]
<ul><MTEntries><li><a href="<$MTEntryPermalink$>"><$MTEntryTitle encode_html="1"$></a></li></MTEntries></ul>
<MTElse>
<li><MTCategoryLabel>
</MTElse>
</MTIfNonZero>
<MTSubCatsRecurse max_depth="3">
</li>
<MTSubCatIsLast></ul></MTSubCatIsLast>
</MTSubCategories>
</div>
</dd>
</MTIfArchiveTypeEnabled>
関連記事
トラックバックURL


トラックバック

ブログを少しリニューアル from うさぎ四姉妹日記
今日はかなりの暑さだった。午後に出かけたが、立っているだけで疲れが出てくる有様... [続きを読む]

Tracked on July 29, 2007 1:48 AM
コメント

こんばんは。
以前こちらの記事を使ってカテゴリーのページを作らせていただきましたが、
IE7に変えてから各カテゴリーにトップのタイトルだけCSSが効いていません。
IE6とFireFoxでは問題なく表示されていますが。IE7特有のバグなのでしょうか?
また、お時間のあるときで結構ですので、よかったら対策など教えていただけないでしょうか?

※カテゴリーのページはこちらです。

[1] Posted by ヨンシマイ logo : January 31, 2008 11:47 PM

いつもお世話になっています。

貴著の「カテゴリーリストにブログ記事タイトルを表示する」を使ってみたのですが、カテゴリー名とブログ記事に同一のcircleが表示されて少々見難いと思っています。カテゴリー名にarrow.gifを使い、タイトルはcircleを使う場合の設定方法を教えていただくと助かります。

#Toppageのリサイザーをクリックすると、一瞬表示はされるのですが、すぐにファイルが無いと蹴られてしまいます。IE7のせいでしょうか。

[2] Posted by mdot : February 5, 2008 9:57 AM

>ヨンシマイさん
こんばんは。
ご質問の件ですが、すぐには原因が分かりません。
申し訳ありません。

>mdotさん
こんばんは。
ご質問の件ですが、サブカテゴリーリストのCSSを下記に入れ替えてください。arrow.pngのパスは適宜書き換えてください。

/* サイドメニュー(サブカテゴリー用) */
.side #categories ul {
    padding-left: 0;
}
.side #categories ul ul {
    padding-left: 10px;
}
.side #categories li {
    padding-left: 16px;
    list-style: none;
    background: url(arrow.png) no-repeat 0 0.3em;
}
.side #categories li li {
    background: none;
    padding-left: 0;
    list-style-type:disc;
}

また、Column Resizer は申し訳ありませんがFirefoxでご利用ください(IEの不具合が対応できておりません)。
それではよろしくお願い致します。

[3] Posted by yujiro logo : February 7, 2008 12:08 AM

yujiroさん、どうもありがとうございます。

見よう見まねで、カテゴリーにcircle、タイトルにdiscを表示できたので、
まあ、これで良いかと思っていましたが、折角なので実行しました。
#大分見られるものとなってきました。

いつもありがとうございます。

次にScodeプラグインに関する質問をさせていただきます。(^^;)

[4] Posted by mdot : February 9, 2008 10:56 AM

>mdotさん
こんばんは。
ご連絡ありがとうございました。
うまくできたようで良かったです。
ではでは!

[5] Posted by yujiro logo : February 12, 2008 2:11 AM

yujiroさん、お返事ありがとうございました!
対策の方は、もうあきらめました。
実はカテゴリーのページをやめまして、
妻のブログを替わりにナビゲーションに配置しました。
お手数かけました。お時間をとっていただき感謝しています。

[6] Posted by ヨンシマイ logo : February 13, 2008 2:24 AM

>ヨンシマイさん
こんばんは。
ご連絡ありがとうございました。
お役に立てず申し訳ありません。
ではでは!

[7] Posted by yujiro logo : February 14, 2008 11:43 PM
コメントする
greeting

*必須

*必須(非表示)


ご質問のコメントの回答については、内容あるいは多忙の場合、1週間以上かかる場合があります。また、すべてのご質問にはお答えできない可能性があります。予めご了承ください。

太字イタリックアンダーラインハイパーリンク引用
[サインインしない場合はここにCAPTCHAを表示します]

コメント投稿後にScript Errorや500エラーが表示された場合は、すぐに再送信せず、ブラウザの「戻る」ボタンで一旦エントリーのページに戻り(プレビュー画面で投稿した場合は、投稿内容をマウスコピーしてからエントリーのページに戻り)、ブラウザをリロードして投稿コメントが反映されていることを確認してください。

コメント欄に(X)HTMLタグやMTタグを記述される場合、「<」は「&lt;」、「>」は「&gt;」と入力してください。例えば「<$MTBlogURL$>」は「&lt;$MTBlogURL$&gt;」となります(全て半角文字)