タイトルをクリックして広げる

なMovable Type

　エイトコンのチケットでワタワタして少し落ち着こうと小粋空間さんでエントリされてた「概要と本文を切り替える（デフォルトテンプレート版）」を試してみることに。実はこれ、ずっと前からやりたかったんだよ。多分menufolder.js を利用するんだろうなと当たりはつけてたんやけど･･････如何せんどうタグを書けばいいのかさっぱりで（笑）。なので小粋空間さんがエントリしてくれて助かりました。見方はわかると思うけどタイトルをクリックするか[ all ]の文字をクリックすると全文が表示されます。

　詳しい方法は小粋空間さんを見ていただくとして。ただうちんところのタグと小粋空間さんのデフォルトのタグでちょっと違いがあったのでその部分だけ抜き出しておこうかなと。

　まずエントリータイトルタグ。


<h3 id="a<$MTEntryID pad="1"$>" class="entry-header"> <$MTEntryTitle$></h3>


　としていたのを小粋空間さんのものに変更。
　そして<MTEntryBody>も変更。


<div class="entry-body"><$MTEntryBody map="1"$></div>


　うちの場合、<MTEntryBody>にちょっとタグを増やしてdiv タグを閉じてたからこのタグも含めて移動。


<div class="entry-body">
<div id="content<$MTEntryID$>list2">
<p><$MTEntryExcerpt$> <a class="foldmark" href="./" onclick="FoldNavigation('content<$MTEntryID$>','chng',''); return(false);" onkeypress="FoldNavigation('idName', 'chng',''); return(false);" title="全部読む">[ all ]</a></p>
</div>
<div id="content<$MTEntryID$>list">
<$MTEntryBody map="1"$>


<!-- 追記 -->
<MTIfNonEmpty tag="EntryMore" convert_breaks="0">
<div id="Link<$MTEntryID$>" class="ajax-entry-more-link"><a href="<$MTEntryPermalink$>" name="<$MTEntryID pad="1"$>" onclick="ajaxShowHide('<$MTEntryID$>');return false;">Read More ≫</a></div>
<div id="Text<$MTEntryID$>" style="display: none">
<$MTEntryMore$>
<div class="ajax-entry-more-link"><a href="<$MTEntryPermalink$>" name="<$MTEntryID pad="1"$>" onclick="ajaxShowHide('<$MTEntryID$>');return false;">≪ Hide More</a></div>
</div>
</MTIfNonEmpty>
</div>
</div><!-- /entry-body -->


　最初</MTIfNonEmpty>の直下でdiv タグをひとつ閉じるの忘れてて過去のエントリが先細りして行くという怪現象が発生（笑）。単なるミスだったんやけど。んであとはScript タグを追加。とっても簡単に出来ましたわ。ありがとうございます、小粋空間様。