WordPress 主题开发官方向导(中文版)
本文 由 [url=http://docman.cn]docman.cn 翻译家[/url] 组织翻译由于贴在这里导致了大量html格式的丢失,显示有些乱,请到 [url=http://docman.cn]docman.cn 翻译家[/url] 阅读完整版.
WordPress 主题开发
下面的这篇文章是关于开发和设计你自己的WordPress主题. 如果你希望知道更多的关于如何安装和使用主题的知识,回顾一下关于使用主题的文档. 本文的论题区别于 使用主题 ,因为它讨论的是些代码方面的技术问题.不是如何去激活主题或者去获得新的主题.
你也许想为你自己开发新的WordPress主题或者想 发布出来.
[edit]为什么要给WordPress做风格主题
WordPress主题是一些文件和样式表,它们一起作用让WordPress网站有了显示或外表. 每个主题都能不同,它们给用户提供了很多选择,让用户去瞬间的改变它们网站的风格. 为什么你要开发你自己的WordPress主题呢?
为了给你创造一个独特的WordPress网站外表
为了利用 templates, template tags, and the WordPress Loop 来产生不同的网页返回结果和样子.
为了给网站某些特效页面提供可替换的模板,例如 分类页面 和搜索返回结果页面.
为了在两种网站布局间快速切换,或者是使用 主题或风格转换器 让用户能改变他们站点的样子.
为了设计主题,发布它们,这样其它人就能够欣赏你的设计.
WordPress主题有很多好处
它把表现样式和模板文件从系统文件中分离出来了,这样当系统升级时不至于影响到站点的表现形势
它允许在主题外自定义一些独特的网页表现.
它允许快速改变一个网站的面貌和给人的感觉.
它不需要一个WordPress 用户为了拥有一个好看的网站外表而去学习 CSS,HTML,和PHP.
那为什么你要开发自己的WordPress主题呢? 这是个很实际的问题.
它是一个学习CSS, HTML/XHTML, and PHP的机会.
它是一个机会让你在CSS, HTML/XHTML, and PHP 上使用你的特长.
创造性
有趣(大多数时间).
如果你 向外发布了它, 你会感觉很好,因为你想分享了你的成功,给 WordPress社区 增添了价值(okay, bragging rights!)
[edit]解析一个主题
WordPress主题模板文件位于wp-content/themes/子目录下. 主题子目录下放着所有的主题样式表文件,模板文件和图片. 例如, 一个叫 "test" 的主题应该放在wp-content/themes/test/目录下.
WordPress 在你下载时已经有两个主题, "Classic" and"Default" 主题. 两个主题完全不一样,它们使用不同的函数和标签去产生它们的网页效果和样子.你可以查看这些主题文件,想想如何去写自己的主题文件,但要小心.
WordPress主题除了图片文件外,还有两种主要的文件类型. 一个是样式表文件叫做 style.css, 它控制着网页的表现(样子),一个是模板文件,它控制着网页将数据库里的信息产生出来显示的方式. 让我们依次来看.
[edit]主题样式表
样式表文件里,除了关于主题的CSS样式信息外,style.css必须以注释的形势提供关于主题的信息.而且不能够出现两个主题有相同的注释信息的情况,因为这样会在"主题选择对话框"里发生冲突. 如果你想通过拷贝一个现存的主题来开发自己的主题,一定要确保先把主题注释信息修改了
下面是一个叫做"Rose"主题的样式表前几行的例子,我们叫它样式表头.
/*
Theme Name: Rose
Theme URI: the-theme's-homepage
Description: a-brief-description
Author: your-name
Author URI: your-URI
Template: use-this-to-define-a-parent-theme--optional
Version: a-number--optional
.
General comments/License Statement if any.
.
*/这个最简单的主题里有一个style.css的文件,加上几张图片. 想要制作这样的主题,你必须通过编辑 style.css头注释里的 "Template:" 行,来指明要从哪个主题上继承. 例如,如果你想让"Rose"主题的模板去继承另外一个叫"test"的主题,你应该在Rose的style.css的开始部分写上 Template: test 现在"test"是"Rose"的父亲主题了,而"test"主题的 wp-content/themes/Rose目录下仍然只包含一个 style.css 文件和相伴的图片. (注意声明了父主题的主题将会从父亲那继承所有的模板文件--这就意味这儿子主题目录下的模板文件都将被忽略 .)
WordPress需要style.css的注释前几行去确定一个主题,把它当作一个有效的主题选项在 Admin panel > Presentation 里和其它已经安装的主题放在一起.
注意 : 当你注释头里的Template:部分定义一个父主题时,你必须使用这个样式的目录的名称.例如,如果使用Wordpress Default 主题,不用这样写 Template: WordPress Default, 而是 Template: default, 因为defoult是这个主题的目录名.
[edit]主题模板文件
模板是些 PHP文件,用来生产用户请求的的页面.让我们看看用来被定义成主题的一部分的各种模板文件.
WordPress 允许你为你的blog的各方面去定义独立的模板,然而,本质上,让你的blog所有功能运行并不需要所有的这些不同的模板文件. 模板文件的选择和产生是以模板层次为基础的,依赖于在特定的主题里哪些模板文本有效. 作为一个主题开发者,你可以利用模板去选择任何你想个性化的实现. 例如,作为一个极端的例子,你可以只用一个叫做index.php的模板文件去产生在你的博客中要显示的所有页面. 更常见的用法是用不同的模板来产生不同的结果页面,以获得最多的个性化.
[edit]基本模板
最微型的情况下,一个WordPress主题包含两个文件:
style.css
index.php
这两个文件都放在主题的目录下面. 这个 index.php 模板文件是非常的灵活. 它可以用来包含你的站点用户生产的所有页面的引用,包括the header, sidebar, footer, content, categories, archives, search, error,and other web pages. 或者它可以被细分为模板文件组件,每个都执行一部分的工作量.如果你不提供任何其它的模板文件,WordPress就会使用内置的缺省文件. 例如,如果你没有 comments.php 和 comments-popup.php 模板文件, 那么 WordPress 就会自动的使用 模板层级.上的 wp-comments.php 和 wp-comments-popup.php 模板文件.这个缺省的模板也许不符合你的主题风格的要求,所以你可能希望使用你自己的. 这些基本文件 (一般放在主题目录下)一般被细分成:
header.php
sidebar.php
footer.php
comments.php
comments-popup.php
使用这些模板组件,你可以用index.php主文件将那些你希望用来生产出现在你最终页面小单元的模板标签包括或者取进来.
To include the header, use the get_header() template tag.
To include the sidebar, use the get_sidebar() template tag.
To include the footer, use the get_footer() template tag.
这是一个 include 用法的例子:
<?php get_sidebar(); ?>
<?php get_footer(); ?>至于关于这些不同的模板是如何工作的和如何使用它们生成不同效果的信息, 请阅读 Templates 文档. 续
[edit]基于查询功能的模板
WordPress可以为不同的查询类型装载不同的模板. 有两个办法: 做为内建的 模版分层 的一部分, 和通过在模板的循环中使用 Conditional Tags
为了使用 模板层次, 你一般需要提供特殊目的的模板文件, 这个文件会自动的覆盖掉 index.php. 例如,如果你的主题提供了一个模板叫category.php ,当一个分类查询发生时, category.php 就会替代index.php被装载. 如果 category.php 不存在, index.php 就会被使用..
你甚至可以利用模板分层属性得到更多的特效,例如把一个文件名定为 category-6.php -- 当一个ID号为6的分类被请求时这个文件就会被调用,而不是调用 category.php . (如果你以站长的身份登录,你就可以在 Manage > Categories 里找到这个分类的ID号). 如果想对这个过程是如何工作的,请看 Category Templates.
如果你的主题需要更多的控制,超过了 Template Hierarchy里的模板所能提供的能力,你应该使用 Conditional Tags. 在WordPress循环 中,条件标签主要是检查某些特定的条件是否为真,这样就可以加载特定的模板,或者将某些特定的文字显示在页面上.
例如,为了让某个特定的分类里的帖子显示出独特的样式,你的代码应该写成这样:
<?php
if (is_category(9)) {
// looking for category 9 posts
include(TEMPLATEPATH . '/single2.php');
} else {
// put this on every other category post
include(TEMPLATEPATH . '/single1.php');
}
?>或者,使用查询,应该是这样:
<?php
$post = $wp_query->post;
if ( in_category('9') ) {
include(TEMPLATEPATH . '/single2.php');
} else {
include(TEMPLATEPATH . '/single1.php');
}
?>两个例子中,这些代码都会因为这个特定的被显示帖子的分类而使用不同的模板文件. 查询条件写法并不是只适用于分类,然而---还是去看看Conditional Tags 的文章知道一下所有的选项.
[edit]主题模板文件清单
下面是些WordPress可以识别的主题模板文件清单. 当然了,你的主题可以包含任何其他的样式表,图片,或者文件. 但是要注意下面的这些对WordPress有着特殊的含义 -- see Template Hierarchy for more information.
style.css
主样式表文件. 它必须被包含在主题里,而且必须有着描述这个主题的头信息.
index.php
主模板文件. 如果你的主题有着自己的模板文件,index.php这个必须要有.
comments.php
评论模板文件. 如果不存在,缺省主题里的这个文件会被调用.
comments-popup.php
弹出式评论模板文件. 如果它不存在,缺省主题里的这个文件会被调用.
home.php
主页模板.
single.php
单个帖子的模板. 当用户查看单个帖子时,这个将会被调用. 当这个文件或者其他模板被请求,而又不存在时,由index.php模板替代.
page.php
独立页模板. 当一个独立的页面被请求时,它会被使用.
category.php
类别模板. 当类别信息被请求时调用.
author.php
作者模板. 当作者被查询时使用.
date.php
关于 date/time 的模板. 当日期时间被请求时使用. Year, month, day, hour, minute, second.
archive.php
归档模板. 当一个分类,作者或者日期被请求时调用. 注意这个模板有可能因为各自的目的不同而被 category.php, author.php, and date.php 替代调用.
search.php
搜索模板. 当搜索被执行时调用.
404.php
The 404 Not Found template. 当WordPress不能够找到一个符合要求的帖子或者页面时会被调用.
这些文件对WordPress来说有着特殊的含义,因为当他们存在时或者根据模板分层结构,根据某些 Conditional Tag (a.k.a is_*(); 函数) 返回真时,它们就会替代index.php文件. 例如,如果当一个帖子被单独显示时,函数 is_single() 会返回 'true', 并且, 如果当激活状态的主题里有一个 single.php 文件时, 这个文件会被用来生成显示页面.
[edit]在一个模板里引用文件
WordPress的缺省主题 (基于Michael Heilemann's Kubrick ([url]http://binarybonsai.com/kubrick/)[/url] 为 WordPress 1.2做的版式) 就是关于用户请求是如何映射到模板提供了一个好例子.
代码 <?php bloginfo('template_directory'); ?>会在模板的输出中插入模板目录的URL信息. 你可以在这个输出里扩展任何其他的URI来引用主题里的文件,
代码 <?php bloginfo('stylesheet_directory'); ?>会将当前用来输出的主题里的样式表的目录的URL输出. 你可以在这个输出里扩展其他任何的URI信息去引用你主题里的文件,特别时被用于样式的.
常量TEMPLATEPATH 是当前主题的模板的绝对路径(结尾没有 / 符号).
注意样式文件里的URI是相对于样式文件的,而不是相对于引用样式的文件. 这个省去了在php代码里引用CSS需要指定目录的麻烦. 例如,如果你的主题里有个 images/ 目录,你在CSS里只需要指定相对于这个目录的地址.
h1 { background-image: URL(images/my_background.jpg); }
用这种风格的URI在模板里引用文件是个好的做法,因为,这样你的模板就不会依赖于绝对路径.
[edit]定义个性模板
使用WordPress插件系统根据你自己的习惯标准去定义额外的模板是可以的.这些高级的特性可以使用 template_redirect action hook来实现. 在 Plugin API 参考里你可以发现更多的相关信息..
[edit]插件接口钩子(Hooks)
当开发主题时,你应该记住,你的开发的主题应该和其它的你(或者其他的用户)将决定安装的其他插件能够兼容的工作. 插件通过"Action Hooks" (see Plugin APIfor more information)给WordPress增加功能. 大部分的Action Hooks都在WordPress的核心PHP代码里,所有你不需要其他任何额外的标签就能让它们工作. 但是一些Action Hooks需要在你的主题里表现在前面,这样你的插件能够在你的header, footer, sidebar, or in the page body里直接的显示信息. 这些是你需要去包含的一下特殊的模板Action Hook标签的清单:
wp_head
在主题的 HTML <head>里; header.php 模板. plugin使用例子: 加入 javascript 代码.
Usage: <?php do_action('wp_head'); ?>
-or- <?php wp_head(); ?>
wp_footer
在主题的 "footer"里; footer.php 模板. 插件使用例子:加入footer的底部加入php代码,这样其它部分运行完后就会运行它.
Usage: <?php do_action('wp_footer'); ?>
-or- <?php wp_footer(); ?>
wp_meta
一般是位于主题菜单的 <li>Meta</li> 部分或者sidebar: sidebar.php 模板. 用法例子:引入一个调向的广告或者一个tag cloud.
Usage: <?php do_action('wp_meta'); ?>
-or- <?php wp_meta(); ?>
comment_form
位于 comments.php 和 comments-popup.php里, 就在评论表单的 closing tag (</form>)前面. 用法例子:预览一个评论.
Usage: <?php do_action('comment_form', $post->ID); ?>
在缺省的主题模板里,你能发现这些用法插件钩子的实际的例子.
[edit]主题开发的一般原则
下面所说的请在你的文档里把它搞清除(在你的主题里有个README文件,它帮助了许多用户克服了它们碰到的所有的阻碍):
精确的指明你想实现什么样的主题和模板.
指明你的主题里不足的地方,如果有的话.
在模板和样式文件的注释里要清楚的指明所做的任何修改. 给修改处,模板片段,样式特别是那些有交叉使用的文件做注释.
如果你需要引入一下custom RewriteRules,需要一下额外的特殊的模板,图片或者文件,这些特殊的需求要显式的为那些使用你的主题的用户说明这些工作步骤.
争取在各种浏览器里测试你的主题,这样至少能发现一些以后这个主题使用者会发现的问题.
提供联系信息(网页或者email),如果可能,提供支持信息和问题解决方法.
花点时间去通读 Designing Themes for Public Release 这篇文章,它里面有很多好技巧让你的主题完善到可以给大家使用.
[edit]参考资源
There is a comprehensive list of WordPress Theme and Template File resources in the Templates article.
Retrieved from "http://codex.wordpress.org/Theme_Development" 沙发!沙发!家具厂生日快乐,它不是一个人做沙发,不是一个人!
翻译的太好了,受益匪浅!
页:
[1]