2007年2月11日星期日

blogger 3.0:让你的“博客归档”在收缩时也能展开查看文章标题


感谢台湾朋友hguei分享了他方法

具体样式看我的“博客归档”就知道了(注意我把默认“博客归档”名称改为了“全部文章列表:(按月归档)”),默认情况下这样子收缩是看不到月份存档内部的文章的,现在也能按小三角形看到了。

安装方法:首先确保你把“博客归档”这个页面元素添加了,并且是设置的“层次结构”“显示文章标题”。

第二步切换到你的模版,修改html项,勾选“扩展窗口小部件模板”,然后找到你刚刚添加的“博客归档”页面元素,定位下面的代码:
<li expr:class='"archivedate " + data:i.expclass'>

改成下面这样,注意红色部分:
<li expr:class='"archivedate collapsed"'>


这样你的文章就收缩了好了。但是三角形指示图片还是默认的打开状,非常怪异,所以还要:

第三步,修正三角形指示图片,定位下面的代码:
  <b:if cond='data:interval.expclass == "expanded"'>
    <a class='toggle' expr:href='data:widget.actionUrl + "&amp;action=toggle"
+       "&amp;dir=close&amp;toggle=" + data:interval.toggleId +
"&amp;toggleopen=" + data:toggleopen'>

        <span class='zippy toggle-open'>&#9660; </span>
    </a>
  <b:else/>
    <a class='toggle' expr:href='data:widget.actionUrl + "&amp;action=toggle"
+         "&amp;dir=open&amp;toggle=" + data:interval.toggleId +
"&amp;toggleopen=" + data:toggleopen'>

          <span class='zippy'>&#9658; </span>
    </a>
  </b:if>

将上面的红色代码close改成open,将上面的红色代码&#9660;改成&#9658;即可。

原文上还有关于修正三角形在IE下变大的CSS代码,我个人喜欢让三角形变大,所以不想修正。想要修正的请查看原文。

11 评论:

发表评论: ☆欢迎灌水☆言论自由☆交流快乐☆