一開始在網路上找相關教學的時候，就發現原來blogger官方的說明裡有提供兩種方法
第一種方法是把想要隱藏的文章藉由javascript和CSS結合達成，就像這樣:
[Show/Hide]
但有些人(就像我)想要讓讀者點連結之後可以連到另一個顯示全部文章的網頁，第二個方法加上了blogger的Conditional Tag(中文是附有條件的標記)，但是令人詬病的缺點是連到顯示整篇文章的網頁之後，下方還是會出現 "Read More..." 字樣，挑剔的我當然是不能接受的，後來繼續在網路上找，果然有先進們已經有好方法了，我參考了Guava 此篇，加上自己的解說如下： （分為三個步驟）
Ste1: 在你網頁的範本(template)裡，將以下的內容加在<head></head>之間
<MainPage>
<script type="text/Javascript">
function has_id_hiden (postid)
{
var elm = document.getElementById(postid);
var nodelist=elm.childNodes;
for(var i=0;i<nodelist.length;i++)
if(nodelist.item(i).id=="hiden")
return true;
return false;
}
<MainPage> tag是控制此段內容只顯示在主網頁裡，function has_id_hiden則是判斷是否隱藏文章
Step2: 接下來在找到<style type="text/css"></style>，並把以下的css加進去：
<MainPage>
.post #hiden{
display:none;
}
</MainPage>
Step3: 找到<$BlogItemBody$>所在，應該會像底下的形式(如果你是用blogger提供的template):
<div class="post-body">
<$BlogItemBody>
</div>
將它改寫成:
<div class="post-body" id="DOC_<$BlogItemNumber$>" >
<$BlogItemBody$><br/>
</span>
<MainPage>
<script type="text/Javascript">
//<!--
if(has_id_hiden('DOC_<$BlogItemNumber$>')==true)
document.write("<a href='<$BlogItemPermalinkUrl$>' "+
"title='read more !' hidefocus >Read More ... </a>") ;
//-->
</script>
</MainPage>
最後這一步就是判斷是否要顯示"Read More..."
大功告成!接下來就是當我們在發表文章的時候，把想要隱藏的部分用
<div id="hiden"></div>
包住，就可以了
沒有留言:
張貼留言