TopMovable Typeカスタマイズエントリー > エントリー・アーカイブで親カテゴリーに含まれる全エントリーをサブカテゴリー別に表示
2006年8月18日

エントリー・アーカイブで親カテゴリーに含まれる全エントリーをサブカテゴリー別に表示

Posted at August 18,2006 12:25 AM
Category:[エントリー, カテゴリー]
Tag:[, , , ]

エントリー・アーカイブで、親カテゴリーに含まれる全エントリーをサブカテゴリー別に表示するカスタマイズです。

タイトルから機能を理解して頂くのは困難と思いますので、とりあえずサンプルで説明します。
まず、下記のようなサブカテゴリーリストを仮定します。

 植物
  ├ バラ科
  │  ├ やまぶき
  │  └ ワレモコウ
  ├ ユリ科
  │  ├ チューリップ
  │  └ ヒアシンス
  └ ラン科
     ├ サギソウ
     └ カトレア

 昆虫
  ├ コガネムシ科
  │  ├ カブトムシ
  │  └ スジコガネ
  └ アガハチョウ科
     ├ キアゲハ
     └ アゲハ

このサブカテゴリーリストは次の規則にもとづいています。

  • メインカテゴリー:「植物」または「昆虫」
  • サブカテゴリー:科目
  • エントリー:科目に属する植物または昆虫の「和名」

この前提で、ブラウザに表示するエントリー・アーカイブが「チューリップ」である場合、エントリー・アーカイブには親カテゴリー(植物)が属するすべてのエントリーをサブカテゴリー別に表示、つまり、

 植物
  ├ バラ科
  │  ├ やまぶき
  │  └ ワレモコウ
  ├ ユリ科
  │  ├ チューリップ
  │  └ ヒアシンス
  └ ラン科
     ├ サギソウ
     └ カトレア

を表示するというものです。

以下に、公開テンプレートを使ったサンプルを作ってみました。

サンプル

エントリー・アーカイブの左上に表示されている「親カテゴリーに属する全カテゴリー」が今回紹介するリストです。

エントリー・アーカイブに同一カテゴリーのエントリーを表示する方法は「個別エントリーアーカイブに同一カテゴリーのエントリーを表示」で紹介している通り、よく知られているテクニックですが、エントリーをカテゴリー別に表示したり、同じ親カテゴリーのエントリーを表示する方法は知られていません。

ただしこのカスタマイズには下記の制約があります。

  • 親カテゴリー(「植物」や「昆虫」)にエントリーが存在しないこと。
  • サブカテゴリーの下にサブカテゴリーが存在しない(「バラ科」の下に「サクラ属」というサブカテゴリーが存在しない)こと。

上記のリストを表示するMTタグです。

<MTParentCategory><MTSubCategories include_current="1">
<MTSubCatIsFirst><ul></MTSubCatIsFirst><MTIfNonZero tag="MTCategoryCount"><li><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><$MTCategoryLabel$></a>
<MTEntries><MTEntriesHeader><ul></MTEntriesHeader><li><a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a></li><MTEntriesFooter></ul></MTEntriesFooter></MTEntries><MTElse><li><$MTCategoryLabel$></MTElse></MTIfNonZero><MTSubCatsRecurse max_depth="3"></li><MTSubCatIsLast></ul></MTSubCatIsLast>
</MTSubCategories></MTParentCategory>

ツリー化するには、maketree.js を利用して、下記の青色部分を追加します。

<div class="side">
<div id="parentCategoryEntries">
<MTParentCategory><MTSubCategories include_current="1">
<MTSubCatIsFirst><ul></MTSubCatIsFirst><MTIfNonZero tag="MTCategoryCount"><li><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><$MTCategoryLabel$></a>
<MTEntries><MTEntriesHeader><ul></MTEntriesHeader><li><a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a></li><MTEntriesFooter></ul></MTEntriesFooter></MTEntries><MTElse><li><$MTCategoryLabel$></MTElse></MTIfNonZero><MTSubCatsRecurse max_depth="3"></li><MTSubCatIsLast></ul></MTSubCatIsLast>
</MTSubCategories></MTParentCategory>
</div>
</div>
 
<script type="text/javascript">
generateTreeForTreeStructure('parentCategoryEntries');
</script>

CSSは下記です。

ul.tree {
    margin: 0px!important;
    padding: 0px!important;
    font-size: 9px;
    list-style: none!important;
}
ul.tree ul {
    margin-left: 10px;
    padding: 0!important;
}
ul.tree li {
    margin: 0;
    padding: 0;
    background: none;
    list-style: none!important;
}
ul.tree li ul li {
    margin: 0 0 0 10px;
    padding-left: 13px;
    background-image: url(tree_lst.gif);
    background-repeat: no-repeat;
    list-style: none;
}
ul.tree li ul li.end {
    background-image: url(tree_end.gif);
    list-style: none;
}

このカスタマイズはカテゴリー・アーカイブに適用した場合も同様の動作をします。

Posted by yujiro   このページの先頭に戻る
関連記事
この記事を読んだ人はこんな記事も読んでいます
人気エントリー
Hatena Hot Entries
Hatena Entries
トラックバックURL


トラックバック

MovableTypeでYouTubeの動画を簡単にUPする方法 from nogute.com
YouTubeの動画をBlogで良く見かけるようになりました。 興味ある動画は自... [続きを読む]

Tracked on January 22, 2007 7:39 PM
コメント

こんにちわ、いつも参考にさせて頂いております。

サブカテゴリーについてご質問させて頂きたく思います。

環境はmovabletype4.01になります。


現在アーカイブテンプレートを新規に作り、カテゴリーページ(親カテゴリーの先のページ)を作成しているのですが、そのカテゴリーページに、定義リストを使い、下記の様にサブタイトルとサブタイトルに属するエントリーの一覧を表示したいのです。


--------------------------------------------------------------------------------
親カテゴリー1のページ とします。 ↓↓↓
--------------------------------------------------------------------------------

【サブカテゴリー①のタイトル(親カテゴリー1に属する)】
サブカテゴリー①に属するエントリータイトルⅠ
サブカテゴリー①に属するエントリータイトルⅡ
サブカテゴリー①に属するエントリータイトルⅢ
               ・
               ・
               ・

【サブカテゴリー②のタイトル(親カテゴリー1に属する)】
サブカテゴリー①に属するエントリータイトルⅠ
サブカテゴリー①に属するエントリータイトルⅡ
サブカテゴリー①に属するエントリータイトルⅢ
               ・
               ・
               ・

※エントリータイトルは全てリンクするつもりです。

-------------------------------------------------------------------------------

基本となるXHTMLは下記のような感じでいこうと思っています。

<div class="date-news-waku">

 <div><!-- 左枠 -->
 <img src="左枠のイメージ画像.jpg" width="65" height="60" />
 </div>

 <div><!-- 右枠 -->
  <dl>
   <dt>サブカテゴリー1タイトル</dt>
   <dd>サブカテゴリー1の記事Ⅰ</dd>
   <dd>サブカテゴリー1の記事Ⅱ</dd>
   <dd>サブカテゴリー1の記事Ⅲ</dd>
  </dl>
 </div>

</div>

----------------------------------------------------------------------------------

以上になります。

ちなみに、エントリー(記事)は全てサブカテゴリーのどれかに属させる予定です。


お忙しい中申し訳ございませんが、ご指導ご鞭撻宜しくお願い致します。

[1] Posted by peko : December 1, 2007 5:14 PM

>pekoさん
こんばんは。
ご質問の件で確認ですが、何点か確認させてください。

1.親カテゴリーにはエントリーはありますでしょうか。
親カテゴリーにエントリーがない場合、その親カテゴリーのページが存在しないので、親カテゴリーにダミーのエントリーを作成する必要があります。

2.上のご要望で、「サブカテゴリー②のタイトル」の下に「サブカテゴリー①に属する~」とありますが、①は正しくは②でしょうか。

3.サブカテゴリーの階層は2階層、つまり

  親カテゴリー - サブカテゴリー

であって、

  親カテゴリー - サブカテゴリー - サブカテゴリー

という3階層はないという認識でよろしいでしょうか。

それではよろしくお願いいたします。

[2] Posted by yujiro logo : December 2, 2007 10:01 PM

yujiroさん>

ご返信ありがとうございます。

1、 今の所、またこれからも全てサブカテゴリーに割り振りしていく予定です。※今あるエントリーは全てサブカテゴリーに属しています。 (親カテゴリー>>サブカテゴリー という感じです。)
ダミーのエントリーはどんな記事でも大丈夫でしょうか?

2、申し訳ないです!yujiroさんのおっしゃるとおり、正しくは2です!

3、はい。サブカテゴリーの階層は全て2階層(目)でいきます。3階層には各エントリーという風にしようと思います。

わかりにくくて申し訳ございません。。

それでは宜しくお願い致します。

[3] Posted by peko : December 2, 2007 11:59 PM

※すみません、追記させてください。

今の所、親カテゴリーには、どのエントリー属させないつもりですが、
今後、属させる記事も出てくるかもしれません。

それでは、ご指導ご鞭撻お願いいたします。

[4] Posted by peko : December 4, 2007 1:29 PM

>pekoさん
こんにちは。
ご連絡ありがとうございます。
ちなみに、親カテゴリーにダミー(空)のエントリーを投稿した場合、親カテゴリーのページ本文は空白になります(サイドバーにご要望のリストは表示されます)が大丈夫でしょうか。
それではよろしくお願い致します。

[5] Posted by yujiro logo : December 4, 2007 2:22 PM

yujiro様
お忙しい中返信ありがとうございます。親カテゴリーのページ本文が空白になってしまうとの事ですが、下記のようにする上で問題はありますか?

(私の場合ですが)左160pxを親カテゴリーリストとして表示し、それより右側をメインコンテンツにしようと考えているのですが、そのメインコンテンツの部分に今回お願いしていますリストを表示したいと思っています。

※具体的には下記のようなサイトをイメージしています

http://www.mdn.co.jp/content/blank/17/35/

第◯回と表示されているのがサブカテゴリーで、
その下の第◯話というのが、そのサブカテゴリーに属するエントリーというような感じです。

すみませんが宜しくお願い致します。

※まだまだ未熟な私が考えてやっておりますので、もしこのやり方をするよりも他に良い方法がありましたら是非ご指導宜しくお願い致します。

[6] Posted by peko : December 4, 2007 11:26 PM

>pekoさん
こんにちは。
ご連絡遅くなってすいません。
下記のタグでお試し頂けますでしょうか。

<MTTopLevelCategories>
<MTSubCatIsFirst><dl></MTSubCatIsFirst>
   <MTIfNonZero tag="MTCategoryCount">
   <dt><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryDescription$>"><MTCategoryLabel></a></dt>
     <MTEntries><dd><a href="<$MTEntryPermalink$>"><$MTEntryTitle encode_html="1"$></a></dd></MTEntries>
   <MTElse>
   <dt><MTCategoryLabel></dt>
   </MTElse>
   </MTIfNonZero>
   <MTSubCatsRecurse>
<MTSubCatIsLast></dl></MTSubCatIsLast>
</MTTopLevelCategories>

div 要素は付与していないので、このタグの外側に付与してください。
それではよろしくお願い致します。

[7] Posted by yujiro logo : December 12, 2007 3:09 PM

親カテゴリー下のエントリーも表示するようにはできないでしょうか?

[8] Posted by   : February 21, 2008 7:50 PM

自己解決しました。失礼しました。

[9] Posted by 8 : February 23, 2008 10:19 AM

>8さん
こんばんは。
ご返事おそくなりすいません。
ご質問の件、自己解決されたようで良かったです。
できれば解決された内容をコメントでご連絡頂けないでしょうか。
それではよろしくお願い致します。

[10] Posted by yujiro logo : February 24, 2008 1:08 AM

はじめまして、hudouと申します。

Template Type layout-three-column 4.2用
並びにカスタマイズ等でいつもお世話になっております。

早速ですがお聞きしたい事がありまして、ご連絡させて頂きました。

現在の仕様環境は
Movable Type 4.261
サーバ さくらインターネット スタンダード
拡張子HTMLのままでPHP化にしております。

サイドメニューは、こちらのサブカテゴリーリストの折りたたみ+ツリー化(JavaScript不要)を使わせて頂いております。

そこで、お聞きしたい事といいますのが
サイドメニュー(カテゴリ)のカテゴリをクリックして表示されるページで
エントリーのタイトルリストだけを表示させたいと思いましてあれこれ試したのですが、思う結果になりません。

具体的に説明しますと(例えば)
サイドメニュー(カテゴリ)

・ムーバブルタイプ [6] ▼
  ・バージョン3.2 [1]
  ・バージョン4.1 [1]
  ・バージョン4.2 [2]
  ・バージョン5.0 [2]
・SEO [6] ▼
  ・外部要因 [2]
  ・内部要因 [2]
  ・キーワード [2]

上記の時に、親カテゴリ「ムーバブルタイプ」に「バージョン*.*」として4つのサブカテゴリがあります。
各サブカテゴリ1つや2つのエントリーがありますので、その合計6コのエントリー数が、親カテゴリの[6]という表示になっております。

この時に、親カテゴリの「ムーバブルタイプ」をクリックした時に表示されたページ(エントリーアーカイブ)←表現が間違っていたらすいません。
その部分に、エントリーの記事が6コ表示されるのでは無く、属するサブカテゴリ名とエントリーのタイトルだけをリスト表示させたいのです。
同じように、サブカテゴリ「バージョン*.*」をクリックして表示させたページでは、そのサブカテゴリ名とエントリーの数だけを同じくそのエントリーのタイトルだけを表示させたいと考えております。

ちなみに、「OGAWA」さまのEntryCategoryEntriesプラグインを使いまして実現出来るのではと思いまして試したのですが
個別のエントリーページでは、思うような表示になりましたが、目的の上記しておりますページでは、思う表示になりません。
どのような表示になるかといいますと

親カテゴリ「ムーバブルタイプ」をクリックしますと

「バージョン5.0」カテゴリのリスト
 ・******************************
 ・******************************

「バージョン3.2」カテゴリのリスト
 ・******************************

「バージョン4.2」カテゴリのリスト
 ・******************************
 ・******************************

「バージョン4.1」カテゴリのリスト
 ・******************************

「バージョン4.2」カテゴリのリスト
 ・******************************
 ・******************************

「バージョン5.0」カテゴリのリスト
 ・******************************
 ・******************************

というように、サブカテゴリのエントリー数が2つ以上あるとリストも重複してエントリー数だけ出てしまいます。
それと並び順も新しいものがリストごと上位に表示されてしまいます。
リスト順は、サイドメニューの並び通りの表示にしたいのです。

記述は、管理画面の「デザイン」→「テンプレート」→「アーカイブテンプレート」の「ブログ記事リスト」

***** 以下の「--------」の部分を色々変えてみました。********

<mt:if name="datebased_archive">
<mt:entries>
<mt:entryTrackbackData />
<mt:include module="ブログ記事の概要" />
</mt:entries>
<mt:else>
-------------ここから-------------------------------
<mt:entriesWithSubCategories limit="auto">
<mt:entryTrackbackData />
<mt:include module="ブログ記事の概要" />
</mt:entriesWithSubCategories>
-------------ここまで-------------------------------
</mt:if>

************************************************************

お忙しい中で、大変申し訳ございませんが
何卒、ご教示のほど宜しくお願い申し上げます。

[11] Posted by hudou : December 29, 2009 1:12 AM

>hudouさん
こんにちは。
ご返事遅くなってすいません。
ご質問は以下の通りと理解しました。

  • 親カテゴリ(ブログ記事なし)のページに、子カテゴリのカテゴリ名とブログ記事タイトル一覧を表示
  • 子カテゴリのページに、自カテゴリ名とブログ記事タイトル一覧を表示

下記のテンプレートをカテゴリアーカイブ用のテンプレートに貼り付けてお試しください。

<mt:HasNoParentCategory>
  <mt:SubCategories>
<ul>
  <li>カテゴリ:<a href="<$mt:CategoryArchiveLink$>"><mt:CategoryLabel /></a></li>
    <ul>
    <mt:EntriesWithSubCategories>
      <li><a href="<mt:EntryPermalink />"><mt:EntryTitle /></a></li>
    </mt:EntriesWithSubCategories>
    </ul>
  </li>
</ul>
  </mt:SubCategories>
<mt:Else>
<ul>
  <li>カテゴリ:<a href="<$mt:CategoryArchiveLink$>"><mt:CategoryLabel /></a></li>
    <ul>
  <mt:Entries>
       <li><a href="<mt:EntryPermalink />"><mt:EntryTitle /></a></li>
  </mt:Entries>
    </ul>
  </li>
</ul>
</mt:HasNoParentCategory>

なお、カテゴリの階層は親と子のみで、3階層は考慮していません。
それではよろしくお願い致します。

[12] Posted by yujiro logo : January 5, 2010 12:29 PM

> yujiroさん

ご多忙の中、ご回答頂きましてありがとうございます。

その後、色々試して来ましたが昨夜からあと一歩で解決出来るところまできておりました。

そこで本日お昼過ぎにご回答のコメントを頂いておりましたので提示して頂いたものを貼り付けてみたのですが、やはり質問時の状態で試しておりました結果と同じものとなっておるようです。

サブカテゴリタイトルが重複してしまう状態となっております。

とりあえず、昨夜からあと一歩まで来ておりましたやり方で頑張ってみます。

どうしても解決が困難の時には、再度質問のコメントをさせて頂きます。

お忙しい中、本当にありがとうございます。

[13] Posted by hudou : January 5, 2010 6:21 PM
コメントする
greeting

*必須

*必須(非表示)


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

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

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

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

Now loading...
Introduction
Entry Trackbacks
Entries of this Category
Recent Entries
Recent Comments
Recent Trackbacks
QRcode

現在停止中です
携帯電話からこのQRcodeを撮影することで携帯用URLを取得することができます

URI for cellular phones
ギターに入った猫
Styles
Font Size
Default
For defective color vision
Gray Scale
RGB Color
Search this site

このブログをメールで購読する by:FeedBurner

loading ...
Categories
Monthly Archives
BlogPeople
Syndicate this site
FeedBurner(RSS1.0/RSS2.0/Atom)
Counter
これまでのアクセス
クリエイティブ・コモンズ・ライセンス
Powered by
Movable Type 5.12