TopMovable Typeカスタマイズ折りたたみ追記 > 2004年11月
2004年11月 2日

個別アーカイブに「続きを読む」を導入

エントリー・アーカイブに適用される場合はエントリー・アーカイブの追記文章の折りたたみ(改)を参照ください。

デフォルトテンプレートではメインページは追記部分がリンクで隠されており、他のアーカイブページでは追記を含めて全てを一斉に表示するようになってます。
このサイトでは途中からダジャレのオチを追記に隠すよう各アーカイブページを変更したのですが、修正もれで個別アーカイブにジャンプするとネタが最初から見えてしまっていたので(笑)、こちらも追記を隠すように変更しました。

ということで以下、メインページ以外のアーカイブページで追記を隠すように修正する手順を記します。
なおデフォルト状態でメインページにある「続きを読む」をクリックするとPermalink(デフォルトの設定であれば個別アーカイブ)へジャンプします。これは他のアーカイブページが追記を含め一括表示されることが前提になっているからです。
実は個別アーカイブページ以外の修正方法は以前こちらの記事に記していたのですが、まとめて修正できるよう再掲しておきます。テンプレートの名称は3.11ベースで書いてますので3.01の場合は適宜読み替えてやってください。

まずテンプレート(メインページ/カテゴリー・アーカイブ/個別エントリーアーカイブ/日付アーカイブ/)の <head>~</head> の間に下記を追加します。

<script type="text/javascript">
<!--
function showHide(entryID, entryLink, htmlObj) {
    extTextDivID = ('Text' + (entryID));
    extLinkDivID = ('Link' + (entryID));
    if( document.getElementById ) {
        if( document.getElementById(extTextDivID).style.display ) {
            if( entryLink != 0 ) {
                document.getElementById(extTextDivID).style.display = "block";
                document.getElementById(extLinkDivID).style.display = "none";
                htmlObj.blur();
            } else { 
                document.getElementById(extTextDivID).style.display = "none";
                document.getElementById(extLinkDivID).style.display = "block";
            }
        } else {
            location.href = entryLink;
            return true;
        }
    } else {
        location.href = entryLink;
        return true;
    }
}
//-->
</script>

3.01や3.11の場合は、直接埋め込むよりもテンプレートモジュールにした方がスッキリすると思います。その場合の手順は、管理メニューの「テンプレート」をクリック→次ページの一番下の右にある「新しいテンプレートモジュールを作る」をクリック→次ページで下記を設定

  • テンプレートの名前:ShowHide(←何でもいいです)
  • このテンプレートにリンクするファイル:何も設定しない
  • モジュールの中身:上記のスクリプトを丸ごとコピー

として保存&再構築。そして各テンプレートの <head>~</head> の間に

<MTInclude module="ShowHide">

を記述すればOKです。

次に同じく、各テンプレートの下記の赤色部分を青色部分に入れ替えます。

メインページ修正前

<MTEntryIfExtended>
<p(またはspan) class="extended"><a href="<$MTEntryPermalink$>#more">続きを読む "<$MTEntryTitle$>"</a></p(またはspan)>
</MTEntryIfExtended>

カテゴリー・アーカイブ/日付アーカイブ修正前

<MTEntryIfExtended>
<$MTEntryMore$>
</MTEntryIfExtended>

個別エントリーアーカイブ修正前

<$MTEntryMore$>

修正後

<MTEntryIfExtended>
<div id="Link<$MTEntryID$>">
<a href="<$MTEntryPermalink$>" name="<$MTEntryID pad="1"$>" onclick="showHide(<$MTEntryID$>,'<$MTEntryPermalink$>',this);return false;">続きを読む ≫</a>
</div>
<div id="Text<$MTEntryID$>" style="display: none">
<$MTEntryMore$>
<a href="<$MTEntryPermalink$>" name="<$MTEntryID pad="1"$>" onclick="showHide(<$MTEntryID$>,0,this);return false;">≪ 続きを隠す</a>
</div>
</MTEntryIfExtended>

以上です。

2006.04.04 追記
リストから language 属性を削除しました(HTML4.01/XHTMLで非推奨あるいは廃止されているため)。

Comments [48] | Trackbacks [43]
Now loading...
ギターに入った猫
掲載広告募集
Styles
Font Size
Default
For defective color vision
Gray Scale
RGB Color
Search this site

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


AMN
Categories
Monthly Archives
2017年
2016年
2015年
2014年
2013年
2012年
2011年
2010年
2009年
2008年
2007年
2006年
2005年
2004年
2003年
BlogPeople
Syndicate this site
FeedBurner(RSS1.0/RSS2.0/Atom)
Counter
これまでのアクセス
Powered by
Movable Type 6.0.3