2008-11-01

用 CSS 實現 blogger [繼續閱讀]的方法

雖然與白花花所寫的在blogger實現繼續閱讀的作法是用同樣的方法,但為了增加使用上的彈性,我做了不一樣的基本設定,讓任何 HTML Tag 只要套用 fullpost 這個 ClassName 就可以在部分閱覽中隱藏。 在 <b:skin> 中的 CSS 設定:
/*部分隱藏樣式*/
.posts-index .fullpost{
  display:none;
}
在詳細樣版中找到 <data:post.body/> 這行,並修改成以下形式:
<div expr:class='"post-body
     entry-content
     posts-"+data:blog.pageType'>
  <data:post.body/>
  <div style='clear: both;'/> <!-- clear for photos floats -->
<!-- 非單篇顯示時,顯示繼續閱讀 -->
<b:if cond='data:blog.pageType != "item"'>
 <p>
 <b:if cond='data:post.link'>
   <a expr:href='data:post.link'>繼續閱讀...</a>
 <b:else/>
   <a expr:href='data:post.url'>繼續閱讀...</a>
 </b:if>
 </p>
</b:if>
</div>

沒有留言:

張貼留言

你好!歡迎你在我的 Blog 上留下你寶貴的意見。