4*9=89

//
// 記事の折りたたみを制御する
// textcollapse.js ver 0.1
//

// 折りたたみ対象部分のコンテナになるtag
// 注）'div'以外で動作するかは未検証
gTextCollapseTagName = 'div';
// 折りたたみ対象部分のclass名
gTextCollapseClassName = 'TextCollapse';
// 折りたたみを切替えるスイッチ（ラベル）部のclass名
gTextCollapseSw1ClassName = 'TextCollapseLabel'; // 上部
gTextCollapseSw2ClassName = 'TextCollapseLabel'; // 下部
// 折りたたみを切替えるスイッチ（ラベル）部のid名のプレフィックス
gTextCollapseSw1IdPrefix = 'TextCollapseSW1'; // 上部
gTextCollapseSw2IdPrefix = 'TextCollapseSW2'; // 下部
// 折りたたみ部のclass名
gTextCollapseBodyClassName = 'TextCollapseBody';
// 折りたたみ部のid名のプレフィックス
gTextCollapseBodyIdPrefix = 'TextCollapseBody';
// 折りたたみを切替えるスイッチ（ラベル）の表示位置
// 0:上部のみ 1:下部のみ 2:上部下部両方
gTextCollapseSwPosition = 2;
// 折りたたみを切替えるスイッチのテキスト
gTextCollapseExpand = '[詳細を表示]';
gTextCollapseCollapse = '[詳細を隠す]';

//--------------------------------------
// 展開リンク組み立て
//--------------------------------------
function makeTextExpandLink( idNum )
{
return ( '<a href="' + gTextCollapseExpand + '" ' +
'onclick="return( SwitchTextCollapse(' + idNum + ') );" ' +
'onkeypress="return( SwitchTextCollapse(' + idNum + ') );">' +
gTextCollapseExpand + '</a></span>' );
}

//--------------------------------------
// 折りたたみリンク組み立て
//--------------------------------------
function makeTextCollapseLink( idNum )
{
return ( '<a href="' + gTextCollapseCollapse + '" ' +
'onclick="return( SwitchTextCollapse(' + idNum + ') );" ' +
'onkeypress="return( SwitchTextCollapse(' + idNum + ') );">' +
gTextCollapseCollapse + '</a></span>' );
}

//--------------------------------------
// 折りたたみの初期化
//--------------------------------------
function initTextCollapse()
{
var tagObjs = this.document.getElementsByTagName( gTextCollapseTagName );
var sw1Text = ''
var sw2Text = ''
var bdyText = ''

for ( var i = 0; i < tagObjs.length; i++ )
{
if ( tagObjs[i].className == gTextCollapseClassName )
{
bdyText = tagObjs[i].innerHTML.replace(/^<br>/ig, '' );
bdyText = bdyText.replace(/^<br \/>/ig, '' );
bdyText = bdyText.replace(/\r\n$/ig, '' );
bdyText = bdyText.replace(/\r$/ig, '' );
bdyText = bdyText.replace(/\n$/ig, '' );
bdyText = bdyText.replace(/<br>$/ig, '' );
bdyText = bdyText.replace(/<br \/>$/ig, '' );

sw1Text = '<span id="' + gTextCollapseSw1IdPrefix + i + '" ' +
'class="' + gTextCollapseSw1ClassName + '">' +
makeTextExpandLink ( i ) + '</span>';

if ( gTextCollapseSwPosition > 0 )
{
sw2Text = '<span id="' + gTextCollapseSw2IdPrefix + i + '" ' +
'class="' + gTextCollapseSw2ClassName + '">' +
makeTextCollapseLink ( i ) + '</span>';
}

tagObjs[i].innerHTML = sw1Text +
'<div id="' + gTextCollapseBodyIdPrefix + i + '" ' +
'class="' + gTextCollapseBodyClassName + '">' +
bdyText + '</div>' + sw2Text;

document.getElementById( gTextCollapseBodyIdPrefix + i ).style.display = "none";
if ( gTextCollapseSwPosition > 0 )
{
document.getElementById( gTextCollapseSw2IdPrefix + i ).style.display = "none";
}
}
}
}

//--------------------------------------
// 折りたたみ／展開の切替え
//--------------------------------------
function SwitchTextCollapse( idNum )
{
var objSW1 = document.getElementById( gTextCollapseSw1IdPrefix + idNum );
var objSW2 = document.getElementById( gTextCollapseSw2IdPrefix + idNum );
var objBody = document.getElementById( gTextCollapseBodyIdPrefix + idNum );

if ( objBody )
{
if ( objBody.style.display == 'none' )
{
if ( objSW1 )
{
if ( gTextCollapseSwPosition == 1 )
{
objSW1.style.display = "none";
}
else
{
objSW1.innerHTML = makeTextCollapseLink ( idNum );
}
}

objBody.style.display = "block";

if ( objSW2 )
{
objSW2.style.display = "block";
}
}
else
{
if ( objSW1 )
{
if ( gTextCollapseSwPosition == 1 )
{
objSW1.style.display = "block";
}
else
{
objSW1.innerHTML = makeTextExpandLink ( idNum );
}
}

objBody.style.display = "none";

if ( objSW2 )
{
objSW2.style.display = "none";
}
}
}

return false;
}

1. 上記JavaScriptを"textcollapse.js"として、サーバのMovableTypeディレクトリにアップする。


2. テンプレートを編集し、折りたたみを有効にする。
   対象のテンプレートは以下など、<$MTEntryBody$>を含むもの。
   　メイン・メニュー > (BLOG名) > テンプレート > メインページ
   　メイン・メニュー > (BLOG名) > テンプレート > アーカイブページ
   　メイン・メニュー > (BLOG名) > テンプレート > 日付アーカイブ
   
   
   
   • テンプレートのHTMLヘッダ部分（<head>～</head>の間）に以下を挿入。
     

     
     <script type="text/javascript" language="JavaScript" src="<$MTBlogURL$>textcollapse.js"></script>
     

   
   
   • テンプレートの末尾あたり（エントリよりも確実に下になる部分）に以下を挿入。
     

     
     <script type="text/javascript">
     <!--
     initTextCollapse();
     // -->
     </script>