2007年10月22日 星期一

Expandable post in blogger

弄了半天, google了好久,終於把blogger裡的post改成可以enpandable.


照著blogger內的help弄好久都不成功. google的資料也沒先前用的wordpress多. 後來終於讓我找到這篇DUMMY, 看來我的頭腦真的只適合dummy style.

重點如下:
Step 1: conditional CSS
在templet中找到</head>, 把以下貼在</head>之前.
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>

通常</head>之前是 ]]></b:skin>, 所以上面的code就是貼在]]></b:skin>之後.

Step 2: "read more" link
把"Expand Widget Templates"打勾
找到<data:post.body/>
把以下code貼在它後面
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url' target='_blank'>Read more!</a>
</b:if>

存檔

Step 3:
在post中,把要隱藏的段落用<span class="fullpost">及</span>這兩個tag包起來就好.

後記:
在blogger post中, 不能直接打html code的一些符號, 例如”<head>”. 因為blogger會直接編譯. 所以無法直接show出code出來.
解決方式: 把html code以source的方式打出來. 例如”<”就要打成& l t ;(空格要去掉). 這些可從瀏覽器的page source中看到.

沒有留言: