「続きを読む」ボタンの導入

Last Update : 12/May/09
Bloggerには「続きを読む」ボタンを記事内に追加する機能が用意されていません。

下記サイトを参考にスタイルシートを書き換え、各投稿のソースも弄りました。

・クリボウさんのBlogger入門http://blogger.kuribo.info/2006/02/blogger_20.html

まず、スタイルシートに下記赤字部分を追加します。

<b:widget id='Header1' locked='true' title='アドエス覚書 ～へなちょこおたくメモ～ (Header)' type='Header'>
<b:includable id='title'>
  <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <data:title/>
  <b:else/>
    <a expr:href='data:blog.homepageUrl'><data:title/></a>
  </b:if>
</b:includable>
<b:includable id='description'>
  <div class='descriptionwrapper'>
    <p class='description'><span><data:description/></span></p>
  </div>
</b:includable>
<b:includable id='main'>

  <style type='text/css'>
    <b:if cond='data:blog.pageType == "item"'>
      .fullpost {display:block;}
      .readmore {display:none;}
    <b:else/>
      .fullpost {display:none;}
      .readmore {display:block;}
    </b:if>
  </style>

  <b:if cond='data:useImage'>
    <b:if cond='data:imagePlacement == "REPLACE"'>

次に、各記事内で下記タグを使って記述します。

見出し

<div class="fullpost">

本文

以上</div><div class="readmore"><a href="この記事のurl">[続きを読む]</a></div>

新規投稿作成用のテンプレートに上記タグを登録しておくと便利です。

以上

[続きを読む]