讲解:使用JQuery实现WordPress多层下拉导航

今日要讲解使用JQuery实现WordPress多层下拉导航的程式码。
第一行是让WordPress调用JQuery,就不多说了:
<?php wp_enqueue_script(‘jquery’); ? >
JQuery主程式讲解
然后是JavaScript(JQuery)的主程式:
< script type="text/javascript" >
$("#topmenu a").removeAttr("title");
jQuery(document).ready(function() {
jQuery("#topmenu ul").css({display: "none"}); // Opera Fix
jQuery("#topmenu li").hover(function(){
jQuery(this).find(‘ul:first’).css({visibility: "visible",display: "none"}).show(268);
},function(){
jQuery(this).find(‘ul:first’).css({visibility: "hidden"});
});
});
< /script >

使用JQuery实现WordPress多层下拉导航

多层下拉导航(Drop Down Menu),已经是一项十分普遍的技术。只是其实作方法各不相同,随着CSS的普及,有不少人试着以纯CSS的方式来实现,这种方法的最大问题是IE6不能完全支持,要克服这个障碍,需要比本身的程式还要多出很多的代码,所以并不是很多人采用。另外一种做法就是使用JavaScript,也是我们今天要讲的方法。由于时间关系(今天比较忙),本篇只讲怎么做,明天再具体讲解为什么这么做。今天我们要做到跟这个一样的效果
要用JavaScript的话,我会直接想到JQuery,这算是目前最流行的JavaScript库(lib),有了它,我们能省下很多的时间。而且WordPress本身也包含JQuery,你可以在wp-includes\js里面找到。所以要在WordPress使用JQuery就更简单了,只要在<head></head>之间加入:

<?php wp_enqueue_script(‘jquery’); ? >

就可以了。现在我们假设我们的导航div是topmenu,请在上面那句的下一行加入:

<script type=’text/javascript’>
$("#topmenu a").removeAttr("title");
jQuery(document).ready(function() {
jQuery("#topmenu ul").css({display: "none"}); // Opera Fix
jQuery("#topmenu li").hover(function(){
jQuery(this).find(‘ul:first’).css({visibility: "visible",display: "none"}).show(268);
},function(){
jQuery(this).find(‘ul:first’).css({visibility: "hidden"});
});
});
</script>

这就是我们要用到的全部JavaScript,好像很少对吧,这就是JQuery可爱的地方。

高亮(Hightlight)显示作者回覆

高亮显示作者回覆(Comments),让读者能快速找到作者的回覆,这个主题一早就想写,简单又实用。
找了一些资料,发现最早期大家是用作者的E-mail来判断回覆是否属于作者的,这样的问题是,如果读者知道作者的E-mail,并用这个E-mail来回覆,就会造成混淆。就像我的E-mail就是公开的放在[关于]页里,任何人都能看到,存心恶作剧的话很容易做到。
因此,发展出以作者的ID来判断是否作者回覆,这个方法解决了以上的问题,一直延用至WordPress 2.7的发布。其实,这个方法还是适用于WordPress 2.7或以上版,只是这个版本以后的WordPress提供了更容易实现这个功能的方法。
自WordPress 2.7版后,WordPress会自动为文章作者的回覆加入.bypostauthor的class,以供主题设计师用CSS对作者的回覆进行修改美化。也就是说,你不用再去判断哪一篇是作者的回覆,因为WordPress已经帮你完成了这个动作,你可以直接开始修改CSS,对.bypostauthor进行美化。你可以直接在你的CSS文件的comment方面的代码后面(或直接加在CSS文件的最后),加入像如下的代码:
li.bypostauthor {
color: #FFFFFF;
background: #000000;
}

WordPress的语言设定

本文属于WordPress主题翻译教学系列,文章列表:

设计国际化的主题: WordPress主题翻译教学
如何翻译WordPress主题
进阶WordPress主题翻译技巧
WordPress的语言设定

前三篇讲了翻译的方法,却忘了讲怎么用上这些翻译,这一篇算是之前的内容的补充,主要讲如何设定WordPress的语言跟主题的翻译文件该放在哪里。
1. 设定WordPress的语言
首先,其实WordPress本身提供多国语言版本,可以直接下载,包括繁体中文与简体中文。下载回来后,不用任何设定就可以使用。实际上,这些版本跟英文版只有两项区别,如果你本身用的是英文版,想要改为中文版,可以参考这两项进行修改。
第一项语言设定。在WordPress根目录里的wp-config.php底部有以下这一行:
define (‘WPLANG’, ”);
这就是WordPress的语言设定,预设是英文,要改成中文,只要填入语言代号,如简体中文,请改为:
define (‘WPLANG’, ‘zh_CN’);
我们之前讲的翻译文件的命名规则得出来的就是语言代号。同理,繁体中文只需将zh_CN改为zh_TW就可以了。储存并关闭就完成了语言的修改。接着,WordPress就会自动寻找相应的语言文件,到哪里寻找呢?这就是第二点要讲的内容。

如何分离WordPress的Comments与Trackbacks

自WordPress 2.7后,WordPress的回覆增加了一些新功能,包括对回覆进行回覆。因为在分离WordPress的Comments与Trackbacks的做法也有了一些不同,本篇所讲的是以2.7版之后为基础。
分离Comments与Trackbacks/Pingbacks
首先你要确认,你所使用的主题支持WordPress 2.7版本或以上,你亦可以参考WordPress的Default主题。现在请打开主题的single.php文件,在文件的后段找到以下程式:
<?php comments_template(); ?>
将其改为:

<?php comments_template(”, true); ?>

这样做是为了让comments_template产生一个全域(global)的数组(array):$comments_by_type,以备后用。这时可以储存并关闭single.php文件了。