关于DarkLight的相关文章和Bread Crumb样式

related-posts-and-breadcrumb首先提个与本文章内容无关的,发现太多朋友喜欢去掉版权信息了,想不明白,版权信息就那么碍眼??!像 Jinwen 说的朋友加油,加个版权链接磊落点吧,囧rz。

好了,进入正题,关于我自用的 DarkLight 主题中相关文章和文章顶部导航的样式问题,由于每个 Wordpress 用户的使用习惯不同,而且这两个效果都需要插件支持,所以没有在 DarkLight 发布版中放入代码和使用方法,不过最近挺多人询问关于这两个样式如何实现,于是在此把这两个样式的实现和相关的插件作下说明。PS,昨天有位朋友问了顶部 Breadcrumb 的实现问题,忘了把 CSS 代码给你了,你再看看这篇文章添加进去吧。

  • 相关文章,需要 Simple Tags 插件支持。
    在 single.php 文件中找到 ,在其后面加入以下代码:

    1
    2
    3
    4
    5
    6
    7
    8
    
    <div class="related_post">
            <div class="related_post_mid">
              <?php if (function_exists('st_get_related_posts')){;?>
              <?php st_related_posts('number=5&title=<h4>Related Posts</h4>&nopoststext=<strong><em>No Related Posts</em></strong>&include_page=false&order=random&xformat=<a href="%permalink%" title="%title% (%date%)">%title% (%post_comment%)</a><p>%post_excerpt%</p>&except_wrap=5');?>
              <?php } ;?>
            </div>
            <div class="related_post_bottom"></div>
    </div>

    CSS 已经在发布版的主题中了(并没有去掉,哈哈),这样就跟我自用的样式一致了。

  • Bread Crumb 导航,需要 Breadcrumb NavXT 插件支持。
    首先在 single.php 中找到

    1
    
    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

    在其前面加入以下代码:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    
    <div class="breadcrumb">
    	<?php
    		if(function_exists('bcn_display'))
    		{
    			bcn_display();
    		}
    	?>
    </div>
    <div class="clear"></div>

    其次,在 style.css 文件中加入以下样式:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    
    .breadcrumb {
    	margin-bottom: 15px;
    	padding-bottom: 10px;
    	font-size: 13px;
    	line-height: 27px;
    	background: url(images/entrybottom.png) repeat-x 0 bottom;
    	color: #CCCCCC;
    	font-style: italic;
    	overflow: hidden;
    }
    * html .breadcrumb {
    	height: 27px;
    }/*ie6*/
    .breadcrumb span {
    	float: left;
    	margin-right: 8px;
    }
    .breadcrumb a, .breadcrumb a:visited {
    	color: #CCCCCC;
    }
    .breadcrumb a:hover {
    	text-decoration: underline;
    }
    .bread_home {
    	text-indent: -99999em;
    }
    .bread_home {
    	margin-right: 6px !important;
    }
    .bread_home a, .bread_home a:visited {
    	display: block;
    	background: url(images/bread_home.png) no-repeat;
    	height: 24px;
    	width: 24px;
    }
    .bread_current {
    	color: #EEEEEE;
    }

    最后,在 Wordpress 后台的 Breadcrumb NavXT 设置 General 下的:
    - Breadcrumb Separator:

    1
    
    <span class="bread_sep"><em>&gt; </em></span>

    - Home Prefix:

    1
    
    <span class="bread_home">

    - Home Suffix:

    1
    
    </span>

    当然你可以在其他页面添加类似导航,代码的放置类似,后台设置简单明了,自己摸索了。

DarkLight 2.3

这两天开始动手修改 G-White 主题,很多东西修改,还是比较麻烦的,费了不少时间,然后在各浏览器下调试的时候,发现 IE7 下有挺多细节问题要修正的,于是有了这篇 DarkLight 更新的文章,其实部分 DarkLight 2.0 的部分 Bug (根据用户的反馈),已于 10/18 修正并更新,今天主要就是处理了 IE7 下的问题,当然应该还有一些其他的细节问题我没发现,还是需要大家继续反馈。Change Log 如下:

- 9/20 更新:修改在无评论时 sidebar 和 footer 字体变大的 Bug。
- 10/18 更新:修改侧边栏样式,修正使用 Widget 工具时“标签云”样式,当添加工具时,侧边栏各个工具样式保持一致;修改嵌套评论“链接”的颜色;增加下拉菜单导航样式,当主页面包含子页面时,鼠标经过会出现下拉菜单(IE6 无视)。
- 10/26 更新:修正 IE7 下 Comment Author 居左问题;修正 IE7 下嵌套评论间距过大和嵌套评论内容高度过高问题;修正导航栏下拉菜单在 IE7 下异位问题。修正留言后 Leave a comment 这个链接变成 <a href=”#commentform”>Leave a comment</a> 的 Bug,我把这个链接转移位置了。
- 12/14 更新:把文章标题显示 Article-link(Permalink) 换成显示原标题

预览:Preview 1 | Preview 2
下载:本地下载

DarkLight 2.0

DarkLight_2DarkLight 2.0 终于如期发布,上个版本 1.04 直接跳到 2.0,改了挺多东西的,优化了代码,外观上变化不大。DarkLight 2.0 只支持 Wordpress 2.8+,这次没有必装的插件也可以正常运行了,支持嵌套回复,支持 Ajax 评论,支持评论分页,显示楼层序号,内嵌 WP-Pagenavi,支持 Widget……在 Firefox 3.5,Opera 10,Chrome 3 及 IE6 下测试正常,IE6 下的嵌套评论模式跟其他浏览器有点不一样,在此建议大家去弄个 IE6 必死吧,哈哈。
PS,发布出来的 DarkLight 2.0 会有部分样式跟我自己使用的主题不一样的,比如 Header 导航和 Sidebar 上的标题字体,因为每个人的使用习惯和博客内容跟我的一样,所以我这种太过自定义的样式不会放在发布版本里面。不多说,看具体说明(For English Usage, please read the “Read Before Use” file in the darklight_2 folder):

  • 只支持 Wordpress 2.8 以上版本,相比 DarkLight 1.0,仅仅自带了一个 Links 模板,删去了 Guestbook 和 Archives 模板;DarkLight 2.0 已在 Firefox 3.5,Opera 10,Chrome 3,IE6 下测试,可正常使用(不知道会不会有些问题没发现,如果您使用过程中发现问题,欢迎联系本人,谢谢!)
  • 支持嵌套回复和评论分页,这两个都需要在后台的评论设置开启,嵌套回复目前只支持 3 层,目前未考虑增加更多层次的样式。
  • 评论楼层显示楼层序号,支持 Ajax 评论,自动隐藏老用户资料框,支持 Ctrl+Enter 发表留言
  • 本主题不使用任何插件也可以正常显示,并且已经内嵌 WP-Pagenavi 插件,所以如果您启用了该插件,请在后台将改插件禁用。
  • 主题支持 Widget,但还是那句话,强烈建议使用 Sidebar.php,自定义性更强。
  • 主题可能存在本人未发现的 Bug,如果您使用了本主题并发现 Bug,欢迎联系我,谢谢!

- 9/20 更新:修改在无评论时 sidebar 和 footer 字体变大的 Bug。
- 10/18 更新:修改侧边栏样式,修正使用 Widget 工具时“标签云”样式;修改嵌套评论“链接”的颜色;增加下拉菜单导航样式,当主页面包含子页面时,鼠标经过会出现下拉菜单(IE6 无视)。

预览:Preview 1 | Preview 2
下载:本地下载

New Born

A new start for Alan’s World,以前的文章全部删了,这在从 PJ Blog 转到 Wordpress 的时候也发生过,这个诞生三年多的 Blog 如今又像新生的一样,Orz。或许是一时兴起做了这个有点”变态”的决定,不过想想 Blog 里的大部分文章都是分享系统美化的,真正自己写的相对来说,太少了,虽然收集分享也花了功夫,但在现在看来已无多大意义,这样的 Post 方式自己都觉得很讨厌了,所以才有了这样的想法,而且有了挺久了,只是一直没时间去做这一步,最近抽空把 DarkLight 做了改进,同时把 Blog 给 Wipe 了。之后呢?还是要多点原创,多点亲手写的东西。希望对得起订阅的朋友,哈哈。

说到 DarkLight 主题,以前的版本问题多多(这里还是要感谢使用 DarkLight 主题并做出反馈的朋友,才能发现这么多问题),尤其是 php 文件的问题,新版本已经做出许多改进,主题样式上也有部分改变,DarkLight 2.0 不久后应该能发布,我现在这个样式基本上就是 2.0 的样子了,不过还会有点改变的。

PS. 新开始的第一篇文竟是用 Wordpress App for Blackberry 写的,这个软件很不错,希望功能能越来越强大。