11/27/2008

Blogger beta收缩/展开文章

还记得以前的Blogger吧,为了防止首页太长我们会通过修改代码让文章收缩起来。这篇文章就是为实现这个功能而写,Just for Blogger beta!想看下面的文章吗?请点Read More。
Step0:备份你的模板:-)
Step1:开始吧,在<head></head>间添加以下代码,以引用脚本文件(其中的脚本文件建议自己保存并传到Google pages上去)
<script type='text/javascript' src='http://sunrrr.googlepages.com/hackosphere.js' />
Step2:在你的模板(确定已选中 Expand Widget Templates)中找到ID为"Post"的includable,会看到下面类似的代码,将红色的地方加到你的代码中.
<b:includable id='post' var='post'>
<div class='post' expr:id='"post-" + data:post.id'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>
<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);'>Read More...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>Summary only...</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
Step3:找到Settings - Formatting,在最后的Post-template添加以下代码
摘要部分
<span id="fullpost">
隐藏部分
</span>
此Hack来自Hans&Ramani两个很有趣的人,Hans将这个叫做"躲猫猫"Post
在接下来的时间里,鱼会继续翻译一些国外的关于Blogger beta Hack的文章,欢迎关注,期待会带给我的朋友们一点帮助.

没有评论:

发表评论