http://skyvee.net/2007/06/blogger-hide-fullpost.html
亦可參考這篇：http://chenkaie.blogspot.com/2006/11/blog-expandable-posts-with-peekaboo_2149.html
請自行進入該網頁閱讀
底下為原文收錄：
在blogger首頁只顯示文章摘要, 隱藏全文的做法- hide fullpost
2007/07/14 更新 : 原始引用的script出了問題, 所以文章中有部分修改, 有刪除線者, 代表刪除,並更新新的程式碼, 請參考.
在blogger(blogspot)只顯示摘要這個功能, 應該是很多使用blogspot的人覺得需要的. 可以讓首頁呈現較多篇文章的摘要, 讓首頁載入時間快一點, 版面也可以較整齊.
在上次改版時, 參考了一些template, 也加入了一些功能, 包含閱讀全文的部分.
利用這次長假,把這個部分整理出來, 提供有需要的人參考一下.
首先要注意的是, 每次修改之前, 最好先備份一下模板.
備份說明: 按一下 "下載完整模版", 把目前的template 另存到電腦.
先選擇 範本--> 修改 html --> 打勾 展開小裝置範本
1.在 <head> 後面加入這行程式
<script type='text/javascript' src='http://www.anniyalogam.com/widgets/hackosphere.js' />
<script type="text/javascript">
function toggleIt(id) {
post = document.getElementById(id);
if (post.style.display != 'none') {
post.style.display = 'none';
} else {
post.style.display = '';
}
}
function showFullPost(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost")
spans[i].style.display = 'inline';
if (spans[i].id == "readmore")
spans[i].style.display = 'none';
}
}
var fade = false;
function showFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Appear(spans[i]);
} else spans[i].style.display = 'inline';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'none';
if (spans[i].id == "hidelink")
spans[i].style.display = 'inline';
}
}
function hideFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
if (fade) {
spans[i].style.background = peekaboo_bgcolor;
Effect.Fade(spans[i]);
} else spans[i].style.display = 'none';
}
if (spans[i].id == "showlink")
spans[i].style.display = 'inline';
if (spans[i].id == "hidelink")
spans[i].style.display = 'none';
}
post.scrollIntoView(true);
}
function checkFull(id) {
var post = document.getElementById(id);
var spans = post.getElementsByTagName('span');
var found = 0;
for (var i = 0; i < spans.length; i++) {
if (spans[i].id == "fullpost") {
spans[i].style.display = 'none';
found = 1;
}
if ((spans[i].id == "showlink") && (found == 0))
spans[i].style.display = 'none';
}
}
</script>
2.再來就是找到下列這段程式碼, 把紅字加上去
<b:includable id='post' var='post'>
<div class='post' expr:id='"post-" + data:post.id'>
<a expr:name='data:post.id'/>
3.再找到下列這段程式碼, 加入下述紅色程式碼.
<div class='post-header-line-1'/>
<div class='post-body'>
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>
<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"'
href='javascript:void(0);'>[+/-] 繼續閱讀...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"'
href='javascript:void(0);'>[+/-] 只顯示摘要...</a></p>
</span>
<script type='text/javascript'>
checkFull("post-" + "<data:post.id/>");
</script>
</b:if>
<div style='clear: both;'/> </div>
其中,繼續閱讀及只顯示摘要的文字, 可以自己換掉.
4. 在設定-->格式
文章範本加入這行
文章摘要的部分<span id="fullpost">這裡是要隱藏的部分</span>
這樣,以後新增文章時, 就不用自己再輸入<span id="fullpost">及</span>了!
參考來源 Expandable posts with Peekaboo view (blogger beta)
