现在的位置: 首页 ＞wordpress＞正文
小 中 大
修改WordPress的默认日历样式
2009年02月09日 ⁄ wordpress ⁄ 评论数 4

在侧边栏里加了一个日历，用的是WordPress的默认日历插件，但样式实在是太难看了，于是就修改了日历样式

在主题的style.css中加了以下代码：

下载: wp-calendar.css
  1. #wp-calendar{ 
  2.   border-collapse: collapse;
  3.   border-spacing: 0;
  4.   border: solid 1px #666699;
  5. }
  6. #wp-calendar a { 
  7.   color: #990099;
  8.   text-decoration: none;
  9. }
  10.  
  11. #wp-calendar a:hover {
  12.   color: #FF0000;
  13.   text-decoration: underline;
  14. }
  15.  
  16. #wp-calendar #today{ 
  17.    background: #FFFF33;
  18.  }
  19. #wp-calendar thead{ 
  20.    background: #9999CC;
  21.  }
  22. #wp-calendar tfoot{ 
  23.    background: #9999CC;
  24.  }
  25. #wp-calendar caption{ 
  26.    background: #666699;
  27.  }
  28. #wp-calendar tbody{ 
  29.   text-align:center;
  30.  } 
  31.  
  32. #wp-calendar .saturday{ 
  33.   color: #6666FF;
  34.  }
  35.  
  36. #wp-calendar .sunday{ 
  37.   color: #FF6666;
  38.  }

最后的.saturday和.sunday是为了将星期六和星期天加上颜色，这还需要修改wp-include下的general-template.php文件，所以如果不需要为星期六和星期天加颜色的话，以上的CSS代码就足够了。

以下是为了将星期六和星期天加上颜色的代码：（function get_calendar中）
打开wp-include下的general-template.php文件，找到以下代码

  1. if ( $day == gmdate('j', (time() + (get_option('gmt_offset') * 3600))) && $thismonth == gmdate('m', time()+(get_option('gmt_offset') * 3600)) && $thisyear == gmdate('Y', time()+(get_option('gmt_offset') * 3600)) )
  2.             echo '<td id="today">';
  3.         else
  4.             echo '<td>';
  5.         if ( in_array($day, $daywithpost) ) // any posts today?
  6.                 echo '<a href="' . get_day_link($thisyear, $thismonth, $day) . "\" title=\"$ak_titles_for_day[$day]\">$day</a>";
  7.         else
  8.             echo $day;
  9.         echo '</td>';

将上面的代码修改为下面的样子：

  1. if ( $day == gmdate('j', (time() + (get_option('gmt_offset') * 3600))) && $thismonth == gmdate('m', time()+(get_option('gmt_offset') * 3600)) && $thisyear == gmdate('Y', time()+(get_option('gmt_offset') * 3600)) )
  2.             echo '<td id="today">';
  3.         else
  4.             echo '<td>';
  5. // ------------------  增加代码开始-------------------------------------------------
  6.    if ( 6 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins) ) { 
  7.    $tmp_day = "<span class=\"saturday\">$day</span>";
  8.     }elseif (0 == calendar_week_mod(date('w', mktime(0, 0 , 0, $thismonth, $day, $thisyear))-$week_begins)) { 
  9.        $tmp_day = "<span class=\"sunday\">$day</span>";
  10.    }else{ 
  11.         $tmp_day = $day;
  12.    }
  13.  
  14. //-------------------------增加代码结束-------------------------------------------
  15.         if ( in_array($day, $daywithpost) ) // any posts today?
  16.                 echo '<a href="' . get_day_link($thisyear, $thismonth, $day) . "\" title=\"$ak_titles_for_day[$day]\">$day</a>";
  17.         else
  18.             echo $tmp_day;  //-------------修改这里----------------------
  19.         echo '</td>';
返回

作者:

该日志由 孜爸 于1094 天前发表在wordpress分类下， 你可以发表评论，并在保留原文地址及作者的情况下引用到你的网站或博客。
转载请注明: 修改WordPress的默认日历样式 | 孜孜成长日记 +复制链接
关键字:
【上篇】
【下篇】

您可能还会对这些文章感兴趣！

  1. 给Wordpress添加统计数据
  2. 给Wordpress添加统计数据
DSC_0004
其中那么一小段时光

目前有 4 条留言 其中：访客:4 条, 博主:0 条

  1. 阿蒙 : 2010年01月07日16:22:16  1楼 @回复 回复

    请问你的日历是怎么在年份后面加上”年”的啊?

  2. zdengfeng : 2010年01月07日21:31:30  2楼 @回复 回复

    现在的状况是更新到了2.9.1时的状况，自动变成这样子了，我什么都没有顾得上改。原来改的东西也都丢掉了。

  3. john : 2010年05月28日23:00:31  3楼 @回复 回复

    这点zblog要好于wordpress

  4. LyonsDina : 2010年07月17日15:01:57  4楼 @回复 回复

    It’s cool that people can take the credit loans and that opens up new possibilities.

给我留言


插入图片

Click to hear an audio file of the anti-spam word

返回首页

Copyright © 2009-2012 孜孜成长日记  保留所有权利.   基于 WordPress 技术创建   Theme by Robin
×
新浪微博
腾讯微博