小粋空間  -  a cheap joke and a play on words site

概要と本文を切り替える（公開テンプレート版）

当サイトで利用している、トップページのエントリー概要とエントリー本文の表示を切り替えるカスタマイズです。

概要に本文の先頭から指定文字数を表示する設定になっている（=概要フィールドに何も書いていない）場合、デフォルトで概要を表示し、タイトルまたは概要の末尾にあるリンクをクリックすることで、ページ遷移をせずに全文を表示することができます。

サンプル

このエントリーでは公開テンプレートのトップページおよびカテゴリーアーカイブ／日付アーカイブに適用する例を紹介します。
なお先日紹介したデフォルトテンプレート版のカスタマイズ手順に一部誤りがありましたので修正しています（本エントリーは修正済）。

１．スクリプトのダウンロード・アップロード

下記のリンクより menufolder.js をダウンロード（本カスタマイズ用に機能追加しています）

download

ダウンロードしたスクリプトは、ブログの index.html と同じディレクトリにアップロードしてください。

２．script 要素の追加

カスタマイズを適用するテンプレートに下記の script 要素を追加。

<script type="text/javascript" src="<$MTBlogURL$>menufolder.js"></script>

３．エントリータイトルに折りたたみのリンクを与える

エントリータイトルのタグ

<h2 id="a<$MTEntryID pad="1"$>" class="entry-header"><a href="<$MTEntryPermalink$>"><$MTEntryTitle encode_html="1"$></a></h2>

を下記のように変更します。a 要素を削除して h2 の id 属性を書き換えます。

<h2 id="content<$MTEntryID$>name" class="entry-header"><$MTEntryTitle encode_html="1"$></h2>

４．概要を追加する

エントリーを表示するタグ

<!-- エントリー -->
<div class="entry-content">
   <$MTEntryBody$>
 
   <!-- 追記 -->
   <MTIfNonEmpty tag="EntryMore">
   <p class="entry-more"><a href="<$MTEntryPermalink$>#more">続きを読む "<$MTEntryTitle encode_html="1"$>"</a></p>
   </MTIfNonEmpty>

に対し、青色のタグを追加します。

<!-- エントリー -->
<div class="entry-content">
   <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$>
 
   <!-- 追記 -->
   <MTIfNonEmpty tag="EntryMore">
   <p class="entry-more"><a href="<$MTEntryPermalink$>#more">続きを読む "<$MTEntryTitle encode_html="1"$>"</a></p>
   </MTIfNonEmpty>
   </div>

また、MTEntries の終了タグ直前にスクリプト起動用の script 要素を追加します。

<script type="text/javascript">
//<![CDATA[ 
FoldNavigation('content<$MTEntryID$>','off',false);
//]]>
</script>
</MTEntries>

これでテンプレートを再構築すれば、概要と本文の切り替えができるようになります。

５．注意事項

概要の表示文字数より本文の文字数が少ないと効果ありません。