「延伸閱讀」在Beta的作法

這篇實作記錄主要在解決舊版延伸閱讀(expandable post)無法直接套用到blogger Beta的問題。

　作法只需要兩個步驟，後台登入後依序找到範本＞修改HTML，然後勾選「展開小裝置範本」，開始編輯：

1. 在head加入這段javascript：

   <script type="text/Javascript"> function hidePost(postUrl) { var label=document.getElementById("fullpost"); if(label!=null){ eA = document.createElement("a"); eA.setAttribute("href",postUrl); eA.setAttribute("title","詳閱全文"); eA.appendChild(document.createTextNode("詳閱全文")); eB = document.createElement("p"); eB.setAttribute("id","read-more"); eB.appendChild(eA); label.parentNode.appendChild(eB); label.parentNode.removeChild(label);} } </script>

2. 在語法欄內找到：

   <p><data:post.body/></p>

   取代為：

   <p><data:post.body/></p> <b:if cond='data:blog.pageType != "item"'> <b:if cond='data:post.url'> <script type='text/javascript'>hidePost('<data:post.url/>');</script> </b:if> </b:if>

　接下來，你可以在後台依序找到「設定＞格式」，然後在「文章範本」欄位填入：

<p>簡介文字</p> <span id="fullpost">「延伸閱讀」內文</span>

　這麼一來，每次發文時，只要把「延伸閱讀」內文填入span#fullpost，就能夠在blogger beta順利使用延伸閱讀(expandable post)的功能了。