[筆記] Blogger的繼續閱讀

一般各家提供的網誌，通常會有個繼續閱讀的功能，使用者僅需要設定好要顯示的行數或是段落就可以了。初次使用Blogger的時候，我找遍設定檔，就是沒有這樣的功能，但是卻在Tony的Blog上有看到。我一直以為是自己眼睛度數太深，找不到它的隱身處。後來我忍不住問了Tony，才知道原來這功能也是要自己DIY的。

Tony找了一篇文章給我，作者是用Javascript寫的，可以由使用者自行決定在何處就隱藏的動作，同時也會出現 "繼續閱讀" 的字樣，方便讀者能將整篇文章叫出閱讀

首先進入編輯html，請記得把 "展開小裝置範本" 打勾，找到

]]></b:skin>
</head>

在]]></b:skin>之後、</head>之前加入下面的程式碼


<!-- Style to implement "Read more on this Article" link in all the posts

(Start) -->
<style>
    <b:if cond='data:blog.pageType == "item"'>
       span.fullpost {display:inline;}
   <b:else/>

        span.fullpost {display:none;}
    </b:if>
</style>
<!-- Style to implement "Read more on this Article" link in all the posts
(End) –>

接下來找到

<data:post.body/>

用下面的code取代它

<!-- Code to show "Read more on this article..." Link (Begin) -->

          <b:if cond='data:blog.pageType != "item"'>
              <span>
                <a expr:href='data:post.url' style='color:#0000FF;
text-align:right; font-weight:bold; text-decoration:none' >繼續閱讀...</a>
             </span>
          </b:if>
          <!-- Code to show "Read more on this article..." Link (End) -->
註：背景綠色的部分，可自行更改
最後，把想要隱藏文章部份，加入<span class="fullpost">與</span>即可，如下所示：

<span class="fullpost"> 隱藏部分的文章 </span>

參考資料：Tech Dreams Blogger Hack - Expandable post summaries for professional blog design