網頁

在 Blogger 中使用 隱藏全文 / 繼續閱讀 的功能

[ 前言 ]
隨著時間 Blogger 文章越寫越多,內容也越來越豐富,這時候可能會發現一個問題,怎麼在首頁卷軸要拉好久才拉到底部,例如 1 篇文章有 50 行,那麼 7 篇文章就有 350 行了,真是好長一串阿,這樣會有什麼情況發生呢?
  • 版面感覺很亂不整齊。
  • 讀者不容易挑選自己想閱讀的文章。
  • 因全文顯示而讀取速度慢,使得讀者沒耐心而離開。
為了改善上述的問題,因此 小K 在網路上找到一篇 Blogger Beta 中 Read More 與 Archive 只顯示標題 的文章,使用方法很簡單,不多說,趕快看看怎麼使用吧。

[ 隱藏全文 / 繼續閱讀 的使用方法 ]
步驟 1.

到 Blogger 管理頁面 -> 版面配置 -> 修改 HTML,並且把「小裝置範本打勾」,搜尋</b:skin>,並且在</b:skin>下方加入下列程式碼。
<b:if cond='data:blog.pageType == "item"'>
   <style type='text/css'>
     span.fullpost {display:inline;}
   </style>
   <b:else/>
   <style type='text/css'>
     span.fullpost {display:none;}
   </style>
</b:if>
步驟 2.

搜尋<data:post.body/>,並把<data:post.body/>替換成下列程式碼。
<b:if cond='data:blog.pageType == "item"'>
   <data:post.body/>
<b:else/>
   <data:post.body/>
<br/><a expr:href='data:post.url'> 繼續閱讀... </a>
</b:if>
步驟 3.

使用時,在<span class="fullpost">...</span>之間插入要隱藏的內容,這樣一來包在<span class="fullpost">...</span>之間的內容就不會顯示,如果要閱讀全文就點擊「文章標題」或是「繼續閱讀...」就可以了,使用方法如下。
<span class="fullpost">
   要隱藏的內容...
</span>
[ 參考資料 ]

沒有留言:

張貼留言

1. 文章如有錯誤,歡迎指正。
2. 請勿打廣告,違者一律刪。
3. 歡迎您提供寶貴的意見。