一直很討厭首頁打開後落落長的樣子， 第一個載入的速度慢， 第二個是我不"尬意"， 舉例來說好了， 如果想看第二篇文章， 非得等第一篇文章下載完畢(尤其是圖片)， 不然在你看的過程中，文章會不停的往下跑， 希望大家聽的懂我說啥。
那天在網路上逛到一個blog，發現他有[繼續閱讀]的功能，而且發現他也是blogspot的網址，怎麼我在設定的功能裡面找來找去的就是沒有這項功能呢？這件事情一直埋藏在我心中久久不能釋懷。
直到昨天，我終於受不了了，
在我不停的google下，終於找到相關線索，
原來是要寫程式、改模板！！！
這...
這...
這不是肯德基...ㄚ...說錯了，這不是我要的！
一定有更簡單的！
在我棄而不捨之下(其實是不想寫程式，也不會寫)終於找到了簡單的方法，
只要貼貼貼就可以完成這樣的功能了！YA~~~
想要有相同功能的人只要跟著我往下做就可以啦！
SETP 1.
先登入你的blogger吧，然後到版面配置\修改HTML，記得把[展開小裝置範本]打勾。
SETP 2.
找到 <head> 的標籤，然後在後面貼上下面的code
---------------------------------------------------------------------------------
<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","Read More");
eA.appendChild(document.createTextNode("...Read More"));
eB = document.createElement("p");
eB.setAttribute("id","read-more");
eB.appendChild(eA);
label.parentNode.appendChild(eB);
label.parentNode.removeChild(label);}
}
</script>---------------------------------------------------------------------------------
其中 ...Read More 改成你想要的標籤，例如我就改成了[繼續閱讀]
SETP 3.
找到
---------------------------------------------------------------------------------
<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>
---------------------------------------------------------------------------------
SETP 3.
找到
<p><data:post.body/></p>這一行，然後補上下面的 code---------------------------------------------------------------------------------
<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>
---------------------------------------------------------------------------------
這邊做完之後記得範本要存檔哦~~~
不然你就得再剪貼一次了！
SETP 4.
接下來是要讓你以後每次寫文章的時候直接有這樣的功能，先到設定\格式
最下面的[文章範本]貼上下面的code，
---------------------------------------------------------------------------------
<div> //首頁看的到的文章 </div>
<div id="fullpost"> //隱藏部分的文章 </div>
---------------------------------------------------------------------------------
然後你在你每次張貼文章的地方就可以看到以下的畫面啦！
STEP 5.
接下來就是苦命的工作了，就是要把以前已經張貼過的文章也改成有[繼續閱讀]的功能，直接到張貼\修改文章，在你想要隱藏的文字前面貼上 <div id="fullpost"> 那行code，
然後直接跳到最最最最最.......最後一行，貼上 </div> 就大功告成啦！
就在我昨天一陣努力瘋狂貼貼貼之下，我終於把我以前的文章全部都有這個功能啦！
--------------------------------------------------------------------
2008.04.18 update
配合玥玲的智力，修改了一些地方與一個bug
1 則留言:
很實用...偷學走了
張貼留言