PrestonCafe

Tuesday, June 29, 2004

Blogger.comにRead More機能を追加する

Blogger.comを使ったウェブログではMTのように追記部分(Extended)がないのでエントリーの内容がトップページで表示されている間指定した数のエントリー全文がすべて表示されてしまいます。興味のあるエントリーはRead Moreをクリックすると読めるようにできれば一覧性が増します。Blogger.comのテンプレートとスタイルシートを改造してRead More機能を追加してみましょう。

More...

詳しい内容はBlogger Help : How can I create expandable post summaries?に解説されています。要点を以下にまとめます。

テンプレート内の上部にあるスタイルシート記述部分に以下のコードを入れておきます。
外部スタイルシートをlinkタグで入れている場合は直接スタイルシートファイル内に追加します。

<MainOrArchivePage>
   span.fullpost {display:none;}
</MainOrArchivePage>

<ItemPage>
   span.fullpost {display:inline;}
</ItemPage>


同じくテンプレートの中の本文表示部分から


<$BlogItemBody> tagのあとに

<MainOrArchivePage><br />
   <a href="<$BlogItemPermalinkURL$>">Read
More!</a>
</MainOrArchivePage>


というのを加えておきます。

それではエントリー投稿時の設定です。上記のようにテンプレート内にスタイルシートで分けるようにしたのでクラス名で追記にしたい部分を囲んであげるとRead Moreを押してエントリー全文に飛ぶようになります。(permalink)


<span class="fullpost"></span>

しかしいちいちこのタグを毎回書くのは面倒です。そんなときにPostテンプレートがありますのでdashboardよりFormattingを開き一番下の Post Templateに加えておきます。

そうするとPostする際にあらかじめこのタグがtextarea内に入っているので必要なければ消せばOKです。Postテンプレートが有効になるのはDashboard内からのPostですのでBlogThisを使った場合はこのタグは表示されてきません。

同じように決まり文句から始めたり特殊なタグをよく使う場合はこのPostテンプレート機能を使うと便利でしょう。

長めのエントリーではこれを使うと便利です。このエントリー6/29分と6/21分に長めのエントリーがありましたのでPrestonCafeトップページでの表示とPrestonCafe: 06/01/2004 - 06/30/2004での表示を見てもらうと例としてわかりやすいと思います。

1 Comments:

  • Readmore機能、できました。
    どうもありがとうございます、ただこちらのソースをコピペしたらできなくて、
    もとのhelpの方をコピーしました、なんでかな。

    By kaori, at 2:38 PM  

Post a Comment

Links to this post:

Create a Link

<< Home