FC2ブログのテンプレート工房

カスタマイズが簡単な共有テンプレートを配布しています。テンプレートをカスタマイズして自分だけのオリジナルブログを作りませんか？

追記【続きを読む】を同一ページに表示させる

追記表示(続きを読む)をページ遷移させることなくシームレスに同一ページに表示させる方法を紹介します。
この機能は現在(2006/09/01以後 Ver.7)には標準装備されています。それ以前のバージョンをお使いの方は下記を参考にカスタマイズしてください。

このカスタマイズはABCK(アジアンビートカンケリキッズ)さんの追記の展開・折りたたみを参考にアレンジしました。

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

<head>
～
<script type="text/javascript">

</script>
～
</head>

更に下記箇所を変更します。


～
<a href="<%topentry_link>#more">続きを読む</a>

<hr class="tuduki" noshade size="1">
<%topentry_more>
～


この部分を次の記述に書き換えてください。


～

<div id="varP<%topentry_no>">
<div class="readmore"><a href="<%topentry_link>" title="続きを読む" onclick="showMore(<%topentry_no>,'<%topentry_link>');return false;">【続きを読む】</a></div>
</div>
<div id="varXYZ<%topentry_no>" style="display: none">
<div class="readclose">
<a href="#entry<%topentry_no>aa" title="続きを閉じる" onclick="showMore(<%topentry_no>,0);return true;">【続きを閉じる】</a></div>
<%topentry_more>
</div>


<%topentry_more>
～


最後にスタイルシートに次の記述を追加します。

/* 続きを読む・閉じる */
.readmore {
margin-top: 10px;
}
.readclose {
margin-top: 10px;
margin-bottom: 10px;
}

これで追記が同一ページで表示されます。変更箇所が多いのでバックアップをとってから挑戦することをお薦めします。

関連記事

トップページのみ３カラム、他の個別記事ページ等を２カラムにする。 (2006/12/23)
便利ナビの背景を画像にする (2006/12/11)
プラグインカテゴリ３のデザインを変える (2006/09/10)
追記【続きを読む】を同一ページに表示させる (2006/09/09)
サイト名でコメントリンクを貼る (2006/09/08)
記事で大文字を使っても文字が重ならないようにする (2006/08/20)
コメント(CM)のリンク先設定 (2006/08/16)

[ 2006/09/09 23:35 ] カスタマイズ standard 専用 | TB(3) | CM(62)

≪ プラグインカテゴリ３のデザインを変える | HOME | サイト名でコメントリンクを貼る ≫

[ 544 ] 追記について教えてください

はじめましてこんばんは！けろのりと申します。
最近fullmoon_howlingのテンプレートをお借りしてブログを始めました。初心者なもので、続きを読むの表示方法がわからず困っております。
このテンプレートは続きの設定は標準装備されていると思うのですが、
どうすれば記事内に続きを読むという風に表示させて、記事を折りたたんだり出来るのかがわかりません。記事にただ続きを読むと書いても何もならないですよね？リンクとかさせるのですか？何かやり方があるのでしょうか？自分なりに調べたのですが、お手上げなもので、教えていただけないでしょうか？

[ 2006/09/16 23:12 ] [ 編集 ]

[ 545 ] > けろのりさん

こんばんは、けろのりさん。
いつも記事を書き込む画面の少し下を見てください。別の入力箇所があります。そこに書き込んだものが「続きを読む」で開かれる部分となります。
はじめたばかりとは思えないほどよくカスタマイズされてますよ＾＾
その調子で頑張ってくださいね。

[ 2006/09/16 23:36 ] [ 編集 ]

[ 546 ] ありがとうございます

こんにちは！
回答ありがとうございます。早速試した所ちゃんと出来ました！
いつも下書き状態でしか確認していなかったので、うまく出来なかったようでした。本当にありがとうございます。これからもよろしくお願いします。

[ 2006/09/17 13:46 ] [ 編集 ]

[ 549 ] > けろのりさん

こんばんは、けろのりさん。
早速追記で書きましたね。また何かあれば聞いてください。もっとも私にも解からないことばかりですが＾＾；

[ 2006/09/17 22:08 ] [ 編集 ]

[ 551 ] ご教授下さい

テンプレートを使用させて頂いております。ありがとうございます。
旧バージョンに、リリースされてる新機能を付け加えてるのですが、
追記表示をシームレスに同一ページに表記した場合に、コメント欄まで表示出来る方法とかはあるのでしょうか？
知識・見識が乏しいもので、よろしくお願い致します。

[ 2006/09/18 01:32 ] [ 編集 ]

[ 553 ] > ゼットンさん

おはようございます。ゼットンさん。
ABCK(アジアンビートカンケリキッズ)さんがコメントの折りたたみを紹介しています。
http://bisco.blog2.fc2.com/blog-entry-121.html
こちらの記事を参考にすれば出来そうな気もします。
実は以前にこのカスタマイズを試みて恥ずかしながら上手くいかずに断念したことがあります。今思えば「環境設定の変更」→「ブログの設定」のページの一番下にある<%topentry_comment_list>を有効に設定していれば出来たのかなと思っています。
ちょっと難しいカスタマイズだとは思いますが頑張ってくださいね。

[ 2006/09/18 08:46 ] [ 編集 ]

[ 559 ] 追記をページ遷移させる方法に戻す方法

いたおさん、どうも初めまして
standard_monotoneのテンプレートを使わせて頂いている
はーくるという者です。追記【続きを読む】をページ遷移させる方法に戻すにはどうすればいいのでしょうか？

自分なりにやってみたらメチャクチャになってしまい
お手上げ状態に･･･。お手数をお掛けしますが
何卒、よろしくお願いします

[ 2006/09/19 15:42 ] [ 編集 ]

[ 616 ] 使わせていただきました。

fc2で追記を同一ページに表記する方法がわからず、悩んでいたのですがおかげさまでカスタマイズできました。
ありがとうございました。m(_ _)m

[ 2006/10/06 15:47 ] [ 編集 ]

[ 619 ] > fuulさん

こんばんは、fuulさん。
ブログも本サイトも拝見しました。作成されてる共有テンプレートも写真素材も素晴らしいです！激しく影響されてしまいました。私も素材屋やろうかな＾＾；

[ 2006/10/07 00:13 ] [ 編集 ]

[ 739 ] やってみました

この機能、とてもいいですね～。
続きを読むがすぐに表示され、かつすぐに閉じれる。今まで以上にブログが良くなりました。
これからもいい素材、アドバイス期待しています。

[ 2006/11/04 09:27 ] [ 編集 ]

[ 745 ] > 源八さん

こんばんは、源八さん。
有難う御座います。これからもいい素材を提供できるように頑張ります。源八さんもなにかご希望、ご要望の機能があったら教えてくださいね。可能な限りお答えしますよ。

[ 2006/11/06 23:39 ] [ 編集 ]

[ 837 ] 追記について

初めまして。

追記についてですが現在、私のブログの仕様だと記事URLに直接飛ぶと続きを読むのリンクが表示されず、追記の内容がイキナリ全て見えるようになっています。

これを、記事URLに直接飛んでも追記の内容を開かれずに、続きを読むのリンクを表示させる方法はあるのでしょうか？

なんかあまり意味の無い行為かもしれませんがやり方がありましたらご指導の程宜しくお願いします。

[ 2006/12/02 23:20 ] [ 編集 ]

[ 838 ] 追記について2

2度目の連続投稿申し訳ありません。

詳しく言うと…
つまり、他のサイトからのリンクから指定記事に直リンクしてしまっても追記の内容を開かせず、一旦『続きを読む』を押させようとする方法があるのか？という事になります。

分かりにくい内容で大変申し訳ありませんがご指導のほど宜しくお願いします。

[ 2006/12/02 23:27 ] [ 編集 ]

[ 843 ] > 田中さん

こんばんは、田中さん。
なるほど、これはちょっと変則的な使い方ですね。
よくよく調べれば存在するのかも知れませんが、現時点ではこれを実現する方法が解かりません。力及ばず申し訳ありません。
もし何か解かればお知らせしますね。

[ 2006/12/03 21:50 ] [ 編集 ]

[ 845 ] 追記について2

お返事ありがとう御座います。
確かにちょっと特殊なやり方ですよね。
自分でも色々試したんですが中々うまくいかなくて、いたお様に質問しました。
もし何か良い方法がありましたらお知らせ頂ければ大変嬉しいです。

[ 2006/12/03 23:38 ] [ 編集 ]

[ 850 ] > 田中さん

こんばんは、田中さん。
かなり以前に不可能だと思えていた質問が実は可能であることに気づくという事がたまにあります。この機能も実は可能なのかもしれません。
いつそれに気付くか解かりませんが気を長くしてお待ち下さい。

[ 2006/12/06 00:00 ] [ 編集 ]

[ 2054 ] はじめまして

初めまして。
最近ブログを始めた者です。
色々自分でカスタマイズしていってるのですがこの機能はすごい見やすく出来ていいですね。
満足しています。
ところが一つわからない点が御座いまして、続きを読むを押すと追記の文が出て来るのですがそのその追記の文の文字が見出しの文字よりも小さく表示されて出てきます。
どこを変えると文字の大きさを均一に出来ますか？
説明が分かりづらくてすいません。
お願いします。

[ 2007/06/04 05:27 ] [ 編集 ]

[ 2055 ]

解決しました。
お騒がししました。
すいません。

[ 2007/06/04 07:02 ] [ 編集 ]

[ 2069 ] > yukiさん

解決おめでとうございます。
私も回答が遅く申しわけありませんでした。

[ 2007/06/04 23:50 ] [ 編集 ]

[ 2674 ] はじめまして

とても使い勝手のいい折りたたみだと思います。

でも、私は折りたたみをせず前の状態で使えれば嬉しいのですが・・・
この折りたたみをしない、前の状態で使いたいときは
どうすればいいのでしょう。

[ 2007/08/28 16:35 ] [ 編集 ]

[ 2677 ]

これです。
ありがとうございます！
探せてなかったみたいでした。すみません。
お手数おかけしました。
さっそくやってみます！ありがとうございました。

[ 2007/08/28 23:52 ] [ 編集 ]

[ 2680 ] > tomoさん、かどりんさん

いつも本当に有り難うございます、かどりんさん m(__;)m
tomoさん、かどりんさんが教えてくれた記事でお望みの動きになるかと思います。カスタマイズ頑張ってくださいね。

[ 2007/08/29 00:03 ] [ 編集 ]

[ 2773 ]

はじめまして。
"続きを読む"の機能を残したまま、"続きを読む"と同じように続きが読めるリンクを別の言葉で表現したものを"続きを読む"とは別に作りたいのですが、それって可能なんでしょうか？なんかややこしいですが･･･。

もしダメでも他に良い方法があれば是非教えてください。

[ 2007/09/23 22:39 ] [ 編集 ]

[ 2775 ]

それは簡単じゃないでしょうか？
zepさんは、lightframeタイプを利用しているようなので、テンプレートのHTML部分にこの記述があると思います。


<div><a href="<%topentry_link>#more">続きを読む</a></div>


<%topentry_more>


例えば、「続きを読む」を、「コチラへどうぞ」と変えたければ、これで変わりますよ。


<div><a href="<%topentry_link>#more">コチラへどうぞ</a></div>


<%topentry_more>


こう言うことではないのでしょうか。

[ 2007/09/24 00:04 ] [ 編集 ]

[ 2776 ]

＞あなろぐさん
ご返答ありがとうございます。
それを"続きを読む"とは別にもう一つ作りたいんです。なので、複数のパターンの"続きを読む"を置きたいんです･･･。言葉を変えるのではなく、違う言葉のパターンの"続きを読む"をもう一つ追加したいと思っているんです。
やっぱり難しいんですかね･･･。

[ 2007/09/24 00:56 ] [ 編集 ]

[ 2778 ] zepさんへ

ゴメンナサイ。少し調べたのですが、「続きを読む」を同一記事で複数、書いているサイトを見たことがございません。

もしご覧になった経緯があればアドレスを教えていただけませんか？

個人的には、FC2の管理画面にて　『親記事』　『追記の編集』の二箇所しか入力が出来ない為、難しいかな？と予想しております。

[ 2007/09/24 16:26 ] [ 編集 ]

[ 2780 ] zepさんへ

「続きを読む」とは別に、ということで、
記事文章の一部を表示-非表示で切り替えたい、
ということだと思いましたが、どうでしょう？

それならば、非表示にしたい部分に「折りたたみ」を使えばいいんじゃないかと。

『プラグインの折りたたみ』を参考にして記事を編集してはどうでしょう？

全文用意しておく必要があり、
さらに一度全文読み込んでから非表示にするために
内容が多ければ多いほど表示速度が遅くなりますが…。

[ 2007/09/24 23:59 ] [ 編集 ]

[ 2781 ]

＞zep さん
なるほど、意味が理解できました。
1ページに複数の「続きを読む」を取り入れたいという事ですね？これは僕の薄い知識では分りません。
ごめんなさい。
ただ、論理的には可能だと思います。
ですが、このFC2ブログの管理画面自体に、追記を複数展開できる機能がないため、テンプレートをカスタムしても難しいのではないかと思います。
あまり役立たず、申しわけありませんでした。

[ 2007/09/25 09:26 ] [ 編集 ]

[ 2784 ]

＞マコ♂さん
あ、否、どこかで見たというわけではないんですが、そういうのは出来ないのかなぁと思いまして･･･。やっぱり難しいですよね･･･。

＞ゆうにぃさん
そうなんです、おっしゃる通りです。でも折りたたみにしてしまうとまた弊害が出てきてしまうんですよね･･･。

＞あなろぐさん
いえ、こちらこそ訳のわからないようなことを言ってしまってなんだか逆に申し訳ないです･･･。

やはり続きを読むにこだわっては難しいようなので他の方法を探してみます。みなさま、ご迷惑をおかけしました。そして、親切な対応ありがとうございました。

[ 2007/09/26 23:50 ] [ 編集 ]

[ 3021 ] FF11】ロンフォール歌付きVersion

"にこにこで発見しましたおなじみのロンフォールの曲","で歌詞つけて歌ったみたいです。超ウマイｗ …",http://www.lineagecojp.com/movie/mov0025.zip

[ 2008/01/06 12:54 ] [ 編集 ]

[ 3074 ] はじめまして

ＦＣ２でブログをやっています。初心者なので続きを読むのやり方がわからなくて、こちらに伺いました。
記事の通り一応やりましたが、「続きを読む」が表示されなくて、そのまま本文文章の下に追記した内容が直接出るような形になっています。
あとは何をすれば良いんでしょうか？；

[ 2008/01/27 20:25 ] [ 編集 ]

[ 3080 ] ありがとうございます

　ありがとうございます
自分にもできました。

ちょ～うれしぃです。

[ 2008/02/01 01:12 ] [ 編集 ]

[ 3167 ] RO」のタグを含む動画

月夜花http://www.2ch22.com/2ch00358/00358.zip

[ 2008/03/10 19:24 ] [ 編集 ]

[ 3177 ] 使わせていただきました┏○ ﾍﾟｺﾘ

はじめまして。
コチラのテンプレートを使用してはいないのですが
追記の展開カスタマイズを探してこちらに辿り着き、使わせていただいたところ
問題なく設置できたので、とても幸せになれました(*´д｀*)
本当にありがとうございます┏○ ﾍﾟｺﾘ
テンプレ使用者以外が、こちらのカスタマイズ方法を利用するにあたっての規約など
探してみたのですが見当たらず･･･。もしあれば、ご連絡ください！

[ 2008/03/13 19:12 ] [ 編集 ]

[ 3204 ] GOM PLAYER

シンプルで使いやすいユーザーインターフェース。

[ 2008/03/31 23:20 ] [ 編集 ]

[ 3233 ] はじめまして

感想のところにカキコしに行ったのですが、どうしてもフリーズして
表示ができなかったので、こちらに感想を書きますね。
「続きを読む」の設定方法を探していて、いたおさんのブログにやってきました。
早速テンプレートをお借りして、試してみたのですが上手く表示されて、
理想の型に近づけたのでほんと感謝な気持ちで一杯です。

また色々と、伺うこともあるかなと思い
リンクフリーということなので、張らせてもらいましたが
不都合な点がありましたら教えてくださいm(._.*)m

[ 2008/04/24 13:08 ] [ 編集 ]

[ 3429 ]

折りたたみ表示でやってみたくて、ここを見て、やってみると
できました～
ありがとうございました。

[ 2008/06/30 04:27 ] [ 編集 ]

[ 3525 ] はじめまして

ネットサーフィンして、たどり着きました。
悩みが解決しました。
ありがとうございます。

[ 2008/09/11 10:25 ] [ 編集 ]

[ 4557 ] 続きを読む機能で困ってます…

始めまして！
この記事を参考に「続きを読む」機能をつけました。
しかし、続きの部分に動画を載せたんですが、
「続きの部分を開いた場合」と、
「その記事自体を開いた場合」とでは表示が異なってしまうんです…。

具体的に言うと、記事自体を表示すると追記に乗せた動画が2個表示されるようになってしまって…。

文章力が乏しいもので、うまく説明できなく申し訳ありません。
お忙しい所だとは思いますが、是非解決の方法を教えてください。よろしくお願いします。

[ 2009/06/01 19:20 ] [ 編集 ]

[ 4561 ] > 魔法使いさん

上書きするべきところを少し残してしまったようですね。

からで囲まれた<%topentry_more>が２つあるときにこの現象は見られます。１つを削除してください。

特に他のカスタマイズをしていなければ、もう一度テンプレートをダウンロードしてからこのカスタマイズを正しく施すほうが早いかもしれません。

[ 2009/06/02 02:12 ] [ 編集 ]

[ 5004 ]

この方法で同一ページに表示させることができました。
次に続きを読むをアイコン化し、なんとか成功はしたのですが、画像の周り？が線に囲まれてしまいます。
囲まれないようにするにはどうすればいいでしょうか。

[ 2009/07/19 10:56 ] [ 編集 ]

[ 5006 ] ▼Loyさん

<img src="画像URL" width="<img src="画像URL" width="画像の横幅" height="画像の高さ" alt="カーソルを合わせた時に表示される文字" border="0" />
とすれば良いです。

ブログに掲載する画像全ての枠を表示させたくないのであれば、スタイルシートの一番下に
img { border-style:none;}
と入れておけば、以後上の「border="0"」を付けなくても枠が表示されなくなります。

[ 2009/07/19 15:36 ] [ 編集 ]

[ 5011 ] ちゃんさん

うまくいきました。
ありがとうございました

[ 2009/07/19 20:40 ] [ 編集 ]

[ 5017 ] > Loyさん、ちゃんさん

> Loyさん
ちゃんさんのおかげで解決できたみたいですね。良かったです。

> ちゃんさん
ありがとうございました＾＾

[ 2009/07/20 00:06 ] [ 編集 ]

[ 5953 ] ちょっと変です。

記事の前半（続きを読むの前）に、
<a href～> </a>を入れると、
表示が変になるのですが。
私のところだけでしょうか?

記事の後半（続きを読むの後）では、
何ともありません。

一応記事テストで見ることが出来ます。
横カレンダーの2009/9/9から入ってください。

[ 2009/09/09 20:38 ] [ 編集 ]

[ 5956 ] > さくらいさん

HTMLとCSSをメールで送ってもらっていいでしょうか。
よろしくおねがいします。

[ 2009/09/10 00:26 ] [ 編集 ]

[ 5960 ] 管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

[ 2009/09/10 07:32 ] [ 編集 ]

[ 5962 ] なぜか大丈夫

先ほど確認したら記事「テスト」はなぜか直ってました。
なぜでしょうか?

出る記事と出ない記事があるようです。
よくわかりません。

[ 2009/09/10 14:49 ] [ 編集 ]

[ 5966 ] 管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

[ 2009/09/10 16:28 ] [ 編集 ]

[ 5972 ] > さくらいさん

リンクタイトル( <a title="～"> )の中に「"」や「>」が含まれていると不具合が起きると思います。

ちなみに私へのメールはこちらの記事からおくれますよ。

管理人へメールで問い合わせ
http://10plate.blog44.fc2.com/blog-entry-272.html

[ 2009/09/10 22:14 ] [ 編集 ]

[ 5975 ] なぜか送れません

HTMLを送るこつがあるのかな?
添付は出来ないようだし。

私はてっきり、
title="<%topentry_more>"かtitle="<%topentry_body>"
にすると、文章が長い時にオーバーフローでもしてるのかと思ってました。
title="続きを読む"に戻すと平気なので。
また、scriptは全然わかないもので…
すいません。

[ 2009/09/10 22:34 ] [ 編集 ]

[ 5982 ] > さくらいさん

申しわけありません。NGワードの関係でHTMLが送れないようになってました。今は送れるようにしましたが、HTMLほどの量のものは一度には送れないようです。

なかなかこのメールフォームにも制限があるようです＾＾；
原因がリンクタイトルと解ったのでHTMLはもう送らなくても大丈夫ですよ。

ちょっとリンクタイトルの文字数制限がいくつまでなのか解りませんが、多すぎるとエラーになるかも知れません。
リンクタイトルの内容も影響すると思いますが、「"」が複数あればまず崩れると思います。

[ 2009/09/10 23:52 ] [ 編集 ]

[ 5983 ] 了解です

原因は、「リンクタイトル」か「"」と言うことですね。
わかりました。
仕様と言うことで、しようがないですね＾＾；

色々といじると、詳しくないのにお願いばっかりですいません。
また、いつも丁寧に返事を頂いて感謝の念が絶えません。

[ 2009/09/11 00:03 ] [ 編集 ]

[ 5989 ] > さくらいさん

ハッキリした原因は解らないのですが、変なタグや「"」がリンクタイトルに含まれると不具合を起こす可能性が高いので、追記の内容をリンクタイトルにするのは控えたほうが良いと思います；

[ 2009/09/11 18:49 ] [ 編集 ]

[ 7239 ] 追記は、RSS リーダに表示されませんか？

このテンプレートを使っています。新しい記事を増やして、消すとどうなるか分からないので、怖くて、まだ試してないのですが、このテンプレート使って追記に書いても RSS に表示されないようになっているのでしょうか？それが希望なのですが、動作確認出来ておりません。RSS リーダの方で続きを読むを表示したら、きちんとブログに完全に記事が表示されるようになっているのか教えて欲しいです。

[ 2009/12/01 00:17 ] [ 編集 ]

[ 7240 ] フィードに続きを読むが表示されないのは FC2 の仕様ですか？

フィードに続きを読むが表示されないのは FC2 の仕様でしょうか？先ほどの続きなのですが、実際に試した所、この便利なテンプレートの続きを読む表示で RSS に追記が表示されない事が確認出来ました。しかし、フィードでは、続きを読むのリンクが貼られていないのです。これはどうしてでしょうか？FC2 の仕様でどうにもならないのでしょうか？もしフィードにも続きを読む表示が出来る方法があれば教えて下さい。

[ 2009/12/01 00:27 ] [ 編集 ]

[ 7241 ] > 藍子さん

RSSに追記部分は表示されません。ちなみにこれはどのテンプレートを使っても同じですよ。

RSSに「続きを読む」が表示されないのはFC2の仕様のようです。こちらのコメントも参考にしてください。
http://10plate.blog44.fc2.com/blog-entry-252.html#comment6900

[ 2009/12/01 00:32 ] [ 編集 ]

[ 8601 ] 承認待ちコメント

このコメントは管理者の承認待ちです

[ 2010/03/07 15:23 ] [ 編集 ]

[ 8662 ] できました

ちゃんとできましたｗ
とても便利で助かってます！
ありがとう！！

[ 2010/04/14 01:19 ] [ 編集 ]

[ 8741 ] 承認待ちコメント

このコメントは管理者の承認待ちです

[ 2010/09/28 20:57 ] [ 編集 ]

[ 8742 ] 承認待ちコメント

このコメントは管理者の承認待ちです