以日历形式显示文章日期

效果及原文请见良人的大秘寶，就是把文章的日期用一张日期的小图片替换。

1.添加CSS

.CAL { background-image: url('http://klcintw.images.googlepages.com/icon-calendar.gif background-repeat: no-repeat; width: 32px; height: 45px; float:left; padding-right:8px; } .MONTH { padding-top: 10px; text-align: center; font-family: "Arial Narrow" font-size: 9px; } .DAY { margin: -2px 0px 0px 0px; padding: 0px; font-family: "Courier New" font-size: 18px; font-weight: bold; text-align: center; }

2.添加JS

<script language="javascript" type="text/javascript" > function makeCal(id,ymd) { var postDate = new Date(Date.parse(ymd)); var panel = document.getElementById("divCal_"+id); panel.innerHTML = "<div class='CAL'><div class='MONTH'>"+postDate.getFullYear()+"-"+(postDate.getMonth()+1)+"</div><div class='DAY'>"+postDate.getDate()+"</div></div>" } </script>

3.找到下面代码：

<div id='blog-posts'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.allowComments'>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
</b:loop>
</div>

红色部分替换为：

<div expr:id='"divCal_" + data:post.id'><script type='text/javascript'>makeCal('<data:post.id/>','<data:post.dateHeader/>');</script></div>

已知问题：转换页（如选择下一页）后无法显示日历