スポンサーサイト
2008年10月13日 (月)
15:37
続きを読むを折りたたみ表示する
2005年12月26日 (月)
FC2ブログに限らず大抵のBLOGでは、本文の続きがある場合、「続きを読む」と表示され、
このリンクをクリックするとParmalinkに飛びますが、
トップページでも続きを読めるように、折りたたみ表示できるようにカスタマイズしてみました。
記事の題名をクリックすれば、Parmalinkに飛ぶし、問題ないよね。
要は、トップページで「続きを読む」をクリックすると追記部分が表示され、「続きをたたむ」をクリックすると追記部分が隠れるようにします。
こんな感じ↓
このリンクをクリックするとParmalinkに飛びますが、
トップページでも続きを読めるように、折りたたみ表示できるようにカスタマイズしてみました。
記事の題名をクリックすれば、Parmalinkに飛ぶし、問題ないよね。
要は、トップページで「続きを読む」をクリックすると追記部分が表示され、「続きをたたむ」をクリックすると追記部分が隠れるようにします。
こんな感じ↓
2006.03.18追記
現在は、下記方法の折りたたみ表示は使用していません。
簡単なJavaScriptとスタイルシートを利用した方法で実現しています。
詳しくは「コメントを折りたたみ表示する 」をご参照下さい。
もちろん当記事の方法でも何も問題ないので、お好みの方法をご利用下さい。
��</head>タグの上に以下のJavaScriptを記述。
��<!--more_link-->〜<!--/more_link-->で囲まれた部分を以下のように修正。
��<!--more-->〜<!--/more-->の部分を削除
これは削除してはいけません。
削除すると、コメント入力画面などのParmalink先で続き部分が表示されなくなっちゃいます＾＾；
実はこれ、以前NucleusというBLOGツールを使ってBLOGを公開していた時にやっていた小技の一つで、FC2BLOGに応用してみただけなんです
続きを閉じた後の戻り位置がずれる問題の改善は、今後の課題
わかる方、どなたか教えて〜
12/28追記
めんど草さんのコメントで頂いたヒントにより、続きを閉じた後の戻り位置がずれる問題は解決しました＾＾
※この記事が参考になったら、トラックバックお願いいたします。
現在は、下記方法の折りたたみ表示は使用していません。
簡単なJavaScriptとスタイルシートを利用した方法で実現しています。
詳しくは「コメントを折りたたみ表示する 」をご参照下さい。
もちろん当記事の方法でも何も問題ないので、お好みの方法をご利用下さい。
��</head>タグの上に以下の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>
��<!--more_link-->〜<!--/more_link-->で囲まれた部分を以下のように修正。
<!--more_link--><div class="entry_text"><a href="<%topentry_link>#more">続きを読む</a></div><!--/more_link-->
↓
<!--more_link-->
<div class="entry_text">
<div id="varP<%topentry_no>">
<a href="<%topentry_link>#<%topentry_no>" onclick="showMore(<%topentry_no>,'<%topentry_link>#<%topentry_no>');return false;">続きを読む</a><br />
</div>
<div id="varXYZ<%topentry_no>" style="display: none"><%topentry_more><br />
<a href="#entry<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">続きをたたむ</a>
</div>
</div>
<!--/more_link-->
これは削除してはいけません。
削除すると、コメント入力画面などのParmalink先で続き部分が表示されなくなっちゃいます＾＾；
実はこれ、以前NucleusというBLOGツールを使ってBLOGを公開していた時にやっていた小技の一つで、FC2BLOGに応用してみただけなんです
わかる方、どなたか教えて〜
12/28追記
めんど草さんのコメントで頂いたヒントにより、続きを閉じた後の戻り位置がずれる問題は解決しました＾＾
続きをたたむ部分のリンクを以下のように修正
<a href="#<%topentry_no>" onclick="showMore(<%topentry_no>,0);return false;">続きをたたむ</a>
↓
<a href="#entry<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">続きをたたむ</a>
※この記事が参考になったら、トラックバックお願いいたします。
(0)
COMMENT
ぉお|ﾟﾛﾟ屮|屮 by めんど草
見やすくていいですね＾＾Nucleusは知らなかったのですが、MTみたいなやつかな…自宅サーバーとかでブログシステム自体を構築するやつですよね、すごいなぁ。うちはいまんとこ個別記事はわざと全部表示してて、追記開閉はすぐ応用はしなそうですが、後々を考えて書くときには続き部分意識して書いているので、いつか参考にさせていただくかも。
なんかカスタマイズ好きの同種の匂いを感じましたょ。今後ともよろしくです＾＾
閉じたときの位置ずれはたぶん、<a href="#<%topentry_no>"のところをテンプレのIDにあわせて"#entry<%topentry_no>"にしたらいけそうな気がします|��ﾉｪ��|ｺｯｿﾘ
あと意図的にかもしれませんが、コメント入力画面では続き部分が表示されてません。こっちはすぐには分からないですぅ。
なんかカスタマイズ好きの同種の匂いを感じましたょ。今後ともよろしくです＾＾
閉じたときの位置ずれはたぶん、<a href="#<%topentry_no>"のところをテンプレのIDにあわせて"#entry<%topentry_no>"にしたらいけそうな気がします|��ﾉｪ��|ｺｯｿﾘ
あと意図的にかもしれませんが、コメント入力画面では続き部分が表示されてません。こっちはすぐには分からないですぅ。
by Tigerうっす
>めんど草さん
こんにちは。
その通り。NucleusはBLOGシステムを構築するツールです。
以前はこれを使ってBLOGをやっていたんですが、レンタルスペースがレンタル切れ、自分のPCがクラッシュなどの理由が重なってやめちゃいましたｗ
閉じたときの位置ずれのヒント、ありがとうございます。
後で、やってみますね。
コメント入力画面では続き部分が表示されない不具合については、すぐにわかりました。
��で記述した<!--more-->〜<!--/more-->の記述を削除してはいけなかったのです[あせ]
よく確認せずに公開してしまいました。
すみません＞＜
こんにちは。
その通り。NucleusはBLOGシステムを構築するツールです。
以前はこれを使ってBLOGをやっていたんですが、レンタルスペースがレンタル切れ、自分のPCがクラッシュなどの理由が重なってやめちゃいましたｗ
閉じたときの位置ずれのヒント、ありがとうございます。
後で、やってみますね。
コメント入力画面では続き部分が表示されない不具合については、すぐにわかりました。
��で記述した<!--more-->〜<!--/more-->の記述を削除してはいけなかったのです[あせ]
よく確認せずに公開してしまいました。
すみません＞＜
by たかろ
たまたまここみっけて
最近重くなりつつある ブログのしゃきしゃき感を取り戻そう
作戦実施中の私にはとっても ありがたく使わせていただきましたｗ
いろいろといじりたくなる反面 重くなるのが難点ですからね＾＾；
最近重くなりつつある ブログのしゃきしゃき感を取り戻そう
作戦実施中の私にはとっても ありがたく使わせていただきましたｗ
いろいろといじりたくなる反面 重くなるのが難点ですからね＾＾；
>たかろさん by Tigerうっす
お役に立ててよかったです。
しかし、なんというタイミング。
今日、別の方法で実現する方法を見つけたので、そっちに変更してみたんです。
今回の方法のほうが多少軽いかも。
3/10の記事の追記の「さらにカスタマイズ その�◆廚鬚翰�くださいませ。
しかし、なんというタイミング。
今日、別の方法で実現する方法を見つけたので、そっちに変更してみたんです。
今回の方法のほうが多少軽いかも。
3/10の記事の追記の「さらにカスタマイズ その�◆廚鬚翰�くださいませ。
COMMENT
見やすくていいですね＾＾Nucleusは知らなかったのですが、MTみたいなやつかな…自宅サーバーとかでブログシステム自体を構築するやつですよね、すごいなぁ。うちはいまんとこ個別記事はわざと全部表示してて、追記開閉はすぐ応用はしなそうですが、後々を考えて書くときには続き部分意識して書いているので、いつか参考にさせていただくかも。
なんかカスタマイズ好きの同種の匂いを感じましたょ。今後ともよろしくです＾＾
閉じたときの位置ずれはたぶん、<a href="#<%topentry_no>"のところをテンプレのIDにあわせて"#entry<%topentry_no>"にしたらいけそうな気がします|��ﾉｪ��|ｺｯｿﾘ
あと意図的にかもしれませんが、コメント入力画面では続き部分が表示されてません。こっちはすぐには分からないですぅ。
なんかカスタマイズ好きの同種の匂いを感じましたょ。今後ともよろしくです＾＾
閉じたときの位置ずれはたぶん、<a href="#<%topentry_no>"のところをテンプレのIDにあわせて"#entry<%topentry_no>"にしたらいけそうな気がします|��ﾉｪ��|ｺｯｿﾘ
あと意図的にかもしれませんが、コメント入力画面では続き部分が表示されてません。こっちはすぐには分からないですぅ。
2005.12.25(Sun) 21:14
めんど草(#6WRgJ5Is)
>めんど草さん
こんにちは。
その通り。NucleusはBLOGシステムを構築するツールです。
以前はこれを使ってBLOGをやっていたんですが、レンタルスペースがレンタル切れ、自分のPCがクラッシュなどの理由が重なってやめちゃいましたｗ
閉じたときの位置ずれのヒント、ありがとうございます。
後で、やってみますね。
コメント入力画面では続き部分が表示されない不具合については、すぐにわかりました。
��で記述した<!--more-->〜<!--/more-->の記述を削除してはいけなかったのです[あせ]
よく確認せずに公開してしまいました。
すみません＞＜
こんにちは。
その通り。NucleusはBLOGシステムを構築するツールです。
以前はこれを使ってBLOGをやっていたんですが、レンタルスペースがレンタル切れ、自分のPCがクラッシュなどの理由が重なってやめちゃいましたｗ
閉じたときの位置ずれのヒント、ありがとうございます。
後で、やってみますね。
コメント入力画面では続き部分が表示されない不具合については、すぐにわかりました。
��で記述した<!--more-->〜<!--/more-->の記述を削除してはいけなかったのです[あせ]
よく確認せずに公開してしまいました。
すみません＞＜
2005.12.25(Sun) 22:39
Tigerうっす(#V.QdXw8.)
たまたまここみっけて
最近重くなりつつある ブログのしゃきしゃき感を取り戻そう
作戦実施中の私にはとっても ありがたく使わせていただきましたｗ
いろいろといじりたくなる反面 重くなるのが難点ですからね＾＾；
最近重くなりつつある ブログのしゃきしゃき感を取り戻そう
作戦実施中の私にはとっても ありがたく使わせていただきましたｗ
いろいろといじりたくなる反面 重くなるのが難点ですからね＾＾；
2006.03.10(Fri) 11:05
たかろ(#iqhSIKS2)
お役に立ててよかったです。
しかし、なんというタイミング。
今日、別の方法で実現する方法を見つけたので、そっちに変更してみたんです。
今回の方法のほうが多少軽いかも。
3/10の記事の追記の「さらにカスタマイズ その�◆廚鬚翰�くださいませ。
しかし、なんというタイミング。
今日、別の方法で実現する方法を見つけたので、そっちに変更してみたんです。
今回の方法のほうが多少軽いかも。
3/10の記事の追記の「さらにカスタマイズ その�◆廚鬚翰�くださいませ。
2006.03.10(Fri) 23:32
Tigerうっす(#V.QdXw8.)
マリル(10/09)
Tigerうっす(10/04)
atok440(09/24)
ゲイ・ヨンジュン(09/23)
Tigerうっす(08/28)
ゆきねこ(08/27)
Tigerうっす(08/27)
ゆきねこ(08/24)
ゲイ･ヨンジュン(06/23)
みぎｗ(04/03)
亜里沙(03/08)
Tigerうっす(03/01)
Tigerうっす(03/01)
ゲイ･ヨンジュン(02/29)
ゲイ･ヨンジュン(02/26)
ひさちん＠(02/24)
Tigerうっす(02/22)
ひさちん＠(02/21)
ゲイ・ヨンジュン(02/18)
さや(02/10)