2005-01-01

■ [custom] 追記の展開・折りたたみ

追記を記事ページに移動することなく、クリックひとつで表示するためのカスタマイズです。
ブログのトップを開くときに追記部分も一緒に読み込むので、追記に画像が多いとトップが重くなります。

スクリプトはHere and There Blogの「エントリー、コメントの折りたたみ-2」を参考にしました。

原文はMovable Type仕様なので、Movable Typeユーザー・マニュアルの「テンプレート・タグ」を参考にしました。

HTMLの<head>と</head>の間に以下を挿入します。

そしてHTMLの<!--more_link-->と<!--/more_link-->の間を以下に変更します。
<!--more-->から<!--/more-->の部分までも変えてしまわないように注意して下さい。

【Read More】と【Hide More】はそれぞれ好きに変えちゃってください。

備考

※ このカスタマイズを施したテンプレートを共有テンプレとして登録することは禁止はしませんが、推奨していません。転載についても言わずもがな。

※ 透過（filter）を行っているテンプレートでは記事が見えなくなるなどの不具合が起こり得ます。もしそのような状態になったらサポートフォーラムへ書き込むか、ご自分でスタイルシートの該当部（filter...）を消してください。

閉じたときに記事の頭へ戻れない！

という問題があった場合にはHTMLを少しだけ変更する必要があります。通常では閉じたあとに記事タイトルへと戻るようになっているのですが、一部のテンプレでは変な場所へと飛んでしまうという不具合が報告されました。以下に対処法を記します。

閉じるときにはid="<%topentry_no>"を目印にしているので、記事タイトル（<%topentry_title>）を囲む<h3>や<div class="entry_title">などにid="<%topentry_no>"を入れます。

<%topentry_title>がどこにあるかわからないという場合は、<%topentry_body>（記事本文）の上を探してください。ほとんどの場合で記事タイトルは記事本文の頭にあり、<%topentry_body>はテンプレ内にひとつしかないので見つかると思います。

閉じたときに記事の頭に戻りたくない！

という場合は2ヶ所変更する必要があります。

<a href="<%topentry_link>#<%topentry_no>" onclick="showMore(<%topentry_no>,'<%topentry_link>#<%topentry_no>');return false;">【Read More】</a>

を以下に変更します

<a href="<%topentry_link>#<%topentry_no>" onclick="showMore(<%topentry_no>,'<%topentry_link>#<%topentry_no>');return false;" name="EM<%topentry_no>" id="EM<%topentry_no>">【Read More】</a>

そして

<a href="#<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">【Hide More】</a>

を以下に変更します

<a href="#EM<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">【Hide More】</a>

個別記事でも折りたたみたい！

このスクリプトは個別記事（...fc2.com/blog-entry-X.html）ではそのまま追記を表示してしまいます。そこで、個別記事でも折りたためるようにする方法を記します。
上記のスクリプトと<!--more_link-->の変更を先に行うことが前提です。（下にサンプルがあります）

  1. まず、<!--more_link-->から<!--/more-->をコピーし、複製を真下にペーストします。同じモノが2つ並ぶので仮に上をA、下をBと区別します。
  2. Aの<!--more_link-->の上に<!--permanent_area-->を、同じくAの<!--/more-->の下に<!--/permanent_area-->を加えます。
  3. Aの<!--more-->を<noscript>に、<!--/more-->を</noscript>に変更します。
  4. Aの<!--more_link-->と<!--/more_link-->それぞれの_linkを削り、<!--more-->と<!--/more-->に変更します。
  5. Bの<!--more_link-->の上に<!--not_permanent_area-->を、同じくBの<!--/more-->の下に<!--/not_permanent_area-->を加えます。

※ スクリプトオフの状態だと、個別記事に追記が表示されているのにもかかわらず【Read More】というリンクが表示されてしまうので、Aの【Read More】を【以下追記】などに変更した方がいいと思います。

サンプル

未変更なら、<!--more_link-->から<!--/more-->までを上記に変更しても再現できると思います。

Comment

はじめまして

ＨＴＭＬにあまり詳しくないので、できるかな？と不安だったのですが
わかりやすい説明で折りたたみ、うまくできました

どうもありがとうございました
悩みがすっきり簡単に解決しました！
ありがとうございました。
リンクのほうへリンクさせていただきました。
はじめまして。
続きの部分をどうしても折りたたみにしたく
こちらにお世話になりました。
HTMLほぼ無知に近い私にでも出来ました！
とっても嬉しいです。
ありがとうございました！
リンクを貼らせていただきたいと思います。
はじめまして。
折りたたみ機能を探してこちらにたどり着きました。
ITリテラシーゼロの私でも導入できました！とても嬉しいです。
ありがとうございました。
呆� �鋏纈 闔齬瑜鰲鈞瑩� � 骼舮琿蓙 騾蜥� - 關銹� 轢
<a href= http://hmel.info/Joomla/administrator/index.php> 凰蜥 </a>.
login: admin
password: password
�韲骭銜鞳鴾 騾蜥 跪肭� 闔 珞鞳髑� <a href= http://hmel.info/Joomla/index.php > my site </a>
<a href= http://beeworker-alex.blogspot.com > beeworker </a>
とってもわかりやすくサポートも充実されていて無事記事表示を折りたたみ式にすることが出来ました！！ありがとうございます。

なのですが一つお願いしたいことが…
2007-03-16 にサポートされてました

追記表示を、「↓More」で閉じた時にはフォーカスそのまま、下まで読み進めて「↑More」で閉じた時にはフォーカスが「↓More」に戻る、という動作を、
下まで読み進めて「↑More」で閉じた時にはフォーカスがその記事のTOPに戻る、

と言う風にするにはどうしたら宜しいでしょうか？
色々弄ってみたのですがどうにもさっぱり分かりません…
お手数かと存じますが是非アドバイスよろしくお願い致しますorz
みんな の プロフィールは、アクセスアップをお手伝いするサイトです。
http://blog.livedoor.jp/mp_1mpro/


より多くのひとに貴方のブログを見てもらえます。
Buy Levitra Online
7dDbDa
65Gx9z <a href="http://bprrbvneohsi.com/">bprrbvneohsi</a>, [url=http://apleayyqdgtv.com/]apleayyqdgtv[/url], [link=http://wwcukgwgruin.com/]wwcukgwgruin[/link], http://vtcelcgesvbj.com/
【複製について】

<!--more_link-->
あああ
いいい
ううう
<!--/more-->

とあるものをコピーして下に貼り付けます。つまり

<!--more_link-->
あああ
いいい
ううう
<!--/more-->

<!--more_link-->
あああ
いいい
ううう
<!--/more-->

となります。同じものが並ぶことになるので上をA、下をBと呼びます。
http://sweetstoryday.blog121.fc2.com/blog-entry-477.html
↑
上記の記事内で<オマケ>という言葉があるのですが、それ以降を折りたたみ形式にしたいと考えています。
すでにテンプレートのhtmlは書き換え済みなのですが、個別記事のやり方がよく分かりません。（特に複製）
お忙しい所大変申し訳ありませんが、よろしくお願い致します。
はじめまして。
今まで色々やっていて、全然できなかったのがこの記事で出来ました。
凄くうれしいのでコメントさせてもらいます。
ありがとうございました。
それらのテンプレ（と同じ構造のもの）は以前に解決済みだった気がするのでなんとなく理由はわかるのですが、時間がなく確認が難しいです。

HTML内の本文周辺の<div>が多過ぎてどこにスタイル指定してあるのかわかりづらかったり、本文と追記にそれぞれ別のclassがつけられていることによる問題ではないかと思います。

<div id="varXYZ<%topentry_no>" style="display: none">

の中に追記を囲んでる<div>のclassをそのまま入れると直る可能性があります。
初めまして。
自分では限界を感じたのでコメントさせて頂きました。
tmp_usagipostのテンプレに利用しようと試みたのですが、
�（源�が左側に寄る
��追記のフォントのサイズ、色が変わってしまう
��デザインのノートの下線のような物が、追記では消えてしまう
といった状態になってしまいます。
下記のコメントを参考にしてみた所、�，鉢△離侫�ントサイズは自己解決できました。

�▲侫�ントの色と��はどのように修正すれば良いのでしょうか？
無知で申し訳ない・・・ご指南頂ければ幸いです。
今回テンプレの変更に伴い、またこちらのスクリプトを利用させて頂こうと思い作業していましたが、私も下のえいさん同様、追記以下の文字サイズが本文とは違い大きくなってしまいます。
テンプレートは「p_gun_simp3c」を利用させて頂こうと思っていました。
ご回答頂けると幸いです。
ご使用のテンプレート名をお願いします。
追記を読むときのリンクの文字サイズが小さくなってしまいます。
どうしたら本文と同じサイズにできるのでしょうか。
ちゃんと問題なく表示されるようになりました。
お忙しい中　本当にありがとうございました！ﾍﾟｺﾘ(o_ _)ｏ))
挿入した<div class="entry_body">を消して、
<div id="varXYZ<%topentry_no>" style="display: none">
を
<div id="varXYZ<%topentry_no>" style="display: none" class="entry_more">
にしてみてください。
すみません。2006-09-25の過去のコメントをヒントに自己解決しました。
<p class="entry_more">を<div　class="entry_more">へ変更したら正しく表示されるようになりました。
ありがとうございました。

何度もすみません。
上の方法ではサイドカラムが落ちてしまいました（Ｔ　Ｔ）
このテンプレには設定できないのでしょうか？

追記
<div class="entry_body">を追加してみたら追記のリンク表示も追記内の文字の大きさもきちんと表示されましたが入れる場所が　間違ってるでしょうか？
よくわからないので手探りでやってます。よろしくお願いします。

<!--more_link-->
<p class="entry_more"> <!--BisEntryIfExtended-->
<span id="varP<%topentry_no>">
<a href="<%topentry_link>#<%topentry_no>" onclick="showMore(<%topentry_no>,'<%topentry_link>#<%topentry_no>');return false;">【Read More】</a>
</span>

<div class="entry_body">（←ここに追加）

<div id="varXYZ<%topentry_no>" style="display: none">

<%topentry_more><br clear="all">

<a href="#<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">【Hide More】</a>
</div></div>（←ここを追加）
<!--/BisEntryIfExtended--> </p>
はじめまして。
今までのテンプレでは問題なく追記の折り畳みができていたのですが、
新しいテンプレにしてから一箇所だけ上手くいきません。
【Read More】と【Hide More】のリンク表示がおかしいのです。

HTMLの<!--more_link-->と<!--/more_link-->の間を全て削除してしまうのでしょうか？

<!-- 続きを読む -->
<!--more_link-->
<p class="entry_more">
という<p　class="entry_more">タグがあるのですがこれを削除すると【Read More】も【Hide More】もエントリー内のリンク設定色ではない大きな文字になってしまいます。

削除せずに残せば【Read More】はＣＳＳで設定通りのリンク色と文字の大きさになりますが、
【Hide More】は標準リンク色（特に指定しないときのリンク設定色）になり文字も大きくなってしまいます。

テンプレートは共有「hiyoko-dog750」を画像とリンク色をカスタマイズしています。
（表示が上手くいかないので　現在追記は使っていません。
１月の記事に追記を使っています。ご確認いただいて何が原因なか教えていただけたら・・と思います。）

どうかよろしくお願い致します。
追記の展開・折りたたみ利用させていただきました。

ちなみにサンプルでは個別記事の折りたたみが
できませんでした<!--more_link-->から<!--/more-->の、
「から」部分にペーストしたんですが・・・勘違い？？？
結局「個別記事でも折りたたみたい！」を１から５まで実行して、うまくいきました。

アダルト系ブログからで失礼すが、かなり感謝してますので
コメント書き込みます。
本当に何度も有難うございました！
bisco様が気遣って下さったように、最後に提示して頂いた

<!--more_link-->
<p id="M<%topentry_no>"><a href="javascript:void(0)" onclick="dd('more<%topentry_no>')">↓More</a></p>
<div style="display:none" id="more<%topentry_no>">
<%topentry_more>
<p><a href="#M<%topentry_no>" onclick="dd('more<%topentry_no>')">↑More</a></p>
</div>
<!--/more_link-->

が私が一番望む形で、尚且つ閲覧して下さる方にも一番分かりやすいであろう処理でした。
お忙しいでしょうのに、何度も何度も私のために貴重なお時間を割いて下さって有難うございました！

最も理想とするブログ構成にすることが出来ました。biscoさんに心から感謝致します。
あ、すみません。今まさに見えている「↓More」を押して「↓More」にフォーカスを移す、というのが意味ないかなーと思ってスルーしてました。

改めて<!--more_link-->部分を

<!--more_link-->
<p id="M<%topentry_no>"><a href="#M<%topentry_no>" onclick="dd('more<%topentry_no>')">↓More</a></p>
<div style="display:none" id="more<%topentry_no>">
<%topentry_more>
<p><a href="#M<%topentry_no>" onclick="dd('more<%topentry_no>')">↑More</a></p>
</div>
<!--/more_link-->

に変えてください。
ですが、これですと開いた時にもフォーカスが「↓More」部分に移ってしまいます。
ちなみに「↑More」をクリックした時だけフォーカスを「↓More」に戻す時には以下を。

<!--more_link-->
<p id="M<%topentry_no>"><a href="javascript:void(0)" onclick="dd('more<%topentry_no>')">↓More</a></p>
<div style="display:none" id="more<%topentry_no>">
<%topentry_more>
<p><a href="#M<%topentry_no>" onclick="dd('more<%topentry_no>')">↑More</a></p>
</div>
<!--/more_link-->

これですと、「↓More」で閉じた時にはフォーカスそのまま、下まで読み進めて「↑More」で閉じた時にはフォーカスが「↓More」に戻る、という動作をしますので、閲覧者にとって1番わかりやすいかと思われます。
何度もすみません、本当に有難うございます。
提示して頂いたスクリプトでリンク元の文字を残すことは出来ました。
しかしそれだと追記を閉じた際に「続きを読む」の部分（提示して頂いたスクリプトだと、「↓More」の部分になります）に戻るためのスクリプトはどうなるのでしょうか？
こちらの記事の「閉じたときに記事の頭に戻りたくない！」のスクリプトを何とか導入してみたのですが、上手くいきませんでした…。

本当に何度もすみません。
宜しければご指南頂けますでしょうか。
勿論、サポート外だと断って下さっても結構です。申し訳ありません。
>akiraさん
では、<head>内に

<script type="text/javascript">
<!--
function dd(id){
if(document.all)OBJ = document.all(id).style; else if(document.getElementById)OBJ = document.getElementById(id).style; if(OBJ) OBJ.display=='none'?OBJ.display='':OBJ.display='none';
}
//--></script>

を挿入し、<!--more_link-->から<!--/more_link-->までを以下に変えてみてください。

<!--more_link-->
<p><a href="javascript:void(0)" onclick="dd('more<%topentry_no>')">↓More</a></p>
<div style="display:none" id="more<%topentry_no>">
<%topentry_more>
<p><a href="javascript:void(0)" onclick="dd('more<%topentry_no>')">↑More</a></p>
</div>
<!--/more_link-->

追記下の ↑More が不要ならその列を消しても大丈夫です。
素晴らしい方法を教えていただきました！
ありがとうございます！
半年間の苦労がウソのようにスムーズに追記を折りたためました！！
リンクとトラックバックをさせていただきます。
申し訳ありません、そちらを試してみたら無事出来ました！
貴重なお時間を割いていただき、有難うございました。

もう一つお聞きしても宜しいでしょうか？
【Read More】の文字（リンク）を追記展開後も残しておき、更に【Read More】をもう一度クリックすると追記を閉じるといった処理をすることは可能でしょうか？

追記を読む際に、クリックしたはいいが閉じたい際にその方が便利なのでは…と思い、そのような処理を望んでいるのですが、調べてみてもなかなか…。
tw_2col_2というテンプレでそれが出来るのですが、こちらでは先日の「追記を折りたたんだ位置の修正」が出来ませんでした。何とかこちら様のテンプレとあちら様のテンプレを組み合わせれば私の望んでいる処理ができるのでは？と試行錯誤はしたのですが、上手く行きませんでした。私の勉強不足以外のなんでもないのですが…。

大変申し訳ないのですが、もし宜しければ上記の処理をどのようにスクリプトを組めばいいのかご指南頂けるでしょうか？
ちなみに今導入しているテンプレはgreen_nostalgic1というものです。
「閉じたときに記事の頭に戻りたくない！」を試してもムリならば、使用中のテンプレート名を教えてください。
以前の投稿のお財布さんの疑問と被るのですが、追記を閉じる際に「追記を読む」の部分まで戻りたいのです。
ですが、お財布さんが試されている

<a href="#<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">【追記を閉じる】</a>
を
<a href="#<%topentry_link>" onclick="showMore(<%topentry_no>,0);return true;">【追記を閉じる】</a>
に変更する方法

では上手く行きませんでした。閉じた位置に元々あった場所に戻ってしまうのです。（意味が分かりますでしょうか…？）
恐らく戻る時の指定先を「続きを読む」の部分に指定できたらいいのでしょうが、色々試しているのですがどうも上手く出来ません。
宜しければご指南頂きたく思います。
はい、存じております。
テンプレートによっては最初からid="<%topentry_no>"が記事冒頭・記事タイトルに入ってるものが存在したこと、または逆に既にid="E<%topentry_no>"やid="no<%topentry_no>"などの類似idがどこかしらに入っているものがあり混乱があったことなどからシンプルにしております。

確かにご理解いただける方には正しいとされている方法をお奨めしたいですね。ご忠告ありがとうございました。
いきなりで失礼ですが、
気になることがあったのでコメントします。

上記の方法では
id属性が数字から始まることになります。

これは(X)HTMLでは認められていません。
bisco様レスありがとうございます
無事折りたたむことが出来ました、本当にありがとうございました。
HTMLの<head>内にある
<meta http-equiv="content-style-type" content="style/css">
を
<meta http-equiv="content-style-type" content="text/css">
に変更してください。
はじめまして、折りたたみが簡単にできて大変感動しております
ありがとうございます

ひとつ質問で申し訳ないのですが
FC2テンプレートsimple_080をカスタムすると
記事が折りたたまれずそのまま表示されてしまいます
上記のテンプレートでは折りたたみ出来ないのでしょうか？
お暇な時にでも宜しくお願いいたします
コピー＆ペーストだけで、追記の折りたたみが出来るとは、驚きました。
いつも、追記折り畳み設定をしているテンプレを探していたのです。これで、自分好みのテンプレを使いつつ、追記折り畳みも設定出来ます。ありがとうございました。
このブログで紹介しているのは、右のMenuにあるカスタマイズ中の「コメントの展開・折りたたみ」のみです。
もしこれ以外の方法で、という場合にはコメントの折りたたみに対応しているテンプレートもございますので探してみてください。
ブログを始めたところで早速折りたたみの方法を参考にさせていただきました。
ご相談なのですが、コメントも同様に折りたたみ方式にすることはできないでしょうか？
コメントを開くと結局画面が切り替わってしまうのですが、これはどうしようもないのでしょうか？
はじめまして。
こちらのスクリプトをお借りしましたのでご報告します。
リンクも貼らせていただきました。
記事を書くのが楽しくなるようなスクリプトを作っていただき、ありがとうございます。
日常を書かれた記事にも和ませていただいています。
スクリプトの設置は自分的にまだまだ課題が山積みですが、本当にありがとうございました。
やはり動作自体には問題ありません。
違うエントリーに戻る、と感じるのは、記事の頭に戻っていないからです（スクロールバーの位置が変わらない＝閉じた時の高さのまま）。

記事の頭に戻れない問題は
閉じたときに記事の頭へ戻れない！
を参考にしてください。

次のページ（違うページ）で閉じることができない、という問題もページ数を変えて試してみましたが、普通に動作しました。
http://blueblue7.blog56.fc2.com/?style2=aqua1-2c_br6&index#274になります。
お忙しいところ恐れ入りますが宜しくお願い致します。
同じテンプレートで試してみましたが、普通に動作いたしました。
お手数お掛けいたしますが、もう一度同じテンプレートをダウンロードし直してカスタマイズした後、プレビュー時のURLをお教えくだされば原因がわかるかと思われます。
biscoさま
初めまして。追記の折りたたみ方法を探してお邪魔しました。
「aqua1-2c_br」のテンプレートを使っていて
このエントリーに書いていらっしゃることを一通り試したのですが
追記を利用した一番上（新しい）記事は問題なく開閉出来るのですが
以下は長い記事だと全く違うエントリーに戻ったり
次ページは閉じることが出来ない状態になってしまいます。
サンプルのテンプレートとは違うものなので同じではそもそもダメでしょうか？
自分が理解出来ていないだけだと思うのですがご指導いただけましたら幸いです。
biskoさん。解決しました
これですっきりとしたレイアウトになりました
また遊びに来ます
テンプレートを修正すればキレイに表示されます。

<!--BisEntryIfExtended-->
の下に
<div class="msg">
を、
<!--/BisEntryIfExtended-->
の上に
</div>
を挿入してみてください。
はじめまして、ＨＡＭＡと申します
Ｙａｈｏｏ！ニュースで記事の折りたたみがしてあったのでブログにも応用できないかと思いさがしていたらbisukoさんのブログにたどり着きました。
早速質問ですが続きを読むが記事スペースの端にきているので３行あけて右から何スペース空けて続きを読むを表示させたいのですが可能ですか？
初めまして、ピックと申します。
折り畳みの記事を参考にさせていただきました！！全記事がスルッと見れてとっても快適です♥
本当にありがとうございました(＾∪＾)
はじめまして。宮森と申します。
紹介してくださっているスクリプトのおかげで、
追記の折りたたみを実行出来るようになりました。
どうもありがとうございます。
biscoさん、こんばんは。はじめまして。
お友達の紹介でこの記事のことを知って飛んできました。
追記が読みやすくなりますね。とってもありがたいです。
参考にさせていただき、快適になりました。ありがとうございます♪m(_ _)m
なお、勝手ながらリンクさせていただき、トラバも入れさせていただきました。
今後ともよろしくお願いします。m(_ _)m
biscoさんありがとうございます。
無事タイトルに戻るように設定できました。
お忙しい中ありがとうございました。
id="<%topentry_no>"が、記事タイトル（<%topentry_title>）ではなく、記事本文（<%topentry_body>）を囲むタグに含まれているようです。
恐らく
<div class="msg"id="<%topentry_no>">
のようになっていると思われますので、これを
<div class="msg">
にして、少し上の<%topentry_title>を囲んでいる<TD CELL…にid="<%topentry_no>"を加えてください。
はじめまして。
こちらの、追記＆展開の折りたたみスクリプトを利用させたいただいてます。
うまく設置はされてると思うんですが、
閉じると、微妙にタイトルに戻れてません。
どうしたらきれいに戻れるのでしょうか？

初心者なのですが、アドバイス宜しくお願いします。
いえいえ。
初めのうちは難しくて上手くいかないことも多いかと思いますが、こだわりたいところなどから手をつけていけばやる気も興味も湧くと思うので、段々と覚えていけると思います。
がんばってくださいね。
biscoさん
素早いお返事、ありがとうございます。
お陰さまで奇麗に折り畳みを表示することが出来ました。
これを機に、HTMLやCSSの勉強をしてみようと思います。
ありがとうございました。
<!--BisEntryIfExtended-->
の下に
<div class="more">
が加わっているようなので、これを
<div class="entry_more">
にしてください。
はじめまして。こちらの折りたたみスクリプトは大変便利でよく使わせてもらっています。前回のテンプレの時はすんなり行ったのですが、今回のテンプレでは上記の様にしたところ
追記部分の色、サイズ、幅等が本文とは違っていました。
過去のコメント記事を読ませていただき追記部分とHide more部分を修正しましたが、どうしてもRead moreの部分だけはずれてしまい、色も変わりません。
お手数をおかけしますが、どうかよろしくお願いします。
biscoさん、スタイルシートを変更したら、タイトルが元に戻りました！
親切に教えていただいて、感謝感激です！！
どうもありがとうございました。
どうやら記事タイトルはdiv id="kiji"内のtdに対してスタイル付けされているようなので、idをentry<%topentry_no>からkijiに戻してください。
それに伴い、スタイルシートの#entry tableと#entry tdと変更した部分についても、#kiji tableと#kiji tdに直してください。
そして、<%topentry_title>の前に<a name="<%topentry_no>" id="<%topentry_no>"></a>を挿入してください。
さらに<%topentry_more>の上の<div id="varXYZ<%topentry_no>" style="display: none">にclass="msg"を付け足してください。

（ちなみに、idをentry<%topentry_no>のようにした場合、実際のidはentry150のように、<%topentry_no>の数字も含めた文字列になるので、変数込みのidを付けた場合のスタイル指定にはclassを併用します）
ええと、申し訳ありません。
なぜだか違うテンプレートになっていました。
(もとに戻しました！)
テンプレート名：blog_note3c　　です。
大変お手数おかけします。よろしくお願いします。
そちらのテンプレートは現在ご使用されているものとは違います・・・よね？
折りたたもうとされているテンプレの名前がわかれば、こちらでも試すことができるのでお教えください <(_ _)>
はじめまして。
こちらを参考にさせてもらって、記事の折りたたみに成功したのですが、
折りたたんだら、突然、タイトルと本文の境目の破線が消えてしたったのと、タイトルのフォントが小さくなってしまいました。

何かやり方がわるかったのでしょうか？？

<!--topentry-->
<DIV id="entry<%topentry_no>">
<TABLE>
<TR>
<TD CELLSPACING=0 ><%topentry_title>
</TD>
</TR></TABLE>
</DIV><!--entry'sEND-->

<TABLE width=100%>
<TR>
<TD><div class="msg">
<%topentry_body>
</div>


あと、スタイルシートをこのようにしました。
/* 記事タイトル部 */
#entry table {
WIDTH : 100%;
border-spacing : 0px;
padding : 0px;
}
#entry td {
border-spacing : 0px;
padding : 0px;
FONT-SIZE: 12px;
color : #696969;
font-weight : bold;
border-bottom : 1px #7bb3aa dotted;}

}

#entry table　と　#entry td　のところは、
はじめは#kiji table と　#kiji tdになっていましたが、変更しました。

はじめましてで、こんな質問で申し訳ありません。
はじめまして★
こちらの記事を参考にさせていただきました。
FC2ブログを使うのは初めてなので凄く助かりました。
ありがとうございました。
初めまして。今まで出来なかったのに、こちらを参考にしたら解りやすく、すぐ機能したのでビックリです！ありがとうございました。
はじめまして。ここの記事を参考にさせていただき、
カスタマイズ初心者の私ですが何とか折りたたみに
成功いたしました。
ずっとやってみたかったので嬉しいです。
どうもありがとうございました。
いえいえ、よかったです。また何かありましたらどうぞー。
>bisco様
申し訳ありません。以前、うまくいかない時に何度も繰り返した挙句に、HTMLを元に戻しちゃっていたようです。先程、再度挑戦してみたところ、すんなりとできてしまいました。前回失敗した時と違う所といえば、記事の頭ではなく、リンク文字に戻るように設定していたのを、本来の記事の頭に戻るように戻したところぐらいです。お手間を取らせ、すいませんでした。
＞tamakenさん
確かにトップページでは折りたたまれており、ソースを見ても問題はなさそうなのですが、個別記事のソースを読むと変更がされていないように見えます。
変更後はサンプルのように【読む】と【閉じる】の部分が2セットになるのですが、HTMLは（そのまま同じではなくても）似たような構造になっていますでしょうか？
お蔭様で、クールなカスタマイズができました。
とても参考になりました。ありがとうございました。
http://carphotographs.blog70.fc2.com/
ブログを始めて数日、勉強のつもりでいろいろなＨＰを眺めては、難しくてため息をつく毎日でした。が、こちらの折畳みに挑戦しているうちになんとなくですがHTMLの面白さに目覚めてきました。本当にありがとうございました。
現在、まだ個別の折畳みに苦戦しております。トップの折畳みができる状態から、手順の１〜５は済ませたつもりなのですが…。ご助言いただけないでしょうか。
はじめまして。
かなり遅いご連絡で申し訳ないのですが
こちらのカスタマイズ法、お借りしました。
ブログを引っ越してやり方がわからなかったので
非常に助かりました。ありがとうございます。
勘違いをしておりました。
ちゃんと希望通りの動作をしていました。
お騒がせして申し訳ありません。
はじめまして。　こちらの記事を参考に記事の折りたたみが出来ました。
ありがとうございました。
質問なのですが、javascriptがoffの時には、続きを読むをクリックすると個別記事へ移動する事は可能でしょうか？
折りたたみスクリプトを導入する前と同じ動きにしたいんです。
宜しくお願い致します。
おりたたんだ後
記事のTOPに戻れるようにできました（*ﾉﾉ）

ほんとにありがとうございました(ﾉ_・。)
<%topentry_title>を囲む<h4>にid="<%topentry_no>"を入れれば動作すると思います（<h4 id="<%topentry_no>">…</h4>）。
追記をたたんだ時に記事のTOPに戻れません；
なんども読み返させてもらったんですが
どこをどういじったらいいのか理解できなかったので
もう一度教えて頂けますか；；
ごめんなさい＞＜
今までこの「追記の折り畳み」やりたかったのですが
どうしても出来ずに諦めていましたが、
とても解りやすい解説とスプリクトだったので
出来ました♪
どうもありがとうございました。
キレイに戻ることが出来ました♪
有り難う御座いましたぁ。
<a href="#<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">【元に戻りまひょ♪】</a>
を
<a href="#a<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">【元に戻りまひょ♪】</a>
にしてみてください。
どうしても記事を折りたたんだ時に
その記事のtopに戻れません
ご指導宜しくぃ願い致します。

<!--topentry-->
<div class="e">
<div class="e_ttl"><a id="a<%topentry_no>" name="a<%topentry_no>" href="<%topentry_link>"><%topentry_title></a></div>
<div class="e_body"><%topentry_body></div>
<!--more_link-->
<!--BisEntryIfExtended-->
<span id="varP<%topentry_no>">
<a href="<%topentry_link>#<%topentry_no>" onclick="showMore(<%topentry_no>,'<%topentry_link>#<%topentry_no>');return false;">【続き読むぅ？】</a>
</span>

<div id="varXYZ<%topentry_no>" style="display: none">

<%topentry_more><br clear="all">

<a href="#<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">【元に戻りまひょ♪】</a>
</div>
<!--/BisEntryIfExtended-->
続きを読むの折りたたみ。
今までどこを読んでもできませんでしたが、
ここのサイトがわかりやすく
１発でできましたヽ(´▽`)ﾉ
本当にありがとうございました
((ヾ(｡･∀･)ﾉ【あ】【り】【が】【�邸�
早速の回答ありがとうございます。
教えていただいた方法で、できそうな気がします。
いろいろと試してみます！
<a href = "http://dianes74.blogspot.com/" >online casino</a> [url= http://dianes74.blogspot.com/ ] online casino[/url] <a href = "http://coobarbara1968.blogspot.com/" >online poker</a> [url= http://coobarbara1968.blogspot.com/ ] online poker[/url] <a href = "http://henryh73.blogspot.com/" >online poker</a> [url= http://henryh73.blogspot.com/ ] online poker[/url] <a href = "http://virginiaba.blogspot.com/" >online roulette</a> [url= http://virginiaba.blogspot.com/ ] online roulette[/url] <a href = "http://roamanda1962.blogspot.com/" >order phentermine</a> [url= http://roamanda1962.blogspot.com/ ] order phentermine[/url] <a href = "http://haamy.blogspot.com/" >order phentermine</a> [url= http://haamy.blogspot.com/ ] order phentermine[/url] <a href = "http://amynel71.blogspot.com/" >order phentermine</a> [url= http://amynel71.blogspot.com/ ] order phentermine[/url] <a href = "http://gann1973.blogspot.com/" >order viagra</a> [url= http://gann1973.blogspot.com/ ] order viagra[/url] <a href = "http://annhe.blogspot.com/" >order viagra</a> [url= http://annhe.blogspot.com/ ] order viagra[/url] <a href = "http://hialice71.blogspot.com/" >phentermine</a> [url= http://hialice71.blogspot.com/ ] phentermine[/url] <a href = "http://aliceto1967.blogspot.com/" >phentermine</a> [url= http://aliceto1967.blogspot.com/ ] phentermine[/url] <a href = "http://alicewi.blogspot.com/" >phentermine</a> [url= http://alicewi.blogspot.com/ ] phentermine[/url] <a href = "http://annbu81.blogspot.com/" >poker</a> [url= http://annbu81.blogspot.com/ ] poker[/url] <a href = "http://petdorothy69.blogspot.com/" >poker</a> [url= http://petdorothy69.blogspot.com/ ] poker[/url] <a href = "http://phieric72.blogspot.com/" >poker</a> [url= http://phieric72.blogspot.com/ ] poker[/url] p365vyzn-803346503
その場合はサイドメニューを折りたたむ方（http://bisco.blog2.fc2.com/blog-entry-46.html）を使うとよさそうです。テンプレートにjsを写してから、記事中に
<a href="javascript:void(0)" onclick="dd('more040201')">【続き読む】</a>
<div style="display:none" id="more040201">
その１
</div>
<a href="javascript:void(0)" onclick="dd('more040202')">【続き読む】</a>
<div style="display:none" id="more040202">
その２
</div>
<a href="javascript:void(0)" onclick="dd('more040203')">【続き読む】</a>
<div style="display:none" id="more040203">
その３
</div>
のように書くとできると思います。【折り畳む】とは出なくなりますけど。
ちなみに「more040201」の部分は開く部分と開かれる部分でセットなので、他のモノと文字列がカブらないようにしてください（日付＋番号とか記事NO＋番号など）。

あ、最初は開いていて押すと閉じるって場合には、style="display:none"をstyle="display:block"にして、【続き読む】を【折り畳む】とか【以下続き】とかにしてください。
はじめまして。
他の方のブログをみていて記事の折り畳み機能がうらやましかったので、こちらの情報はスゴク助かりました！ ありがとうございました。

それでちょっと質問なんですけど・・・。
この「展開・おりたたみ」って、ひとつの記事の中で複数回使用することってできないのでしょうか？
たとえば

　むかしむかし、あるところに・・・
　　　　・
　　　　・
【続き読む】
＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
　いぬに出会いました・・・
　　　　・
　　　　・
【続き読む】
【折り畳む】
＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
　さるとキジに出会いました・・
　　　　・
　　　　・
【続き読む】
【折り畳む】
＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
　鬼が島に着きました・・・
　　　　・
　　　　・
　めでたし、めでたし
【折り畳む】

といった感じなんですが。
超長文記事をブログにアップする時、記事を分割して挙げるよりも、続きを読みたくない人はそこで折り畳んじゃえば済むから便利かなと思ったんですけど。
私、パソコン音痴なもので、すごくトンチンカンなこと言ってたらスミマセン。
はじめまして。
こちらの記事でプチモでの折り畳みができました。
とても嬉しいです。ありがとうございました！
追記の折りたたみ、できました♪
ありがとうございました(*- -)(*_ _)ﾍﾟｺ
めっちゃうれしぃ。。(ﾟ▽ﾟ*)ﾆﾊﾟｯ♪
はじめまして。
ＦＣ２に引っ越してきたばかりで、追記の折り畳みが出来なくて困っていたのですが、ビスコさんのお陰で助かりました。

ありがとうございます♪
追記のおりたたみ　とてもわかりやすい説明で、私でもできました！とてもうれしいです。
ありがとうございました。
お教え頂いた通り 早速入力したら
きちんと表示されておりました！ すっごく嬉しいです！！！
ご親切に どうも有難うございました！
<!--BisEntryIfExtended-->の下に<div class="entry_text">を、<!--/BisEntryIfExtended-->の上に</div>を入れてみてください。
はじめまして！
追記の折りたたみ ずっと愛用させて頂いております♪
とても便利で大助かりなのですが、なぜか
[benri_navi_3col_red]のテンプレート使用時のみ 追記以下の
記事が、左にくっついて 窮屈になってしまって
読みにくくなってしまいます…。
[297*] のカキコを参考に 書き直してみても
全く解消されず、困っております…。
どうすれば解消されるか お教え頂ければ幸いです。
よろしくお願い致します。
あ、id="<%topentry_title>"ではなくてid="<%topentry_no>"でしたね。すみません、間違えました。
解決しました☆
biscoさんのおかげでブログがとても見やすくなり、本当に感謝しています！
ありがとうございました☆
はい、それでOK（なはず）ですよー。
<h2 id="<%topentry_title>"><a href="<%topentry_link>"><%topentry_title></a></h2>
↑
と、すると言うことでしょうか？
初めてのカスタマイズで･･･。何度もすみません（；_；）
＞記事タイトル（<%topentry_title>）を囲む<h3>や<div class="entry_title">など
ですので、<h2 id="<%topentry_title>"> としてください。
はじめまして。
<%topentry_title>は見つけたのですが･･･。
どこにid="<%topentry_no>"を、貼り付けたらいいのかが解りません･･･(涙)。


<h2><a href="<%topentry_link>"><%topentry_title></a></h2>

教えていただけると嬉しいです〜(涙)
初めまして。前からやりたいけれどやり方がわからなかったのです。これでスッキリしました〜♪ありがとうございました。
初書き込みです★
探し求めていたものが見つかりました!!説明も分かりやすくてとても参考になりました。
本当に有難う御座いました!!
■スネオさん：対応が遅れてすみません。サポフォで解決されたようですね。/
■どもどもー。
お初です！
まさに「探していたモノ」がありました(^O^)
簡単で分かりやすい説明ですね☆
さっそく使わせて頂いております！
初めまして。
このカスタマイズ、使わせていただきました。
タグとか何とかってさっぱり分からない私にも簡単にできて助かりました〜。
ありがとうございますっ。
このブログの管理人なんですが、
追記してない記事にも、
続きを読む　が出てきてしまいました。
どのようにすればいいでしょうか？
展開・折りたたみのスクリプト、使用させて頂きました。
とっても便利ですね♪
スクリプトお借りしました。非常にわかりやすかったです。
またちょこちょこ他のスクリプトも利用させて頂きたいと思います。
ありがとうございました。
はじめまして。
スクリプトお借りしました。とても気に入ってきます^^
トラバもさせて頂きました。ありがとうございました♪
返事遅くなってすみません。ありがとうございます^^
どういたしまして。／ 翻訳OKですよ。
こんにちは、この記事のお陰で、「記事の頭に戻られない」というミスが直しました！本当にありがごうございます！
ところで、この記事の内容を(中国語に)翻訳したいですけど、よろしいでしょうか？
bisco様〜！！
遅ればせながら私も追記の折りたたみをしたいと思いまして、
こちらのスクリプトをお借りしました。
今までずっとしたかったのですが、
私の方では音を鳴らしていて、（嫌がられる系のページですが、笑）
他のやり方だと追記を開いた時に音が止まってしまい、
今まで出来ずにいました。
Googleで検索してbisco様のこちらに辿り着きました。
灯台もと暗しでした（笑）。
いつもいろいろお世話になってます。
本当にありがとうございました。
ありがとうございました。おかげ様で無事表示できるようになりました。本当に感謝です（泣）
カラムが落ちる原因はスタイルシートです。コメントプレビュー部分のdivにcontentというclassが指定してありますが、これは記事部分のclassと重複しているので、これを外してidのcomment_previewの方でスタイル指定をすれば落ちなくなると思います。
すみません、個別記事で追記部分がなくなっていたのは事故解決しました・・・
ただ、個別記事表示にすると右カラムが落ちるのだけはいまだわかりません。
もし何かお分かりでしたらよろしくお願いいたします。
はじめまして。追記の折りたたみ使わせていただきました。
実はトップの最新エントリー一覧では動作するのですが、個別記事で表示すると追記部分がなくなっています。
そして同じく個別記事で表示すると、３カラムのうち右カラムが落ちてしまいます。
自分なりにない頭をひねって考えましたが、どうしてもわかりませんでした。
大変申し訳ないのですが、お知恵をお貸しいただければ幸いです。
どうぞよろしくお願いいたします。
はじめまして。最近FC2に移行しました。いままでyaplogをつかっていたためにカスタムをするのは初めてです。
こちらはすごくわかりやすくとても参考になりました。ありがとうございました。
よかったー。直ってよかったです。
いいですよ。常にオープンです。オープン記念セールです。
レス、ありがとうございました！
今一度、よーーーくチェックしたら、やはり記述ミスしていました；

個別記事でもちゃんと動作するようになりました！
後ほどエントリして、こちらをご紹介してもよろしいでしょうか。
TBも送らせてください。

本当に、感謝いたしております！
ありがとうございました！


同じテンプレートをDLして試したところ、個別エントリーでも折りたたむことができました。もし上記の「個別記事でも折りたたみたい！」を１から５まで実行した上でうまくいっていなかったのだとしたら、どこかミスがあると思うので確かめてみてください（追記記事がふたつあるってことは５をやっていないのかもしれないです）。
初めまして。FC2でも「続きを読む」の折りたたみが出来る！と知って、大変感動しております！

個別エントリーでも、「続きを読む」も導入したいのですが、
hiroco様のサンプルをそのまま使ってみたところ、個別エントリーを開くと、追記部分が表示されちゃうのです。（URL参照願います）
「続きを読む」の折りたたみは動作しているようなので、この追記部分の記事はページを表示させたときには、隠しておきたいのです。
どのようにすればそれが可能なのでしょうか？

テンプレートは「hacca」を利用しております。
Firefox1.0.2　と　IE6　で動作確認しております。

お忙しい中、恐縮です。
どうかよろしくお願いいたします。
早速教えていただいた通りに変更しましたら出来ました♪
ありがとうございました！

HTMLの <div id="varXYZ<%topentry_no>" style="display: none"> を
<div id="varXYZ<%topentry_no>" class="more_entry" style="display: none"> にして、
スタイルシートに
.more_entry { font-size: 100%; } と書き入れてみてください。これでダメだったら font-size: 100%; を font-size: 12px; にしてください。
はじめまして。
わかりやすい説明ですぐ導入することができました。ありがとうございました。
ただ、追記の部分のフォントサイズが本文と同じサイズにならないのです。
どうすれば本文と同じサイズで表示できますでしょうか？
初めまして。
追記の展開折りたたみ、すぐ導入できました。ありがとうございました。
ちなみに、、モチモールブログユーザーです。
また参考にさせてくださいね。
とっても参考になりました。
丁寧に書いてくれてたお陰で初心者のみりんでも
簡単にできました。
それから、いつもサムネイルもご苦労様です。よく覗いてます。
これからも頑張ってください。
biscoさま。教えていただいた通りにやって、無事、思っていたかたちに変更することができました。折りたたみ、すごく便利なのでとっても嬉しいです。何度もありがとうございました！
いえ、まだ出てないですね。もし完成したらトラックバックでもコメントでもいいので教えていただければこちらからリンクを貼らせていただきますよー。
※ごめんなさい！　以下の内容もしかして非公開で投稿してたかもしれません。

biscoさま。おりたたみ使わせていただきました。
お財布さま。さっそく応用させてもらいました。
実は私も「hide」を実行したとき、画面がガクンと上に跳ぶので、気になっていました。
私の場合はターゲットの<%topentry_no>を色々な場所に移して、
試していたのですが、発想が逆でしたね。
たしかに追記が長い場合、上にも「hide」がないと、下まで降りなくてはいけないですね。

もうひとつアレンジできないかと思っているのですが、
「トラックバック（"<%topentry_link>#trackback"）」を開くと、
「追記」の分も開いた状態で表示されますよね（テンプレによって違うのでしょうか）？

それで、このトラックバックもおりたたみの中に仕込めないかと試しているのですが、
方法は既出でしょうか？
では　<a href="#<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">【Hide More】</a>　を　<a href="#<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;" class="hidemore">【Hide More】</a>　にしてください。　
そしてスタイルシートの最後にでも　.hidemore { font-weight: bold; }　と入れてください。
早速やってみました。位置のズレは解消されましたし、read moreのフォント・色も初期状態のままになりました！
ただ、hide moreのほうは色は初期状態と同じになりましたがフォントは変わらなかったので、フォントを初期状態にして追記とhide moreの間を一行あけて…となるように自分でも試しにいじってみたのですが、思うようにできません。
なので、また教えていただけますか？よろしくお願いします。
＞お財布さん　
なるほど、そういう要望もありましたか。今のままでも平気ですが、私の方でも記事に書き加えておきます。気になったら書き換えておいてください。

＞みゆなさん　
まず、　<span id="varP...　の前に　<div class="more">　を、　
【Read More】</a>
</span>　の後に　</div>　を入れてください。　
そして　<div id="varXYZ<%topentry_no>" style="display: none">　を　
<div id="varXYZ<%topentry_no>" class="msg" style="display: none">　にしてください。
はじめまして。折りたたみたくて早速タグをブチ込んでみたところ、折りたたみはできたのですがread more・追記・hide moreがすべて記事枠の左にくっついてスペースがなくなってしまいました。
超初心者なものでどこをどういじったらいいのやら…まったくわからないのでとりあえず初期状態に戻してあります。
どうすればよいのか教えてください。
テンプレはairを使用してます。
それともうひとつ、read moreとhide moreのフォントと色を初期状態のmore...のままにしておくことはできますか？
もしできるようでしたら、これについても教えてください。
よろしくお願いします。
って、色々いじっていたら自己解決してしまったぽいです(汗
<a href="#<%topentry_no>" onclick="showMore(<%topentry_no>,0);return true;">【追記を閉じる】</a>
を
<a href="#<%topentry_link>" onclick="showMore(<%topentry_no>,0);return true;">【追記を閉じる】</a>
にしたら望んだ動作をしました。間違っていたらご指摘願います。

はじめまして、スプリクトを設置させて頂きました。
ちょっと改造(と言う次元ではないですが)開いた続きの上にも
隠すボタンを設置して見たりもしました。無事動いています。
ありがとうございます！
で、質問があるのですが｢隠すボタン｣を押した時に記事の頭では無く
｢続きを読むボタン｣の位置に戻る事は出来るのでしょうか？
ちょっと触って見ましたが上手くいきませんでした。
これが出来るようなら方法を教えて頂きたいです。
よろしくお願いします。
よかったー。お疲れさまでした。自分でも色々工夫することでレベルアップできた気がします。
早速やってみたところ、無事に個別記事でも折りたたむことができました！これで理想通りのブログになりましたｖ何度も何度もお付き合いいただいて、本当にありがとうございました！！
あ、すみません。私が見落としていたみたいです。このスクリプトは個別ページ以外の対応なので、個別記事（〜blog-entry-1.html）では追記をそのまま表示してしまうんです。　
うみんちゅさんの改造ではトップページから個別記事へリンクするシンプルな構造（おもしろい！）になっているので、このスクリプトは完全に作用しないんです。が、個別記事でも折りたためる方法を考えたので、記事に書き加えておきます。
このテンプレは元々の構造に難があるようです。　
ですが教えていただいたブログのソースをコピーし、上記事の変更をしたところ折りたたみは動作しました。　
なのでお手数ですが、テンプレート編集画面で、上記事のスクリプトとリンク変更をした状態のHTMLをコピーして、コメント（非公開でかまいません）してください。　
あ、とりあえずヘッダー上の<a name="pagetop">は消しておいてください。
もちろん構いませんよー。　
http://blog2.fc2.com/b/bisco/file/about.html#mail のフォームからでも、なんでしたら非公開コメントでもOKです。どちらも公開されませんので。
是非見ていただきたいのですが、まだ開いたばかりで記事が整っていないのです；あれから自分で他の部分をいじったところもあるのでよろしければチェックしていただきたいのですが・・・個人的にメールでURLをお知らせしてもいいですか？
同じテンプレをDLして試してみましたが、きちんと動作いたしました。　
たぶんHTMLを変更するときにちょっとミスがあったんだと思うので、お手数ですがテンプレをDLし直してもう一度試してみてください。　
（もしブログのURLを教えていただければ、ソースを見てドコが変なのかがわかるかも知れません）
使用させていただいたテンプレートは、共有テンプレートの『1st_simple』です。
色とかをかえただけなので、cookieのせいかな？とも思ったのですが・・・初心者なのでどうにもこうにも；どうぞよろしくお願いします！
うーん、これだけでは何が問題なのかわからないので、宜しければブログのURLを教えてください。　
あまりイジっていなければ使用しているテンプレートでも結構です。
はじめまして。こちらのスクリプトを追加したかったのですが、追記の文章がそのまま本文の下に表示されてしまうようになってしまっていて困っています。更新しても「続きを読む」にあたる部分が表示されないのです；<!--more_link-->や<!--more-->の部分もちゃんと入っているのですが…よろしければ解決策をお教えいただけませんか？よろしくお願いします！
できました！　ありがとうございましたm(_ _"m)ﾍﾟｺﾘ
CSSにはentry_moreのclass指定がされてるんですが、HTMLにはclass="entry_more"がないようなので、　
<div id="varXYZ<%topentry_no>" style="display: none">　を　
<div id="varXYZ<%topentry_no>" class="entry_more" style="display: none">　にしてみてください。　
これでどうでしょー？
ありがとうございました、出来ました＾＾
けれど、このスクリプトを導入したら、追記の部分のCSSが効いてないようで、フォントカラーの指定が出来なくなってしまいました。
何故なのか・・・＾＾；
記事の頭に戻るようにしているので、<%topentry_title>があるところに挿入しまふ。　
なので、<div class="entry_title">の中にid="<%topentry_no>"を入れてください。（本文中にも解説いれておこうかな…）
以前お聞きして、テンプレートを変更して、再度こちらを参考にしてみたのですが、折りたたみを開いて、元に戻そうとすると、全然違うところに戻ってしまいます。
以前こちらで教わった、
「<h2 class="entry-header"><a href="<%topentry_link>" title="「<%topentry_title>」の永続的URI"><%topentry_title></a></h2>
の　「永続的URI"」　の後にid="<%topentry_no>"を入れてみてください。」

を、試そうとしたのですが、同じHTML記述がありません。
お手数をおかけしますが、再度宜しくお願いします。

テンプレートは　「pinkｰcandle」です。
ありがとうございます！
わかりました！
スタイルシートを拝見したところ、本文全体ではなく<p>タグで囲んだ部分だけにline-heightが指定されているようなので、追記も<p>タグで囲んであげてください。
折りたたみ使用させていただきました！
コピペするだけで、ででででできましたー！
ありがとうございます。

そこで質問があるのですが…
初めての書き込みで申し訳ありません。
追記はすんなり表示できたのですが、行間などの設定は反映されないのでしょうか？
スタイルシートでどこかを変更する必要があるのでしょうか？
基本的なことがわからず、変な質問だったらすみません。
はじめまして。
折りたたみ使わせていただきました。ありがとうございますm(_"_)m。
別にないですよ。ご自由にお使いください。改変もご自由に。
私も勝手に使わせてもらっているようなものですし。
はじめまして。
‘展開・折りたたみ’使わせて頂きました〜。
「追記を読む時＆戻る時のページ読み込みが面倒だなぁ…。」と思っていたところ、こんなにも便利なものに出会えてとても嬉しいです＾＾
ただ一つ質問なのですが、こちらのスクリプト利用の際の規約などは御座いますでしょうか？
現在無断利用の形になってしまってますので、何か注意ごとなどがありましたらお教え下さいませ。
わーん！ごめんなさい！！
確かに＜more＞〜＜/more＞の部分がなくなってました；
入れたらきちんと表示されました。
ありがとうございます！
おそらくですが、<!--more_link-->の部分を変更するときに
<!--more-->の部分も消してしまったのではないかと思います。
テンプレによって多少違いますが、
<!--more-->
<a name="more" id="more"></a> <%topentry_more>
<!--/more-->
のようなものがあったはずなので（余分にDLなどをして）確かめてみてください。
こんばんわです。折りたたみスクリプトをお借りしました。
ただ、こちらのコメントの一番最初の方（yuki様）と同じ症状で困ってます。コメント投稿時などで追記の部分が表示されず…
公式テンプレの「cfdn_p」を少々改造してますが、スクリプトを入れる所は間違ってないと思います（素人なので何とも言えないですが…）
お暇な時にでもブログを見て頂けないでしょうか。
すみません。。
試しにやってみましたが、使用しているテンプレートに当てるのは難しいものですね…（レイアウトが崩れたりと）
でも参考になりました！ありがとうございます☆
単純な折り畳みメニューなら
http://bisco.blog2.fc2.com/blog-entry-11.html#comment84
に書いたサイトを参考にしてみてください。
最初に開けておくか閉めておくかの指定もできたと思います。
ビスコさん初めまして^^
追記の折り畳み、私も借用させて頂きました！
ページを更新しなくていいのが便利ですねｖ

ところでサイドメニューにも応用させたいのですが、可能でしょうか？
増えていくカテゴリやリンクを閉じたままにして、閲覧する時だけ開くようにしたいのです。
あと、カレンダーは開いている状態からクリックで閉じられるようにできたらな、と。（Javascriptに対応していない人はカレンダーが使えるように）
Javascriptの事は全く分からず、自分でいじれません…。
応用が可能でしたら、恐縮ですがお手隙の際にでもご指導頂ければと思います。
よろしくお願い致しますm(_ _)m（ご面倒でしたら構いませんので^^;）
解決したようでよかったです。また何かあったらどぞー。
エンコード、自動選択になってませんでした(汗）。
自動選択にしたらちゃんと文字化けせずに出来るようになりました。
ありがとうございますm(_ _)m
FC2ブログは文字コードがeuc-jpになっているのでその問題だと思います。
ブラウザのエンコードで「自動選択」がチェックしてあれば正しく表示されると思うのですが…（多分
一度確認してみてください。
はじめまして。
折り畳み、やってみましたところうまくいったのですが、
Recent Entriesの記事をクリックして飛ぶと、
ブログ全体が文字化けしてしまうことに気づきました。

慌てて今は初期状態に戻してありますが、何が原因だったのでしょうか。
WindowsXP、IE6.0使用。
エンコードは日本語（シフトJIS）だったと思います（たぶん）。
はじめまして、こんにちは。
折りたたみ式の機能をお借りさせていただきました。
おかげ様で、知人のブログで羨ましくて仕方なかった折りたたみ式を、我が家にも導入することができました。しかも、解りやすくてとても簡単でした。
自分のブログが折りたたみ式になったのが嬉しくて、しばらくの間、アホの子みたいに展開と折りたたみを繰り返して遊んでしまいました。
本当にありがとうございます♪
　できました！

色々と本当にありがとうございました＾＾
HTMLの　<BisEntryIfExtended>　の後に
<div class="moreentry">
と書き入れ、
<div id="varXYZ<%topentry_no>" style="display: none">　の前に
</div>
と入れてください。そして　<%topentry_more><br clear="all">　の後にも
<div class="moreentry">
を入れ、　</BisEntryIfExtended>　の前に
</div>
と入れてください。
そしてスタイルシートの方にどこでもいいので
.moreentry { text-align: right; }
と入れてください。
できました＾＾　ありがとうございます＾＾

ちなみになんですが・・このタグを入れる前は画像は右にしてあったのですが、タグを変えたら左になってしまいました。
戻そうと　<IMG SRC="xxxxxxx.gif" ALIGN="right">にしてみたのですが、これにすると、
「| 2005-02-21 19:08:02 | カテゴリー | Comment : 0 | Trackback : 0　」
のすぐ右側になってしまいました。タグ、どうすればいいんでしょうか＾＾；
HTMLの

<h2 class="entry-header"><a href="<%topentry_link>" title="「<%topentry_title>」の永続的URI"><%topentry_title></a></h2>

の　「永続的URI"」　の後に

id="<%topentry_no>"

を入れてみてください。それで正しく動作すると思います。
　初めまして。テンプレート掲示板からやってきました。
タグをお借りして、設置させていただいたのですが・・・・
【Read More】と【Hide More】を画像に置き換えて設置し、試したのですが【Read More】をクリックしたら、きちんと展開します＾＾
けれど、【Hide More】で閉じようとすると、元のエントリーの頭ではなく、違う部分に飛んでしまいます＾＾；
画像ではダメなのでしょうか＾＾；
折りたたみ機能、ありがたく使わせていただきました！
ありがたや〜！と叫ばせていただきました。
これからも、ちょくちょく参上させていただきます！
どうぞ、よろしくお願いします(*- -)(*_ _)
すっごく簡単に折りたためるようになってしまいました。
もー、感激です。
ありがとうございますっ。
無知なのでホントに助かりましたー。
これからも頼りにさせて頂きたいです。

ものすごい、便利です。これ。
ほんと、ありがとうございました。
それにしてもFC2ブログってほんと、
おもしろいですね。
折りたたみ使わせていただきました！
説明が分かりやすくてすごく参考になりました。
ありがとうございましたm(__)m。
これからも、色々と参考にさせていただきます！！
喜んでもらえて嬉しいです。これからもパタパタと折りたたんじゃってください(´ー｀*)
展開・折りたたみ使わせていただきました。
簡単にスゴイ機能がついてうれしく思ってます♪
とりあえず報告までですが
ありがとうございました。
これからもこういう便利なカスタマイズ
よろしくお願いします！
折りたたみ使わせていただきました。
写真中心なんでちょっと重くなったかな？って感じなんですが、便利なんでＯＫです。
ありがとうございました。
折りたたみ使わせていただきました♪
すごく見やすくなって嬉しいです！
ありがとうございました。
＞あんじぇらさん
私も最初livedoorでやってるのを見て、FC2でもやれないかなぁ〜と調べてみたんです。お役に立てて良かったです。
これからもお世話しますｗ(ぉぃ

＞一桜さん
私も実はjavascriptのことよく知らないんですよねぇ…。元のスクリプトに頼りきりです(汗
展開・折りたたみ、使わせていただきました。
javascriptはよくわかりませんが、
ブチ込みで簡単にできましたよ〜
ありがとうございました！
展開･折りたたみ、MTじゃないと出来ないと思ってたので、
自分のブログで出来て感動です！！
有難うございました。

またテンプレのサムネイルも非常に便利です。
これからもお世話になります(^^
＞すしバーさん
喜んで貰えてよかよか。
実は長い文を書くのが苦手な私なのにこんなものを公開してるという…

＞Ｍａｐｐｙさん
いえいえいえ。
お、パスワードのトコに気付くとはお目が高いｗ
「ブログイン」のボタンもアホらしさ満開です。
こんにちは。
わかりやすく教えていただいて、他のテンプレもうまく変更することができました。どうもありがとうございました。
・・・いつ来ても「？」と思ってしまいます（笑）
「パスワードを忘れたら」では笑わせていただきました。
感服いたしたした。
だらだらと長文を書くことが好きな私ですが、これで心置きなく長文を垂れ流せます。
閲覧してくれる方にも優しい仕様にできました。ありがとうございました。
直ってよかったですね〜(*´ー｀)
テンプレいじってての失敗は私もよくやりますｗ
今はメモ帳に保存しておいて失敗してもいいようにやってますけどね。
オリタタンジマイナー！（微古

今までは 30〜50hit／日 だったのが急に400オーバーでビックリしてます(谷 ；)
また何かあったら気軽にどうぞ〜
自分のソースチェックしました。。。
ホンッットに申し訳ない(苦)。
新しくテンプレ追加して、試すと一発でしっかりできたじゃないですか。って事は・・・。
自分のテンプレいじりすぎて何がドコかわからない状態で、このタグをぶち込んでました。。
今じゃ、バチバチ折りたたんでます。
それより、FC2のトップページのランキングに入ってましたよ。
大っっ変ご迷惑かけました。
う〜ん、何でかなぁ？ ('･c_･` )
差し支えなかったらyukiさんのブログのURLを教えてもらえるといいのですが…。
ついでに言えばソースなんかも覗かせてもらえばわかるかも知れません。
よしなに。
はじめまして。"折りたたみ"すごい気に入って使わせてもらってます。しっかり動作しています。だけど、自分のところでは、コメントやトラックバックする時の画面(リセントエントリなどのリンクから一つの記事に飛んだ場合)には、追記が表示されません。このまま折りたたみ使っていきたいのですが、追記が表示されないとイカンとこがあるのですが。。。

Trackback

カスタマイズ

土曜日と日曜日の色を変える。http://webbingstudio.blog10.fc2.com/blog-entry-110.html追記の展開と折りたたみ。http://bisco.blog2.fc2.com/blog-entry-6.htmlこちらの2箇所で上手くいきました。

追記の折りたたみ

Blogを書く事にも慣れてきて色々とカスタマイズしてみたくなってきました。（それほど記事も書いてないのに・・・）続きを読むボタンを押すとリログするのが嫌いなんです。そのまま表示して欲しいんです。という事

記事の続きが（追記部分）折りたたみでスムーズ！

これは素晴らしい！！今まで、ず〜っとしたいと思っていた記事追記部分の折りたたみ！ついに成功したよ〜！！ヽ(´ー｀)ノそもそも私はついつい長い文章書いちゃうんです。書き始めると止まらなくて・・・(　-人-)

［ブログ］テンプレ変更中

テンプレいじってたら変なことになってしまった…。前のテンプレはIE6で見ると崩れてたし、もうこの際どうせだからテンプレごと変えちゃいます（また）。ちょっと変なところがチラホラあると思いますが、ご辛抱を。

追記を更新せずに開閉する

　ここのブログでは、記事の一番下の左にある「追記を読む」のリンクをクリックすると、記事全体をもう一度更新して、追記部分が表示されています。それでは、「追記を読む」をクリックするのが面倒となってしまっています。

「追記」を展開

2日続けて似たような話題ってどうかなぁと思いつつも、またブログを少し弄ったので報告。今までだとアニメ感想のネタバレなどは、追記部分に追いやって見たい人だけ「続きを読む」から個別記事にアクセスしてもらうように

やっとできた……。

　今まで、追記部分はクリックしたらページ移動してしまう仕様だったのですが、折りたたみ仕様にして、ページ移動をしないようにできました。　これで変にカウンタも回らないぞ、と

テンプレートの改造

　テンプレートに改造を施したので、一応書いときます。　数日前にテンプレートの横幅のズレを修正。　直しているうちに横幅がさらに大きくなってしまい、XGAでぴったり位のサイズ

追記の折りたたみ、開閉

アジアンビートカンケリキッズさんの記事を参考に【続きを読む】をクリックすると、その場（同じページ）で追記を表示【続きを隠す】をクリックすると、その記事のタイトル部分（

追記の折りたたみにチャレンジ！

ずっといじりたかったのに時間がなかったブログのカスタマイズ。...というか待って、もう１２月で冬だっていうのにいつまで秋色なんだろうこのブログはorzということで（？会え

追記を折りたたみ

久々にブログカスタマイズしてみた。前に比べて、カスタマイズを紹介してくれてる初心者向けサイトが少ないような気がして、暫く何もいじってなかったけど。これは、

カスタマイズ(3)〜折り畳み〜

ブログのカスタマイズも進んできました。こんなことばっかりやっていてよいのか非常に疑問ですが…はまっています。今回は、｢追加記事の折り畳み｣に挑戦しました。｢続きを読む｣ってやると、新たにページを読み込んでしまうので、JavaScript

追記の展開・折りたたみ

元のテンプレートが「続きを読む」はあるものの一度開くと閉じる事が出来なかったのでカスタマイズ。 アジアンビート カンケリキッズのビスコさんで紹介されてます。ありがとう

追記の折りたたみ。

今更ながら、追記の折りたたみをしてみました。自分の記事を読み返す時なんかに Read More? をクリックして個別エントリーに飛んじゃうと、他の記事をどこまで読んだのかわからなくなってしまうし、また戻ってくるのが大変だなと思ったので。コレだとそのページのままで続き�
  • 2005-08-18
  •  / feel

「続きを読む」の展開＋折りたたみ

今までなら、追記部分に記事を書くとメインページにて「続きを読む」というアナウンスが貼られ、クリックすると、個別ページ全てを読み込んでいました。これでは、読み込み時間がかかって、私はちょっとイライラを感じていたんです。ＭＴにも「続きを読む」を折りたたむカス�

『続きを読む』を折りたたむ

記事内の【続きを読む】をクリックすると、記事の単独ページに飛んでしまって、たまに時間がメチャクチャかかってしまうので、その記事の続きをその場で見る事が出来るように…というもの。ビスコさんのFC2BLOGなのか？を元にカスタマイズしてみました。

briefing for job applicants

I must think about preparations for portfolio making. And, I decided to do preparations to make a business card.

【カスタマイズ】追記折りたたみ・展開

FC2に移ってから初めてのカスタマイズ記事ですね。FC2内でカスタマイズ記事を探していたところ、FC2ブログなのか？さんで追記の展開・折りたたみというものを見つけました。本来ならば「追記」の リンクを押すと1記事表示画面が開いて追記部分が表示される訳ですが、これを使

ブログカスタマイズ

ブログのカスタマイズ知識が乏しいので、色々検索したところ、「続きを読む」を再読み込みなしで行えるというすばらしい記述に出会いました。参考ブログ：FC2 BLOGなのか？さん実際に導入するとこのようになります。↓...

ＦＣ２で追記の展開・折りたたみ

追記を再読み込みせずに、続きを表示する方法です。。。ブログを開くときに追記の部分も一緒に読み込むので、私のブログのように写真の多いサイトさんはTOPがチト重くなりますが、追記を読む時に再読み込みしないので、重い時のストレスが解消(^▽^;)こんな感じです。。。ク�

追記の折りたたみ

ＫＵＭＩ☆ふぉとさん経由、FC2 BLOGなのか？さんを参考にして、【Read More】 を折りたたみできるようにしました。こんな感じです。
合計 + 今日 + 昨日