折りたたみ式追記

going mame way : 追記部分とコメントTIPS

1ページにEntryを複数表示させる場合、長文だとどうしてもページ全体が文字ばかりになってしまい、読む気も失せるし見た目もよろしくない。 だからExtended(追記)の部分に続きを書いて<MTEntryIfExtended>で続きが読めるようにしてたんですが、これだとPermalinkに飛んでしまうので、また戻ったりしないといけなくなる。 どうしようかと思いながら海外のBLOGサイトを見ていると、Scriptygoddess: Collapsing entries AND COMMENTSというものを発見しました。

上記サイトで説明されているように手順としては、Main Indexテンプレートの下のほうにでも下記のJavaScriptを追加。

<script language="javascript">
function showMore(varA1, varB1){
var123 = ('varXYZ' + (varA1));
varABC = ('varP' + (varA1));
if( document.getElementById ) {
if( document.getElementById(var123).style.display ) {
if( varB1 != 0 ) {
document.getElementById(var123).style.display = "block";
document.getElementById(varABC).style.display = "none";
} else { document.getElementById(var123).style.display = "none";
document.getElementById(varABC).style.display = "block"; }
} else { location.href = varB1;
return true; }
} else { location.href = varB1;
return true; }
}
</script>

<$MTEntryIfExtended$>から</$MTEntryIfExtended$>の間を下記の様に修正。

<MTEntryIfExtended>
<div id="varP<$MTEntryID$>">
<a title="続きを読む" href="<$MTEntryLink$>#<$MTEntryID pad="1"$>" onclick="showMore(<$MTEntryID$>,'<$MTEntryLink$>#a<$MTEntryID pad="1"$>');return false;">続きを読む</a>
</div>
<div id="varXYZ<$MTEntryID$>" style="display: none">
<a title="続きを隠す" href="#a<$MTEntryID pad="1"$>" onclick="showMore(<$MTEntryID$>,0);return true;">追記を隠す</a>
<$MTEntryMore$>
<a title="続きを隠す" href="#a<$MTEntryID pad="1"$>" onclick="showMore(<$MTEntryID$>,0);return true;">追記を隠す</a></div>
</MTEntryIfExtended>

JavaScript未対応ブラウザでもそれなりに表示できるように工夫されているのがすばらしいな。