把一切美化 » WP相关 http://erdaoo.cn Mon, 26 Jul 2010 05:59:17 +0000 http://wordpress.org/?v=2.9 en hourly 1 wordpress主题模版制作教程（七） http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e4%b8%83%ef%bc%89/ http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e4%b8%83%ef%bc%89/#comments Thu, 15 Apr 2010 08:04:08 +0000 我是二道 http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e4%b8%83%ef%bc%89/ 本文转载自zacklive,共有四篇文章

设定WordPress的语言

首先，其实WordPress本身提供多国语言版本，可以直接下载，包括繁体中文与简体中文。下载回来后，不用任何设定就可以使用。实际上，这些版本跟英文版只有两项区别，如果你本身用的是英文版，想要改为中文版，可以参考这两项进行修改。

第一项语言设定。在WordPress根目录里的wp-config.php底部有以下这一行：

define (‘WPLANG’, ”);

这就是WordPress的语言设定，预设是英文，要改成中文，只要填入语言代号，如简体中文，请改为：

define (‘WPLANG’, ‘zh_CN’);

我们之前讲的翻译文件的命名规则得出来的就是语言代号。同理，繁体中文只需将zh_CN改为zh_TW就可以了。储存并关闭就完成了语言的修改。接着，WordPress就会自动寻找相应的语言文件，到哪里寻找呢？这就是第二点要讲的内容。

翻译及语言文件的位置

第二项就是语言文件。打开wp-content，你会发现里面多了一个languages，没错，这就是WordPress的语言文件的位置，里面一般最少有两个文件：一个PO文件和一个MO文件。MO是经过编译的文件，WordPress从这里读取翻译，基本上有MO文件WordPress就能使用该语言；而PO则是原文件（未经编译），装有原始的翻译文件，主要用于修改翻译或作为翻译其他语言版本的参考。另外，有时还会有个PHP文件，如简体中文就会有个zh_CN.php，里面主要是CSS设定，用于修正界面的。你知道，中文和英文的长度，大小等都有所不同，画面有些地方需要作出调整，才不会出现诸如移位之类的现象。

前面讲的语言文件是WordPress系统的翻译，再来就要讲，主题的翻译文件应该放在哪里。其实道理一样，翻译文件属于主题，所以放在主题文件夹里的languages文件夹里，自己在主题文件夹里新建一个文件夹，命名为languages就可以了。把你翻译的MO跟PO文件放在里面，WordPress就能找到。当然，你的翻译文件必须跟wp-config.php里面设定的一样才能找到。如果你在wp-config.php里设定的是zh_TW，而你的主题的languages里放的是zh_CN.mo，那很抱歉，你的主题会显示预设的英文版本。

当我学完这几篇教程，才发现，原来真正的汉化应该是这样子的。之前所做的不过是修改而已。

]]> http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e4%b8%83%ef%bc%89/feed/ 0 wordpress主题模版制作教程（六） http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e5%85%ad%ef%bc%89/ http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e5%85%ad%ef%bc%89/#comments Thu, 15 Apr 2010 07:57:22 +0000 我是二道 http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e5%85%ad%ef%bc%89/ 本文转载自zacklive,共有四篇文章

设立文字命名空间(Text Domain)

文字命名空间(Text Domain)是为了避免本主题的翻译文字和其他主题或WordPress本身的文字发生冲突而设立的，它的意思就像一个文件夹，将本主题的文字都放在里面，需要这个主题的文字时，WordPress就会直接来到这里找，这样就不怕跟其他主题的文字弄乱了。

设立文字命名空间的方法很简单，假设我们要加入zack_theme作为Text Domain，只要在functions.php的开头加入以下程式码：

load_theme_textdomain(‘zack_theme’);

我在之前的文章里提过，要使用__()或_e()来标示需要翻译的文字，加入了Text Domain之后，有一点小变化：

  1. __($text, $domain)：原本只需填入$text作为参数，现在要把Text Domain也加入作为第二参数。
  2. _e($text, $domain)：同上。

这样WordPress知道文字是需于哪个Domain的，就能快速地找到相应翻译。

带参数的文字翻译

这种情况，我有稍微讲过，再来看一个例子，强化一下：

title="Permanent Link to <?php the_title(); ?>"
这个例子应该不陌生吧，这是标题连结的title设定，很明显"Permanent Link to"需要翻译，很多人第一反应就会想到这样做：
<?php _e('Permanent Link to', 'zack_theme') ?> <?php the_title(); ?>


这样做的问题是，只翻译"Permanent Link to"，在其他语言中，句子未必通顺，甚至不成立。例如，以中文来讲，
我会希望这句翻译出来的结果是："第一篇文章的永久连结"，就是把"Permanent Link to"放在了标题的后面，顺序完全相反了。
所以这句话我们要把整句抽出来翻译：
<?php printf(__('Permanent Link to %s', 'zack_theme'), get_the_title())?>


现在我们用printf()来完成这个输出，这样做就能把标题插入到%s这个位置上。中文翻译时就是："%s的永久连结"。
出来的结果就是我上面希望的样子。把the_title()改为get_the_title()是因为，the_title()会把文字直接输出到网页，
而get_the_title()则把文字返回给程式使用。情况跟_e()和__()一模一样。

日期与时间的翻译

日期跟时间的翻译有够烦的，单是中文（2010年01月22日）跟英文(22/01/2010)就已经差很多了。不过，WordPress使用PHP的Date()方法来处理日期与时间，因此我们可以直接使用PHP Date()的格式来翻译，就算在要翻译的文字未出现的格式代号也可以使用，例如：

<?php the_time(__(‘l, j F Y’, ‘zack_theme’)) ?>

跟据原文，我们只要翻译’l,j F Y’，但其实我们可以翻译成’Y年n月j日’；这样就可以得到年月日的格式了。如果你不太清楚Y,n,j，这些各代表什么或是想知道其他的代号，可以查看PHP Date()的说明。

翻译的文字顺序

这种情况出现在要翻译句子中有两个参数的时候：

Hi, I am %s, Welcome to %s

这句话的完整版是：Hi, I am Zack, Welcome to ZackLive，其中ZackLive是网志名称。这在中文跟英文都似乎很通顺，但在其他语言却可能会要把两个%s调换位置，两个都是%s，怎么区别？我们可以这样做：

Hi, I am %1$s, Welcome to %2$s

如此更改后，我们就能任意的调整位置了。

JavaScript中的文字翻译

要翻译JavaScript中的文字并不如想像中那么难，只是有点烦。我们可以把所文JavaScript中的文字改为变量，并对变量进行翻译。请看以下例子：

function show_msg ()
{
  alert('This is You message');
}
我们先将这里改为：
function show_msg ()
{
  alert(your_msg);
}


然后在HTML头部，也就是<head>与</head>之间，加入：
<script type="text/javascript" charset="utf-8">
  var your_msg = '<?php _e('This is your message', 'zack_theme'); ?>';
</script>

翻译中单复数的处理

关于这一部分，我也还未完全弄明白，只是把我所知道的，跟大家分享一下，若你有更深入的见解，欢迎指教。我们要看的例子是显示留言数：

<?php comments_popup_link('No Comments &#187;',
                          '1 Comment &#187;',
                          '% Comments &#187;'); ?>

这里考虑了英文中的三种情况：没有回覆，一个回覆跟多个回覆。而中文则是这三种情况的翻译都一样。但是在其他语言，两个回覆跟三个回覆的写法，都不一样，据说__ngettext()能解决这个问题。先来看__ngettext()的用法：

<?php __ngettext($single, $plural, $number, $domain); ?>
__ngettext有四个参数，其中$domain就是Text Domain，另外三个分别是：
  1. $single：当$number等于1时，使用这个翻译；
  2. $plural：当$number大于1时，使用这个翻译；
  3. $number：具体的数目。

我在网上看到的解决方法是这样的：

<?php comments_popup_link(__('No Comments &#187;', 'kubrick'),
                          __('1 Comment &#187;', 'kubrick'),
                          __ngettext('% comment', '% comments',
                                      get_comments_number (),
                                      'kubrick')); ?>

没有回覆跟一个回覆是正常的做法，多个回覆那边，我也不太能够理解，有哪位高手可以详细讲解一下吗？

数字与货币的翻译

数字与货币要注意的是要将数字与货币符号整个标示以供翻译，数字格式可使用number_format()来处理。

总结

研究下来才知道光是翻译主题就要考虑这么多东西，设计主题时，要注意的地方又增加了不少。我想，我们没有办法考虑到所有语言的情况，只能够通过用户的反馈，不断地改进。

]]> http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e5%85%ad%ef%bc%89/feed/ 0 wordpress主题模版制作教程（五） http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e4%ba%94%ef%bc%89/ http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e4%ba%94%ef%bc%89/#comments Thu, 15 Apr 2010 07:53:47 +0000 我是二道 http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e4%ba%94%ef%bc%89/ 本文转载自zacklive,共有四篇文章

上一篇，我们讨论了如何让你的WordPress主题可被翻译成其他语言，今天我讲一下，具体如何去翻译WordPress主题。

同样地，先介绍一些基本概念。需要翻译的文字会储存在.PO文件中，而翻译完成的版本会储存为.MO文件里。这两个文件的命名有一定的规则：语言代码_国家或地区代码。如果不是使用UTF-8编码，还要加上所用编码格式，请看以下例子：

  • en_US – 美国英语
  • en_UK – 英国英语
  • fr_FR – 法文
  • zh_CN – 中文（简体）
  • zh_TW – 繁体中文（台湾）
  • ja_JP.EUC-JP.mo – 采用EUC-JP编码的日文

有些主题会提供.PO文件以供翻译，没有也没关系我们可以用poEdit生成。poEdit就是翻译.PO文件专用的软件，免费提供下载，支持Windows, Mac跟Linux平台，图形介面，使用起来十分方便。

第一次运行poEdit会要求你选择你的语言：

poedit theme translation 如何翻译WordPress主题

然后会提示你输入你的名字跟E-mail，这会用作翻译文件的作者资料。

poedit theme translation name 如何翻译WordPress主题

按下[OK]后就会进入poEdit的主介面，我们就在这里进行翻译工作。首先，我们要先建立一个新的翻译专案，请点左上角的[档案]–>[新增编目档]：

poedit theme translation new 如何翻译WordPress主题

接下来会看到，专案设定的画面，在这里填入专案的详细资料。要注意，[语言]项请填入翻译的目标语言；WordPress的字元集全都是”utf-8″；复数形式我们可以暂时不填。

poedit theme translation project 如何翻译WordPress主题

填完之后，切换到中间的[路径]页面，这里填入要翻译的主题的所在位置，填入文件夹的路径即可。一共要填两次，除了[基础路径]，按下[新增]，中间会出现空格，这里也要填一次：

poedit theme translation path1 如何翻译WordPress主题

再切到最后的[关键字]页面，这里要填入翻译文字的标示符，就是我们上一篇讲的那三个：

  1. __
  2. _e
  3. __ngettext:1,2

按[新增]后，分别输入这三个，一行一个，一共按三次[新增]。关于最后的[__ngettext:1,2]，是用于处理单复数的问题，但目前我都还未用上过，我的理解，这里的[1,2]是指单复数要分开来翻译。除非你的主题确实有用到[__ngettext:1,2]，不然你也可以不输入。

poedit theme translation tag 如何翻译WordPress主题

按下[OK]后，会提示你储存.PO文件，通常会把文件储存在主题文件夹里的[languages]文件夹里。注意，文件要按上面说的规则来命名，即简体中文用：zh_CN.po作为文件名，繁体用：zh_TW.po。储存之后，poEdit会自动找出所有需要翻译的文字，按下[OK]后就可以开始翻译：

poedit theme translation text 如何翻译WordPress主题

以下就是翻译介面，按一下列表中的原文，中间会显示等待翻译的原文，你就可以在最下面的方框里输入译文：

poedit theme translation edit1 如何翻译WordPress主题

在这里你会发现一些奇怪的东西像：&#58;或是%s之类。如果你不确定这是什么，你可以看一下原文到底在哪里，poEdit可以帮你找到它们。先在原文列表中选中你要查询的文字，然后选[编辑]–>显示[参考位置]，在弹出的窗口按下[OK]，poEdit就会带你到原文件，并把文字所在的那行高亮显示：

poedit theme translation refer 如何翻译WordPress主题

现在你就知道&#58;其实就是冒号。另外，%s是程式输出的资料。这些都不需要改动，只要放在合适的位置上就可以。

翻译完成之后，按下[档案]–>[储存]，poEdit就会自动帮我们生成一个.MO文件，以供程式(WordPress)使用。到这里翻译就完成了。如果你是帮其他设计师的主题做翻译，记得把你翻译的.PO文件和.MO文件传给主题设计师，让他把你的作品加入到主题中。

poedit theme translation mo1 如何翻译WordPress主题

若有错漏，欢迎指正。

]]> http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e4%ba%94%ef%bc%89/feed/ 0 wordpress主题模版制作教程（四） http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e5%9b%9b%ef%bc%89/ http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e5%9b%9b%ef%bc%89/#comments Thu, 15 Apr 2010 07:48:09 +0000 我是二道 http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e5%9b%9b%ef%bc%89/ 本文转载自zacklive,共有四篇文章

WordPress是以英文为主的网志系统，插件跟主题也是英文版为多，但随着WordPress在全球范围地流行，越来越多不同国家，说着不同语言的人加入WordPress的大家庭。会出现这一情况，其中一个原因就是WordPress本身具国际化概念的设计。WordPress本身有多国语言版本（包括简体及繁体中文），所有的插件及主题亦能轻易地被翻译成其他语言。插件及主题设计师在设计时亦应该考虑翻译的问题，本篇将讨论如何设计出适合翻译的插件或主题。

首先我们要了解WordPress所使用的翻译系统：GNU gettext。这应是目前最流行的翻译框架（Framework），尤其在开源软件的世界中，大多数支援国际化的程式都使用GNU gettext。这个系统能让程式员在编写程式时，标示出需要翻译的文字，这些文字能轻易地被提取出来，让翻译员进行翻译，翻译完成后，系统就能直接使用新语言代替程式中的文字。

要标示出需要翻译的文字，主要有以下三种方式：

  1. __($text) : 这句程式表示$text需要翻译，然后返回翻译结果
  2. _e($text) : 这句程式表示$text需要翻译，然后输出翻译结果到网页，相当于：echo __($text)
  3. __ngettext($single, $plural, $number) : 当$number等于1时，使用$single的翻译，当$number大于1时，使用$plural的翻译

很明显，第三项是为了解决单复数的问题。

再来我们要想的是：哪些文字需要被翻译？答案是直接从主题或插件输出到网页的文字，而不是从数据库（如文章）或后台设定（如网志名称）取得的资料。详细的情况，你只要多试几次就会明白。

现在我们来看看实际的使用情况。最简单的情况是，我们在设计主题时，会写一句，如果找不到任何文章即输出：Not Found，之类的字样，一般的做法是：

<h2>Not Found</h2>

这两个字很明显会直接输出到网页，需要翻译，由于是输出到网页，我们使用_e()：

<h2><?php _e(‘Not Found’); ?></h2>

_e()是PHP程式码要用<?php 及 ?>包住。

接着我们来看第二个例子，我们常常需要在主题中显示有多少个回覆，会使用以下程式：

<?php comments_number(‘No Responses’, ‘One Response’, ‘% Responses’ );?>

程式会先判断有多少个回覆，再输出：没有回覆(No Responses)，还是一个回覆(One Response)或者多个回覆(% Responses)。这里三个回覆都需要翻译，但不是直接显示到网页，而是返回给程式使用，所以我们使用__()：

<?php comments_number(__( 'No Responses'), __('One Response'), __('% Responses'));?>

还有一种情况是，我们需要将整句话翻译，但句子里包含有其他参数。例如，要显示由谁谁谁写的，我们会用：

by <?php the_author(); ?>

如果这里只翻译by的话，可能有些语言的句子会不通顺，就以中文来讲，我们可能想要显示：由谁谁谁撰写，之类的，加了一些文字在the_author()后面。这个时候，我们可以用以下方法：

<?php printf(__(‘by %s’), the_author()); ?>

我们通过__(‘by %s’)标示整句需要翻译，然后用PHP的printf()将the_author()插入句子中并输出到网页。

如果你要留意上面回覆部分的程式码，你发现，其实WordPress在设计就有考虑到一些单复数的问题，所以我们很少会用到__ngettext()。

在这一篇，我们讨论了怎么设计出一个适合翻译的主题或插件，下次我会写一下怎样去实作翻译。

]]> http://erdaoo.cn/2010/04/15/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%ef%bc%88%e5%9b%9b%ef%bc%89/feed/ 0 主题：techtrack-v3（我是二道）修改版 http://erdaoo.cn/2010/04/10/techtrack-v3%ef%bc%88%e6%88%91%e6%98%af%e4%ba%8c%e9%81%93%ef%bc%89%e5%86%8d%e6%ac%a1%e4%bf%ae%e6%94%b9%e7%89%88/ http://erdaoo.cn/2010/04/10/techtrack-v3%ef%bc%88%e6%88%91%e6%98%af%e4%ba%8c%e9%81%93%ef%bc%89%e5%86%8d%e6%ac%a1%e4%bf%ae%e6%94%b9%e7%89%88/#comments Fri, 09 Apr 2010 18:19:53 +0000 1032819 http://erdaoo.cn/?p=466 经过一周多的努力，目前的结果也达到了我想要的样子，修改主题最大的好处就是能够学到更多的WP知识，可以对WP的每个组件都能够灵活搭配，才可以做出更好的主题。同时PHP，CSS,PS这几个方面也有了一些进步。
229bc0f2
这个主题经过了IE6,IE8,Opera,遨游2，遨游3，火狐，谷歌，世界之窗，等等浏览器的检测，没有发生错位，并且在19与22的屏幕上使用也没有错位现像发生。大家可以放心使用了。

使用的插件有：
分页－－wp-pagenavi（2.6中文版）
文章查看－－wp-postviews
相关文章－－WPRP
大家可以自己在网上下载，就不提供了。
主题压缩包可以发邮件与我索取。
229bc0f2
techtarck我是二道修改版

]]> http://erdaoo.cn/2010/04/10/techtrack-v3%ef%bc%88%e6%88%91%e6%98%af%e4%ba%8c%e9%81%93%ef%bc%89%e5%86%8d%e6%ac%a1%e4%bf%ae%e6%94%b9%e7%89%88/feed/ 0 wordpress主题模版制作教程(三) http://erdaoo.cn/2007/08/12/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%e4%b8%89/ http://erdaoo.cn/2007/08/12/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%e4%b8%89/#comments Sun, 12 Aug 2007 14:30:58 +0000 我是二道 http://www.lft59598.cn/?p=45 经过前面的PHP文件制作，我们的主题上已经有了许多的零部件了，但是还没有达到完美的程度，它们就如同一堆乱七八糟的杂物，所以我们还要制作一个样式表文件 ：style.css，为它们安排好自已的位置。

避免误人子弟，我特意找出我的CSS书，重新温习一遍。发现还是2001年买回来的呢。可是这几年都把它雪藏了，唉！！！
先写一下版权信息
/* 
Theme Name:  这里是模版的名字
Theme URI:      这里是模版的网址
Version: 1.0      这里是模版的版号
Author:               这里是作者的名字
Author URI:       这里是作者的网站
*/

现在越来越重视劳动者的权益，所以不得不在文件中声明一下这是哪个人的作品。
其实，只要通过研究别人的作品，至少可以省下一半的力气。
如何来设计一个样式表的思路才是最重要的。
首先要有一个全局观，要学会计算尺寸。你应该清楚，在你的主题模版中，从这里到那里，是属于什么哪一部分的，是要放什么内容进去的。然后你就为这一部分设置它的属性：class与id，当然了，我这里指的是在前面的PHP文件中，为每一个html标签设置的属性。然后我们才可以在样式表文件中具体的来定义这些属性的参数。有一点要注意，上级标签使用了class属性后，它的下级标签中不可再出现id属性。简单一点的说，id可以包含class与id，class不可以包含id.所以说要有一个好的全局观，在为标签的属性命名时才不会出错。

标签的样式定义有着继承性，下级标签会继承上级标签所定义的样式，但是标签也遵循最近原则，例如：
body{color:#000000;}
p{color:#FFFFFF;} 
第一行是定义前景色是黑色，标签p的内容也将因继承性而接受是黑色的前景色，但是标签P又定义前景色是白色，这时标签P的内容将遵循最近原则，改变成白色。

在样式表中，一个点代表class，一个#代表id 。
对于有着相同样式的标签，我们可以把它们集合起来简写，用逗号把每个标签分隔开。
例如：P，h1，h2，div，td{font-size:20px;}
还有一种写代码的情况是这样的：
div  ul li p{font-size:20px}
每个标签用空格隔开，代表着上下级的关系。这表示一个具体的标签的样式，它是div标签下面的ul标签下面的li标签下面的p标签的内部字体大小，这样的一个定义不会涉及到其它位置的标签。
两个特殊的标签是UL与LI，它们可以互相嵌套，如果定义UL，只会对下一级的UL起作用。而对下一级的LI无效。

]]> http://erdaoo.cn/2007/08/12/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%e4%b8%89/feed/ 5 WP插件：voiz-轮流显示格言 http://erdaoo.cn/2007/07/23/wp%e6%8f%92%e4%bb%b6%ef%bc%9avoiz-%e8%bd%ae%e6%b5%81%e6%98%be%e7%a4%ba%e6%a0%bc%e8%a8%80/ http://erdaoo.cn/2007/07/23/wp%e6%8f%92%e4%bb%b6%ef%bc%9avoiz-%e8%bd%ae%e6%b5%81%e6%98%be%e7%a4%ba%e6%a0%bc%e8%a8%80/#comments Sun, 22 Jul 2007 16:02:29 +0000 我是二道 http://www.lft59598.cn/?p=21 这个插件的官方网站是 www.voiz.cn，先去官网注册一个帐号。

下载，安装，WP后台启用插件，再到选项中设置参数。其中：

voiz uid:     [  ]    这里填的是网站上获得的一个ID数
显示条数：[  ]   任意
显示字数：[  ]   任意
来源字数：[  ]   任意
随机显示：[  ]   任意
显示速度：[  ]   8000＝8秒

在网站登陆，在左上角点我的voiz，右下角得到一个代码，复制到WP中想要出现的位置。

<div style=”font-size:12px;cursor:pointer;height:30px;”>

上面的代码中要自行添加最后的一个参数：高度。

在插件的官网中你可以添加你的格言，通过插件显示在你的WP页面中，同时它也会调用其它使用这个插件的用户的格言，轮流显示出来。

修改标签可以自行设定样式。

这个插件的调用函数是：voiz_play()

]]> http://erdaoo.cn/2007/07/23/wp%e6%8f%92%e4%bb%b6%ef%bc%9avoiz-%e8%bd%ae%e6%b5%81%e6%98%be%e7%a4%ba%e6%a0%bc%e8%a8%80/feed/ 2 wordpress主题模版制作教程(二) http://erdaoo.cn/2007/07/21/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%e4%ba%8c/ http://erdaoo.cn/2007/07/21/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%e4%ba%8c/#comments Sat, 21 Jul 2007 03:27:56 +0000 我是二道 http://www.lft59598.cn/?p=20 content

现在开始我们第二部分的代码块
<div id=”content”>
    <?php if(have_posts()) : ?>
    <?php while(have_posts()) : the_post(); ?>

    <?php endwhile; ?>

    <?php endif; ?>
</div>
这里调用if(have_potst())来检测是否有文章存在，如果有的话，就用while循环显示。the_post()就是调用文章的函数。
而每一篇文章又是有标题，有写作时间，有分属类别，有读者的评论，这些又全部需要用div标签来分隔开。
看下面的代码
<div id=”content”>
    <?php if(have_posts()) : ?><!–开始检测–>
    <?php while(have_posts()) : the_post(); ?><!–以下面的格式显示每篇文章–>
        <div class=”post”>
            <h2><a href=”<?php the_permalink();?>”><?php the_title();?></a></h2><!–文章的标题，含有链接地址–>
            <div class=”entry”>
                <?php the_content();?><!–文章的内容–>
                <p class=”postmetadata”><!–文章后面跟随的内容–>
                <?php _e(‘Filed under:’);?>
                <?php the_category(‘,’);?><!–调用当前文章的分类–>
                <?php _e(‘by’);?><!–创建可以翻译的主题–>
                <?php the_autnor(”);?><!–调用文章的作者–>
                <br />
                <?php comments_poopup_link(‘No Comments»’,'1 Comments»’,'% Comment»’);?><!–调 用一个弹出的留言窗口，如果这个功能没有激活，则是显示留言列表–>
                <?php edit_post_link(‘Edit’,'|’,”);?><!–只有在登陆后才可见到，对文章进行编辑的链接–>
                </p>
            </div><!–文章内容彻底结束–>
        </div><!–一篇文章终于结束–>       
    <?php endwhile; ?>
    <?php endif; ?>
</div>
class
现在我们得要说说class了，它与id都是标签的属性，但是不同之处在于，
id的参数值是唯一的，它只能使用一次，而class的参数值是可以多次使用，
比如id=”header”只能用一次，因为我们只有一个地方可以出现博客的名字。
而class=”entry”会经常出现，那是因为我们的博客里不只是有一篇文章。
为什么我们要用到id与class，难道只用一个不行吗，反正功能都是相同的。
不要忘了我们前面说过的一个重要文件，style.css样式表文件。
我们为某一段代码添加了属性，如同起个名字而已，这样在样式表中我们就可以为这些名字来定制它们的样式了。
这样说你还不明白？那就打个最简单的比方吧，你可以有很多的兄弟，但是你们只能有一个爹，
你不能用你爹的名字叫你的兄弟，但是你爹可以用你兄弟的名字叫你。
样式表文件就和你奶奶一样，你爹再牛逼也得听你奶奶的话，叫他怎么样他就得要怎么样。
Not Found
前面的代码中有说到，如果检测到有文章的话，就用循环调出来，可是如果没有文章的话那要怎么样呢？
<?php else:?>
<div class=”post” id=”post-<?php the_ID(); ?>”>
<?php _e(‘Not Found’);?>
</div>
把这一段代码加在<?php endwhile; ?>之后就可以了。

页面导航

当你的博客内容越来越多的时候，在WP的后台又设定了首页只显示10个文章，那么从第11个开始都无法在首页显示出来。
这样在博客的最后一篇文章下面就会出现下一页或是前一页的链接。如果你还不到10个文章，这个链接就不会出现。
把下面的代码加入到<?php else:?>前面
<div class=”navigation”>
<?php posts_nav_link(); ?>
</div>
分析一下posts_nav_link()，它可以有三个参数
 posts_nav_link(‘in between’,'before’,'after’)
第1个参数是显示在后一页和前一页链接的中间。第2个参数显示在后一页和前一页链接的前面。第3个参数显示在后一页和前一页链接的后面。
用什么来显示，你自己决定，常用的就是一些符号或是箭头而已嘛。
现在再看一下index.php文件中我们已经有了哪些个代码
<?php get_header(); ?>
<div id=”content”>
    <?php if(have_posts()) : ?>
    <?php while(have_posts()) : the_post(); ?>
        <div class=”post”>
            <h2><a href=”<?php the_permalink();?>”><?php the_title();?></a></h2>
            <div class=”entry”>
                <?php the_content();?>
                <p class=”postmetadata”>
                <?php _e(‘Filed under:’);?>
                <?php the_category(‘,’);?>
                <?php _e(‘by’);?>
                <?php the_autnor(”);?>
                <br />
                <?php comments_poopup_link(‘No Comments»’,'1 Comments»’,'% Comment»’);?>
                <?php edit_post_link(‘Edit’,'|’,”);?>
                </p>
            </div>
        </div>       
    <?php endwhile; ?>
    <div class=”navigation”>
        <?php posts_nav_link(); ?>
    </div>
    <?php else:?>
        <div class=”post” id=”post-<?php the_ID(); ?>” >
            <?php _e(‘Not Found’);?>
        </div>
    <?php endif; ?>
</div>
**********************************************************
写教程不是一个简单的事，它不光让我心烦，还让我难以找到适当的词来表达，所以要体会一下当老师的难处。
*********************************************************

侧边栏 

第三部分，关于侧边栏。侧边栏有一个特点，就是又臭又长，当然了这不是什么缠脚布。先不要乱扯。
因为地形有限，所以侧边栏里的内容，多以列表的形式排开。下面欢迎一对父子出场，他们的感情是相当的好，从来都是父子不分家，有父必有子，有子必有父，父中有子，子中有父。他们就是<UL>与<LI> !!!!!!!

<div class=”sidebar”><!–注意这里使用的不是id–>
    <ul>
        <li>
            <h2><?php _e(‘文章分类’); ?></h2>
        </li>
    </ul>
</div>
ul表示无序列表，li表示有序列表。
在侧边栏里，你要有几个不同的栏目，栏目的存在，就是为侧边栏进行了分类整理。
每一个栏目又要有不同的分类列表，继续为上面的代码添加内容。
<div class=”sidebar”>
    <ul>
        <li><h2><?php _e(‘文章分类’); ?></h2>
                <ul>
                    <?php wp_list_cats(’sort_column=name&optioncount=1&hierarchical=0′); ?>
                </ul>
        </li>
    </ul>
</div>
wp_list_cats()函数为调用文章分类列表，它的参数也有三个。每个参数之间用&来分隔。
sort_column=name – 把分类按字符顺序排列
optioncount=1 – 显示在每个分类下面的文章数
hierarchial=0 – 不把子分类放到子列表条目中
********************************************************************************
静态页面

说到分类，特别说一下页面这个栏目。我们在WP后台撰写的时候，有二个选择，一个是撰写文章，一个是撰写页面。
对于文章，还可以选择保存在哪一个具体的分类下面。对于页面就没得选择，只收录于页面栏目之下。 再回到前台，
你可以看到每个文章分类都有显示文章的数目，而不显示标题。
在页面栏目里，只排列了每一个页面的标题，而不显示数目。

<?php wp_list_pages(‘depth=3&title_li=”<h2>页面</h2>’); ?>

参数depht=3为可选参数，表示可以设定显示三级列表。
*******************************************************************************
注意一点，本教程的代码是制作模版的代码，在WP中使用一个主题也就是等于在套用一个模版。
在网站中查看源代码是看不到模版的代码的。
<li><h2><?php _e(‘文章分类’); ?></h2>
                <ul>
                    <?php wp_list_cats(’sort_column=name&optioncount=1&hierarchical=0′); ?>
                </ul>
        </li>
上面这一段模版代码，在网页中查看源代码，实际上显示的是这样的
<li><h2>文章存档</h2>
    <ul>
        <li><a href=”#” mce_href=”#”>与爱情有关的分类贴子</a></li>
        <li><a href=”#” mce_href=”#”>与生活有关的分类贴子</a></li>
        ………………………………………………
    </ul>
</li>
**********************************************************************************
增加一个存档栏目
<li><h2><?php _e(‘文章存档’); ?></h2>
    <ul>
        <?php wp_get_archives(‘type=monthly’); ?>
    </ul>
</li>
wp_get_archives()函数是获取文章存档的方法，参数’type=monthly’定义为以每个月的时间来进行分类存档
********************************************************************************
增加一个友情链接栏目

<?php get_links_list(); ?>
不用担心没有实际内容，它会自动调用在WP后台中添加的友情链接。
********************************************************************************
增加一个搜索栏目

<li id=”search”>
<?php include(TEMPLATEPATH. ‘/searchform.php’); ?>
</li>
使用include()函数调用一个文件，参数TEMPLATEPATH为文件的目录文件夹，为了调用成功，你还需要有一个文件，
searchform.php——>代码请看这里。
*******************************************************************************
增加一个日历栏目

<li id=”calendar”>
    <h2><?php _e(‘日历’); ?></h2>
    <?php get_calendar(); ?>
</li>
这里就不用多废话了。
********************************************************************************
增加一个管理栏目

<li>
    <h2><?php _e(‘管理’); ?></h2>
    <ul>
        <?php wp_register(); ?>
        <li>
            <?php wp_loginout(); ?>
        </li>
        <?php wp_meta(); ?>
    </ul>
</li>
wp_loginout()来确定你是否登陆，如果登陆就显示登出链接，如果没有登陆，就显示登陆的链接。
wp_register()来确定你的身份，如果没有登陆，就显示注册的链接，如果有的话，就显示管理的链接。
而wp_meta()却是什么也没有做。也不用去理它，还没有人来说明它是起什么作用的。实际上它是 WordPress 的hook。
********************************************************************************
窗体化侧边栏

<?php     /* Widgetized sidebar, if you have the plugin installed. */
                    if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar() ) : ?>
在侧边栏开始的地方第一个<ul>的后面，加上以上代码。也要在侧边栏结束的地方</ul>前面加上一句

<?php endif; ?>

从WP2.0开始，已经在后台集成了一个侧边栏的插件－－Widgetized，它的功能就是可以很方便的在WP后台调整侧边栏中的内容，直接使用鼠标就可以移动每一个栏目的位置，而不需要去修改相应的代码。让每一个栏目都以窗体化存在。
function_exists(‘dynamic_sidebar’) || !dynamic_sidebar()这两个参数来自于一个新的文件－－functions.php,
我们需要创建这个文件才可以完成侧边栏的窗体化－－－－>>代码在这里
*******************************************************************************
通过观察不同的WP主题，会发现在侧边栏中的内容远不止以上所列举的，
要在学习中举一反三，才会制作出更加出众的主题。
*******************************************************************************
至此，侧边栏中的内容结束，我们也可以把第三部分的代码另存为一个新的文件－－sidebar.php,
在index.php中填加一句代码就可以使用侧边栏
<?php get_sidebar(); ?>
顺便再增加一行代码
<?php get_footer();?>
这是调用尾部文件footer.php的代码。我想你应该知道如何处理一个简单的PHP文件了，要么你就再重头学一次本教程。
*****************************************************************************
再一次查看一下index.php有了哪些代码

<?php get_header(); ?>
<div id=”content”>
    <?php if(have_posts()) : ?>
    <?php while(have_posts()) : the_post(); ?>
        <div class=”post”>
            <h2><a href=”<?php the_permalink();?>”><?php the_title();?></a></h2>
            <div class=”entry”>
                <?php the_content();?>
                <p class=”postmetadata”>
                <?php _e(‘Filed under:’);?>
                <?php the_category(‘,’);?>
                <?php _e(‘by’);?>
                <?php the_autnor(”);?>
                <br />
                <?php comments_poopup_link(‘No Comments»’,'1 Comments»’,'% Comment»’);?>
                <?php edit_post_link(‘Edit’,'|’,”);?>
                </p>
            </div>
        </div>       
    <?php endwhile; ?>
    <div class=”navigation”>
        <?php posts_nav_link(); ?>
    </div>
    <?php else:?>
        <div class=”post” id=”post-<?php the_ID(); ?>” >
        <?php _e(‘Not Found’);?>
        </div>
    <?php endif; ?>
</div>
<?php get_sidebar(); ?>
<?php get_footer();?>
index.php文件的代码已经全在这里了，但是只有第二部分内容需要详细的代码，而其它的部分我们都可以调用外部文件，
至此一个WP的主题构造已经搭建好，再一次提醒各位，检查代码，确认书写正确。只有不厌其烦地写代码才会对代码有更深刻的印像。
***********************************************************************************
下面开始创建其它文件
*******************************************
将index.php的全部代码另存为archive.php，并且把the_content 改成 the_excerpt，
创建存档文件，它会显示在分类栏目下的每篇文章的摘要。
*******************************************
如何创建category.php????
方法同上面一样，就连代码也一样，中是改个名而已，哈哈哈。

*******************************************
将archive.php另存为search.php,创建搜索文件，这样就可以在搜索中得到每篇文章的摘要。
*******************************************
将index.php的全部代码另存为page.php，创建页面文件
在 <?php the_content(); ?> 下面输入以下代码：

<?php link_pages(‘<p><strong>Pages:</strong> ‘, ‘</p>’, ‘number’); ?>
                 说明：如果一个页面，篇幅超长的话，我们可以把它截断分成几页来显示，

<?php edit_post_link(‘Edit’, ‘<p>’, ‘</p>’); ?>
                说明：显示一个可以编辑的链接 
删除掉<p class=”postmetadata”>至</p>这一块的代码
删除掉<div class=”navigation”>
        <?php posts_nav_link(); ?>
    </div>
说明：对于页面，它没有属于哪个分类，我们也不希望被某人评论，当然它也不能显示与另一个页面间的连接，所在要去掉一部分代码。
******************************************
将index.php的全部代码另存为single.php，创建单篇文章文件，点击文章的标题，可以查看全文内容。
在 <?php the_content() ?> 下输入：

<?php link_pages(‘<p><strong>Pages:</strong> ‘, ‘</p>’, ‘number’); ?>
这段代码和上一例相同，都是可以用来截断文章。

删除<br />
    <?php comments_poopup_link(‘No Comments»’,'1 Comments»’,'% Comment»’);?>
把<?php posts_nav_link(); ?>：
替换成<?php previous_post_link(‘« %link’) ?> <?php next_post_link(‘ %link »’) ?>
说明：在单篇文章的下面显示的应是上一篇与下一篇的链接，而不是上一页与下一页的链接。

***************************************
如何处理留言评论？

想一想，每一个留言评论都是对于一个文章而产生的，所以只要在单篇文章页面里添加一个调用评论的函数就可以
在 single.php 文件中，<div class=”entry”>代码块结束的</div>下面，输入以下代码：
<div class=”comments-template”>
<?php comments_template(); ?>
</div>
comments_template()这个函数是用来从 comments.php 文件调用评论模板。
所以我们还要创建一个comments.php文件。
*****************************************

模版的代码已经写完，接下来要做的就是如何美化模版。
到目前为止还没有提到过一张图片的名字，所以我要你开始构思你的模版，
用PS做出相应位置的图片，然后在style.css文件中去美化它们吧。

]]> http://erdaoo.cn/2007/07/21/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b%e4%ba%8c/feed/ 6 wordpress主题模版制作教程(一) http://erdaoo.cn/2007/07/20/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b/ http://erdaoo.cn/2007/07/20/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b/#comments Fri, 20 Jul 2007 07:13:25 +0000 我是二道 http://www.lft59598.cn/?p=19 本教程学习于我爱水煮鱼的翻译文章，经过整理而成。经作者同意，发表在我的网站上，供热爱制作WP模版的朋友们参考。

学习本教程，需要：

  1. 对PHP，WP，CSS，PS有一定的基础，懂得初步的应用。
  2. 你是一个想要表现自己的家伙，并且不想再使用别人制作的主题。
  3. 你要有耐心，细心，细心，耐心

WP 主题简介

在详细分解代码之前，我们还是要先了解一下WP主题的大致情况。一个 WP 的主题是由几个 templates 文件组成的，每一个主题必有的二个文件是：index.php 和 style.css，除此之外还有一些其它的文件（不是必须），它们和 index.php 文件间存在优先级关系，如果它们存在，WP 模板系统就会调用它们显示相应的页面，否则模板系统会调用 index.php 来显示。

它们有可能是以下文件：

  • single.php – 单一日志文件，用于显示单一日志
  • page.php — 页面模板文件，用于显示静态页面
  • archive.php — 存档文件，用于显示存档页面
  • category.php — 类别文件，用于显示类别页面
  • search.php — 搜索文件，用于显示搜索结果
  • 404.php — 错误文件，用于显示404页面
  • comments.php — 评论文件，用于显示评论和评论框

index.php

首先制作index.php，我们知道在一个网页中，代码主要分为二部分，一个是页头信息，一个是页面内容。
<html>
<head>
………页头信息
</head>
<body>
………页面内容
</body>
</html>
每个主题的页头信息都是几乎一样，具体可以查看默认模板的 header.php 文件（为保证所有页面的页头信息的一致性，所有页头信息都放在 header.php 文件）。


接下来我们谈下一话题，关于母猪的产后护理……（我学的太杂了，都弄混了）
我们来谈一下body中的内容。它包含四个部分，每一部分都可以叫做一个集成模块，其实一个主题就是由不同的模块构成，模块又是由不同的模块构成。

  • header  WP 的顶部，显示博客的名字与描述，放置导航栏，搜索栏等等。 
  • content  WP 的正文部分，显示贴子的内容，作者，时间，分类，评论，编辑等等。
  • sidebar  WP 的侧边栏部分。
  • footer   WP 的尾部，这部分只有很少的内容，通常是版权信息。

对于每一个集成模块中的内容，理论上是可以随意放置的，比如我们可以把header模块中的搜索栏放在sidebar模块中去。那如何区分这四个集成模块呢？看以下代码。
<div id=”header”>
 这是我的博客名字
</div>
<div id=”content”>
 这是我写的贴子
</div>
<div id=”sidebar”>
 友情链接，搜索栏
</div>
<div id=”footer”>
 版权所有：我是二道
</div> 
通过div标签，我们可以把这些个模块分隔开来。
现在开始我们第一部分的代码块，不过在写代码之前我还得要啰嗦一句，这不是我说的，是我爱水煮鱼说的，写代码要有层次感，要记得使用缩进，缩进不是空格，不是用你键盘上最长的那个键，而是TAB这个键。

header

<div id=”header”>
         <h1><a href=”<?php bloginfo(‘url’);?>”><?php bloginfo(‘name’);?></a></h1>
         <?php bloginfo(‘description’);?>
</div> 
id是div的一个属性，为id赋于不同的值，这样就可以区分每一个div代码段。 
bloginfo()是WP中定义好的函数，参数url代表网址，参数name代表网站的名字，参数description代表对网站的自我描述。
在上面的代码中，就是为网站的名字加上一个超链接,并且显示描述。
这一部份代码也是存放于header.php文件中，在index.php文件中只要用一行代码就可以调用到
<?php get_header(); ?>
这样的好处是，你只要修改一下header.php文件，所有调用这个文件的页面都会跟随改变，而不用一个一个地去修改了。

]]> http://erdaoo.cn/2007/07/20/wordpress%e4%b8%bb%e9%a2%98%e6%a8%a1%e7%89%88%e5%88%b6%e4%bd%9c%e6%95%99%e7%a8%8b/feed/ 1