WordPress: Stepping Into Templates：修订间差异
来自站长百科
（新页面: __TOC__ Template files are the building blocks of your WordPress site. They fit together like the pieces of a puzzle to generate the web pages on your site. Some templates (the header and...） |
无编辑摘要 |
||
| 第1行： | 第1行： | ||
__TOC__ | __TOC__ | ||
Template files are the building blocks of your WordPress site. They fit together like the pieces of a puzzle to generate the web pages on your site. Some templates (the header and footer template files for example) are used on all the web pages, while others are used only under specific conditions. | Template files are the building blocks of your WordPress site. They fit together like the pieces of a puzzle to generate the web pages on your site. Some templates (the header and footer template files for example) are used on all the web pages, while others are used only under specific conditions. | ||
模板文件是你的WordPress站点的积木。它们就像一个个迷一样地组合在一起，在你的站点上制作出网页。一些模板（例如标题和页脚模板文件）能在所有的网页上使用，然而其它的模板文件只能在一些特别情况下才能使用。 | |||
A traditional web page consists of two files: | A traditional web page consists of two files: | ||
一个传统的网页包括两个文件： | |||
*The [[Wordpress:Glossary#XHTML|XHTML page]] to hold the structure and content of the page and | *The [[Wordpress:Glossary#XHTML|XHTML page]] to hold the structure and content of the page and | ||
*the [[Wordpress:Glossary#CSS|CSS Style Sheet]] which holds the presentation styles of the page. | *the [[Wordpress:Glossary#CSS|CSS Style Sheet]] which holds the presentation styles of the page. | ||
* [[Wordpress:Glossary#XHTML|XHTML 网页]]保存网页结构和内容和 | |||
*[[Wordpress:Glossary#CSS|CSS 样式表]]保存网页的显示方式。 | |||
In WordPress, the (X)HTML structure and the CSS style sheet are present but the ''content'' is generated "behind the scenes" by various [[Wordpress:Templates|template files]]. The template files and the style sheet are stored together as a [[Wordpress:Using Themes|WordPress Theme]]. To learn more about creating Themes, read [[Wordpress:Theme Development]]. | In WordPress, the (X)HTML structure and the CSS style sheet are present but the ''content'' is generated "behind the scenes" by various [[Wordpress:Templates|template files]]. The template files and the style sheet are stored together as a [[Wordpress:Using Themes|WordPress Theme]]. To learn more about creating Themes, read [[Wordpress:Theme Development]]. | ||
在WordPress中，(X)HTML和CSS样式表是显示的，但是''内容''是通过不同的[[Wordpress:Templates|模板文件]] "在后台"产生的。模板文件和样式表作为一个[[Wordpress:Using Themes|WordPress 主题]]被保存在一起。学习更多的关于创建主题的内容，阅读[[Wordpress:Theme Development|主题发展]]。 | |||
== The WordPress Page Structure == | |||
== WordPress 网页结构 == | |||
A simple WordPress web page structure is made up of three basic building "blocks": a header, the content, and a footer. Each of these blocks is generated by a template file in your current WordPress Theme. | A simple WordPress web page structure is made up of three basic building "blocks": a header, the content, and a footer. Each of these blocks is generated by a template file in your current WordPress Theme. | ||
一个简单的WordPress网页结构由三个基本的"积木"组成:标题，内容和页脚。每一块都由当前WordPress中的一个模板文件产生。 | |||
<div style="margin:5px;float:right"> | <div style="margin:5px;float:right"> | ||
| 第25行： | 第34行： | ||
</div> | </div> | ||
</div> | </div> | ||
<div style="margin:5px;float:right"> | |||
<div style="background:white; border:2px blue solid;margin:5px; padding-top:10px; font-size: 130%; text-align: center; width:120px; height:50px"> | |||
Header | |||
</div> | |||
<div style="background:white; border:2px red solid;margin:5px; padding-top:10px; font-size: 130%; text-align: center; width:120px; height:50px"> | |||
Content | |||
</div> | |||
<div style="background:white; border:2px purple solid;margin:5px; padding-top:10px; font-size: 130%; text-align: center; width:120px; height:50px"> | |||
Footer | |||
</div> | |||
</div> | |||
* The '''header''' contains all the information that needs to be at the ''top'' — i.e. inside the <tt style="font-weight:bold; color:#036"><nowiki><head></nowiki></tt> tag — of your XHTML web page, such as the <tt style="font-weight:bold; color:#036"><nowiki><doctype></nowiki></tt>, <tt style="font-weight:bold; color:#036"><nowiki><meta></nowiki></tt> tags and links to style sheets. It also includes the opening <tt style="font-weight:bold; color:#036"><nowiki><body></nowiki></tt> tag and the visible [[Wordpress:Designing Headers|header]] of your blog (which typically includes the title of your site, and may also include navigation menus, a logo bar, the description of your site, etc.). | * The '''header''' contains all the information that needs to be at the ''top'' — i.e. inside the <tt style="font-weight:bold; color:#036"><nowiki><head></nowiki></tt> tag — of your XHTML web page, such as the <tt style="font-weight:bold; color:#036"><nowiki><doctype></nowiki></tt>, <tt style="font-weight:bold; color:#036"><nowiki><meta></nowiki></tt> tags and links to style sheets. It also includes the opening <tt style="font-weight:bold; color:#036"><nowiki><body></nowiki></tt> tag and the visible [[Wordpress:Designing Headers|header]] of your blog (which typically includes the title of your site, and may also include navigation menus, a logo bar, the description of your site, etc.). | ||
*'''标题'''包含了所有应该在''上面的''信息— 例如在<tt style="font-weight:bold; color:#036"><nowiki><head></nowiki></tt> tag &mdash里面; 在你的 XHTML网页, 例如 <tt style="font-weight:bold; color:#036"><nowiki><doctype></nowiki></tt>, <tt style="font-weight:bold; color:#036"><nowiki><meta></nowiki></tt> 样式表的标签和链接. 它也包括打开的 <tt style="font-weight:bold; color:#036"><nowiki><body></nowiki></tt> 标签和可见到的你的博客的[[Wordpress:Designing Headers|标题]] (通常包括你的站点的标题，导航菜单，标示语条，以及对你的站点的描述，等等。). | |||
* The '''content''' block contains the posts and pages of your blog, i.e. the "meat" of your site. | * The '''content''' block contains the posts and pages of your blog, i.e. the "meat" of your site. | ||
* '''内容'''块包括了你的博客的文章和网页，例如你的站点的"肉类" | |||
* The '''footer''' contains the information that goes at the bottom of your page, such as links to other [[Wordpress:Pages]] or categories on your site in a [[Wordpress:Good_Navigation_Links|navigation menu]], copyright and contact information, and other details. | * The '''footer''' contains the information that goes at the bottom of your page, such as links to other [[Wordpress:Pages]] or categories on your site in a [[Wordpress:Good_Navigation_Links|navigation menu]], copyright and contact information, and other details. | ||
* '''页脚'''包括了你的网页的底部的信息，例如，在 [[Wordpress:Good_Navigation_Links|导航菜单]]上对于你的站点的其它的[[Wordpress:Pages|网页]]或者类别的链接，版权和联系信息，以及其它的详细信息。 | |||
=== Basic Template Files === | === Basic Template Files === | ||
=== 基本的模板文件 === | |||
To generate such a structure within a [[Wordpress:Using Themes|WordPress Theme]], start with an <tt style="font-weight:bold; color:#036">index.php</tt> template file in your Theme's directory. This file has two main functions: | To generate such a structure within a [[Wordpress:Using Themes|WordPress Theme]], start with an <tt style="font-weight:bold; color:#036">index.php</tt> template file in your Theme's directory. This file has two main functions: | ||
* Include or "call" the other template files | * Include or "call" the other template files | ||
* Include the [[Wordpress:The Loop|WordPress Loop]] to gather information from the database (posts, pages, categories, etc.) | * Include the [[Wordpress:The Loop|WordPress Loop]] to gather information from the database (posts, pages, categories, etc.) | ||
在[[Wordpress:Using Themes|WordPress 主题]]中产生一个这样的结构,从你的主题目录中的一个<tt style="font-weight:bold; color:#036">index.php</tt>模板文件开始。这个文件有两个主要的功能： | |||
* 包含或者 "访问"其它的模板文件 | |||
* 包含 [[Wordpress:The Loop|WordPress Loop]] 从数据库（文章，网页，类别，等等中)收集信息 | |||
For our simple structure, we only need to include two other template files: the '''header''' and the '''footer'''. These must be named <tt style="font-weight:bold; color:#036">header.php</tt> and <tt style="font-weight:bold; color:#036">footer.php</tt>. The [[Wordpress:Template Tags]] that include them look like this: | For our simple structure, we only need to include two other template files: the '''header''' and the '''footer'''. These must be named <tt style="font-weight:bold; color:#036">header.php</tt> and <tt style="font-weight:bold; color:#036">footer.php</tt>. The [[Wordpress:Template Tags]] that include them look like this: | ||
| 第45行： | 第81行： | ||
<?php get_footer(); ?></pre> | <?php get_footer(); ?></pre> | ||
对于简单的结构，我们只要包括两个其它的模板文件： '''标题''' 和 '''页脚'''。这些必须命名为<tt style="font-weight:bold; color:#036">header.php</tt> and <tt style="font-weight:bold; color:#036">footer.php</tt>. [[Wordpress:Template Tags|模板标签]] 包含了它们，使它们看起来像: | |||
<pre><?php get_header(); ?> | |||
<?php get_footer(); ?></pre> | |||
In order to display the posts and pages of your blog (and to customize how they are being displayed), your <tt style="font-weight:bold; color:#036">index.php</tt> file should run the [[Wordpress:The Loop|WordPress Loop]] between the header and footer calls. | In order to display the posts and pages of your blog (and to customize how they are being displayed), your <tt style="font-weight:bold; color:#036">index.php</tt> file should run the [[Wordpress:The Loop|WordPress Loop]] between the header and footer calls. | ||
为了显示你的博客的文章和网页（并且自定义它们显示的方式），你的<tt style="font-weight:bold; color:#036">index.php</tt>文件应该在标题和页脚命令之间运行[[Wordpress:The Loop|WordPress Loop]]。 | |||
== More Complex Page Structures == | == More Complex Page Structures == | ||
== 更多复杂的网页结构 == | |||
<div style="margin:5px;float:right"> | <div style="margin:5px;float:right"> | ||
| 第65行： | 第114行： | ||
</div> | </div> | ||
</div> | </div> | ||
<div style="margin:5px;float:right"> | |||
<div style="background:white; border:2px blue solid;margin:5px; font-size: 130%; text-align: center; padding-top:10px; width:120px; height:50px"> | |||
标题 | |||
</div> | |||
<div style="background:white; border:2px red solid;margin:5px; padding-top:10px; font-size: 130%; text-align: center; width:120px; height:50px"> | |||
Content | |||
</div> | |||
<div style="background:white; border:2px green solid;margin:5px; padding-top:10px; font-size: 130%; text-align: center; width:120px; height:50px"> | |||
工具条 | |||
</div> | |||
<div style="background:white; border:2px purple solid;margin:5px; padding-top:10px; font-size: 130%; text-align: center; width:120px; height:50px"> | |||
页脚 | |||
</div> | |||
</div> | |||
Many WordPress themes include one or several '''sidebars''' that contains [[Wordpress:Customizing Your Sidebar|navigation features]] and more information about your website. The sidebar is generated by a template file called <tt style="font-weight:bold; color:#036">sidebar.php</tt>. It can be included in your <tt style="font-weight:bold; color:#036">index.php</tt> template file with the following [[Wordpress:Template Tags|template tag]]: | Many WordPress themes include one or several '''sidebars''' that contains [[Wordpress:Customizing Your Sidebar|navigation features]] and more information about your website. The sidebar is generated by a template file called <tt style="font-weight:bold; color:#036">sidebar.php</tt>. It can be included in your <tt style="font-weight:bold; color:#036">index.php</tt> template file with the following [[Wordpress:Template Tags|template tag]]: | ||
<pre><?php get_sidebar(); ?></pre> | <pre><?php get_sidebar(); ?></pre> | ||
许多WordPress主题包含了一个或者几个的'''工具条'''，包含了[[Wordpress:Customizing Your Sidebar|导航功能]]和更多的关于你的站点的信息。工具框有一个叫做<tt style="font-weight:bold; color:#036">sidebar.php</tt>的模板文件产生的。它可以包含在你的<tt style="font-weight:bold; color:#036">index.php</tt>模板文件中，有下面的[[Wordpress:Template Tags|模板标签]]: | |||
<pre><?php get_sidebar(); ?></pre> | |||
=== Where's the Beef? === | === Where's the Beef? === | ||
=== Beef在哪儿? === | |||
Notice that we have not included a template tag to "get" ''the content'' of our web page. That is because the content is generated in the [[Wordpress:The Loop|WordPress Loop]], inside <tt style="font-weight:bold; color:#036">index.php</tt>. | Notice that we have not included a template tag to "get" ''the content'' of our web page. That is because the content is generated in the [[Wordpress:The Loop|WordPress Loop]], inside <tt style="font-weight:bold; color:#036">index.php</tt>. | ||
注意我们没有包括一个模板标签来"得到"我们的网页的''内容''。这是因为内容是在[[Wordpress:The Loop|WordPress Loop]]中产生的，在<tt style="font-weight:bold; color:#036">index.php</tt>里面。 | |||
Also note that the Theme's style sheet determines the look and placement of the header, footer, sidebar, and content in the user's browser screen. For more information on styling your WordPress Themes and web pages, see [[Wordpress:Blog Design and Layout]].... | Also note that the Theme's style sheet determines the look and placement of the header, footer, sidebar, and content in the user's browser screen. For more information on styling your WordPress Themes and web pages, see [[Wordpress:Blog Design and Layout]].... | ||
也注意主题的样式表决定了用户的浏览器界面的标题，页脚，工具条和内容的外观和设置。关于设计你的WordPress主题和网页的更多信息，请看[[Wordpress:Blog Design and Layout|博客设计和布局]].... | |||
== Template Files Within Template Files == | == Template Files Within Template Files == | ||
== 模板文件中的模板文件 == | |||
You have seen how WordPress includes standard template files (header, footer, and sidebar) within the <tt style="font-weight:bold; color:#036">index.php</tt> template file. You can also include other template files within any of your template files. | You have seen how WordPress includes standard template files (header, footer, and sidebar) within the <tt style="font-weight:bold; color:#036">index.php</tt> template file. You can also include other template files within any of your template files. | ||
你看到了WordPress怎样将标准的模板文件（标题，页脚，和工具条）包含在了the <tt style="font-weight:bold; color:#036">index.php</tt> 模板文件中。你也可以将其它的模板文件包含到任何你的模板文件中。 | |||
For example, <tt style="font-weight:bold; color:#036">sidebar.php</tt> might contain a template file that generates a search form — <tt style="font-weight:bold; color:#036">searchform.php</tt>. Because this is not one of WordPress's standard template files, the code to include it is a little different: | For example, <tt style="font-weight:bold; color:#036">sidebar.php</tt> might contain a template file that generates a search form — <tt style="font-weight:bold; color:#036">searchform.php</tt>. Because this is not one of WordPress's standard template files, the code to include it is a little different: | ||
<pre><?php include (TEMPLATEPATH . '/searchform.php'); ?></pre> | <pre><?php include (TEMPLATEPATH . '/searchform.php'); ?></pre> | ||
例如，<tt style="font-weight:bold; color:#036">sidebar.php</tt>也许包含一个模板文件，这个文件产生一个搜索形式— <tt style="font-weight:bold; color:#036">searchform.php</tt>.因为这不是WordPress标准的模板文件之一，包含它的代码可能有所不同： | |||
<pre><?php include (TEMPLATEPATH . '/searchform.php'); ?></pre> | |||
Instead of using a WordPress template tag to include the file, we'll use the [http://us3.php.net/manual/en/function.include.php PHP command <tt style="font-weight:bold; color:#036">include</tt>], which needs to know where the file is located (<tt style="font-weight:bold; color:#036">TEMPLATEPATH</tt> is a special variable within WordPress that points to the theme's template file directory). | Instead of using a WordPress template tag to include the file, we'll use the [http://us3.php.net/manual/en/function.include.php PHP command <tt style="font-weight:bold; color:#036">include</tt>], which needs to know where the file is located (<tt style="font-weight:bold; color:#036">TEMPLATEPATH</tt> is a special variable within WordPress that points to the theme's template file directory). | ||
我们不是使用一个WordPress模板标题来包含文件，我们使用[http://us3.php.net/manual/en/function.include.php PHP 命令<tt style="font-weight:bold; color:#036">include</tt>],这就需要知道文件的位置(<tt style="font-weight:bold; color:#036">TEMPLATEPATH</tt>是WordPress中一个特别的变数，指向主题的模板文件目录)。 | |||
<div style="margin:5px; float:right"> | <div style="margin:5px; float:right"> | ||
| 第106行： | 第203行： | ||
</div> | </div> | ||
</div> | </div> | ||
<div style="margin:5px; float:right"> | |||
<div style="background:white; border:2px blue solid;margin:5px; font-size: 130%; text-align: center; padding-top:10px; width:120px; height:50px"> | |||
标题 | |||
</div> | |||
<div style="background:white; border:2px red solid;margin:5px; padding-top:10px; font-size: 130%; text-align: center; width:120px; height:50px"> | |||
内容 | |||
</div> | |||
<div style="background:white; border:2px #FF9900 solid;margin:5px; font-size: 130%; text-align: center; width:120px; height:80px"> | |||
评论形式 | |||
</div> | |||
<div style="background:white; border:2px green solid;margin:5px; padding-top:10px; font-size: 130%; text-align: center; width:120px; height:50px"> | |||
工具条 | |||
</div> | |||
<div style="background:white; border:2px #FF148A solid;margin:5px; padding-top:10px; font-size: 130%; text-align: center; width:120px; height:50px"> | |||
搜索形式 | |||
</div> | |||
<div style="background:white; border:2px solid purple;margin:5px; font-size: 130%; text-align: center; width:120px; height:50px"> | |||
页脚 | |||
</div> | |||
</div> | |||
Most WordPress Themes include a variety of template files within other templates to generate the web pages on the site. The following template files are typical for the main template (<tt style="font-weight:bold; color:#036">index.php</tt>) of a WordPress site: | Most WordPress Themes include a variety of template files within other templates to generate the web pages on the site. The following template files are typical for the main template (<tt style="font-weight:bold; color:#036">index.php</tt>) of a WordPress site: | ||
大多数WordPress主题在其它的模板中包含许多的模板文件,在站点上产生网页。下面的模板文件是一个WordPress站点的主模板的典型： | |||
* <tt style="font-weight:bold; color:#036">header.php</tt> | |||
** <tt style="font-weight:bold; color:#036">theloop.php</tt> (The Content) | |||
** <tt style="font-weight:bold; color:#036">wp-comments.php</tt> | |||
* <tt style="font-weight:bold; color:#036">sidebar.php</tt> | |||
** <tt style="font-weight:bold; color:#036">searchform.php</tt> | |||
* <tt style="font-weight:bold; color:#036">footer.php</tt> | |||
* <tt style="font-weight:bold; color:#036">header.php</tt> | * <tt style="font-weight:bold; color:#036">header.php</tt> | ||
| 第115行： | 第252行： | ||
** <tt style="font-weight:bold; color:#036">searchform.php</tt> | ** <tt style="font-weight:bold; color:#036">searchform.php</tt> | ||
* <tt style="font-weight:bold; color:#036">footer.php</tt> | * <tt style="font-weight:bold; color:#036">footer.php</tt> | ||
However, this structure can be changed. For instance, you could put the search form in your header. Perhaps your design does not need a footer, so you could leave that template out entirely. | However, this structure can be changed. For instance, you could put the search form in your header. Perhaps your design does not need a footer, so you could leave that template out entirely. | ||
然而，这个结构是可以更改的。例如，你可以将搜索形式放到你的标题上。也许你的设计不需要一个页脚，那么你就可以完全地不管那个模板。 | |||
== Special Template Files == | |||
== 特殊的模板文件 == | |||
WordPress features two '''core page views''' of web pages in a WordPress site. The '''single post view''' is used when the web pages displays a single post. The '''multi-post view''' lists multiple posts or post summaries, and applies to category archives, date archives, author archives, and (usually) the "normal" view of your blog's home page. You can use the <tt style="font-weight:bold; color:#036">index.php</tt> template file to generate all of these types of pages or rely on WordPress' [[Wordpress:Template Hierarchy|template hierarchy]] to choose different template files depending on the situation. | WordPress features two '''core page views''' of web pages in a WordPress site. The '''single post view''' is used when the web pages displays a single post. The '''multi-post view''' lists multiple posts or post summaries, and applies to category archives, date archives, author archives, and (usually) the "normal" view of your blog's home page. You can use the <tt style="font-weight:bold; color:#036">index.php</tt> template file to generate all of these types of pages or rely on WordPress' [[Wordpress:Template Hierarchy|template hierarchy]] to choose different template files depending on the situation. | ||
WordPress在WordPress站点的网页上拥有两个'''核心页面浏览'''。当网页只显示一篇文章时，可以使用'''唯一的文章浏览'''。'''多篇文章浏览'''列出了多篇文章或者文章摘要，并且应用到类别归档，日期归档，作者归档，（通常是）你的博客主页的"一般的"浏览。你可以使用<tt style="font-weight:bold; color:#036">index.php</tt>模板文件来产生所有的这些形式的网页，或者依赖WordPress的[[Wordpress:Template Hierarchy|模板层次]]，根据不同的情况，选择不同的模板文件。 | |||
The WordPress Template Hierarchy answers the following question: | The WordPress Template Hierarchy answers the following question: | ||
| 第127行： | 第270行： | ||
''What template file will WordPress use when a certain type of page is displayed?'' | ''What template file will WordPress use when a certain type of page is displayed?'' | ||
</blockquote> | </blockquote> | ||
WordPress模板层级回答了以下的问题： | |||
<blockquote> | |||
''当正在显示一个特别形式的网页的时候，WordPress会使用什么模板文件？ '' | |||
</blockquote> | |||
WordPress automatically recognizes template files with certain standard names and uses them for certain types of web pages. For example, when a user clicks on the title of a blog post, WordPress knows that they want to view just that article on its own web page. The WordPress [[Wordpress:Template Hierarchy|template hierarchy]] will use the <tt style="font-weight:bold; color:#036">single.php</tt> template file rather than <tt style="font-weight:bold; color:#036">index.php</tt> to generate the page — if your Theme has a <tt style="font-weight:bold; color:#036">single.php</tt> file. Similarly, if the user clicks on a link for a particular category, WordPress will use the <tt style="font-weight:bold; color:#036">category.php</tt> template if it exists; if it doesn't, it looks for <tt style="font-weight:bold; color:#036">archive.php</tt>, and if that template is also missing, WordPress will go ahead and use the main <tt style="font-weight:bold; color:#036">index.php</tt> template. You can even make special template files for specific categories (see [[Wordpress:Category Templates]] for more information). | WordPress automatically recognizes template files with certain standard names and uses them for certain types of web pages. For example, when a user clicks on the title of a blog post, WordPress knows that they want to view just that article on its own web page. The WordPress [[Wordpress:Template Hierarchy|template hierarchy]] will use the <tt style="font-weight:bold; color:#036">single.php</tt> template file rather than <tt style="font-weight:bold; color:#036">index.php</tt> to generate the page — if your Theme has a <tt style="font-weight:bold; color:#036">single.php</tt> file. Similarly, if the user clicks on a link for a particular category, WordPress will use the <tt style="font-weight:bold; color:#036">category.php</tt> template if it exists; if it doesn't, it looks for <tt style="font-weight:bold; color:#036">archive.php</tt>, and if that template is also missing, WordPress will go ahead and use the main <tt style="font-weight:bold; color:#036">index.php</tt> template. You can even make special template files for specific categories (see [[Wordpress:Category Templates]] for more information). | ||
WordPress 能自动地识别带有标准名称的模板文件并将它们用于一些特别形式的网页。例如，当一个用户点击到一个博客文章的标题，WordPress知道他们只想看看它的网页内的一篇文章。 | |||
WordPress [[Wordpress:Template Hierarchy|模板层级]]会使用 <tt style="font-weight:bold; color:#036">single.php</tt> 模板文件而不是 <tt style="font-weight:bold; color:#036">index.php</tt>来产生网页 —如果你的主题有一个 <tt style="font-weight:bold; color:#036">single.php</tt> 文件。同样地，如果一个用户点击一个特别类别的链接， WordPress 会使用 <tt style="font-weight:bold; color:#036">category.php</tt> 模板，如果这个模板存在的话；如果这个模板不存在，它会寻找 <tt style="font-weight:bold; color:#036">archive.php</tt>, 如果这个模板也不存在， WordPress 会继续向前使用主要的 <tt style="font-weight:bold; color:#036">index.php</tt> 模板。你甚至可以为特别的种类使用特别的模板文件(看看[[Wordpress:Category Templates|类别模板]]得到更多的信息)。 | |||
== Template File Tips == | == Template File Tips == | ||
== 模板文件小贴士 == | |||
Here are some tips for creating WordPress template files: | Here are some tips for creating WordPress template files: | ||
下面是一些关于创建WordPress模板文件的一些贴士： | |||
;'''Tracking Opening and Closing Tags''' | ;'''Tracking Opening and Closing Tags''' | ||
;'''追踪打开的和关闭的标签''' | |||
: Template files include the use of [[Wordpress:Glossary#XHTML|XHTML]] tags and [[Wordpress:Glossary#CSS|CSS]] references. HTML elements and CSS references can cross template files, beginning in one and ending in another. For example, the <tt style="font-weight:bold; color:#036">html</tt> and <tt style="font-weight:bold; color:#036">body</tt> HTML elements typically begin in <tt style="font-weight:bold; color:#036">header.php</tt> and end in <tt style="font-weight:bold; color:#036">footer.php</tt>. Most WordPress themes make use of HTML <tt style="font-weight:bold; color:#036">div</tt> elements, which can also span several files. For instance, the main <tt style="font-weight:bold; color:#036">div</tt> for the page content might start in <tt style="font-weight:bold; color:#036">header.php</tt> and end in either <tt style="font-weight:bold; color:#036">index.php</tt> or <tt style="font-weight:bold; color:#036">single.php</tt>. Tracking down where an HTML element begins and ends can get complicated if you are [[Wordpress:Theme Development|developing, designing, or modifying a Theme]]. Use [[Wordpress:Commenting Code|comments]] to note in the template files where a large container tag opens and where it closes so you can track which <tt style="font-weight:bold; color:#036">div</tt> is which at the end of different sections. | : Template files include the use of [[Wordpress:Glossary#XHTML|XHTML]] tags and [[Wordpress:Glossary#CSS|CSS]] references. HTML elements and CSS references can cross template files, beginning in one and ending in another. For example, the <tt style="font-weight:bold; color:#036">html</tt> and <tt style="font-weight:bold; color:#036">body</tt> HTML elements typically begin in <tt style="font-weight:bold; color:#036">header.php</tt> and end in <tt style="font-weight:bold; color:#036">footer.php</tt>. Most WordPress themes make use of HTML <tt style="font-weight:bold; color:#036">div</tt> elements, which can also span several files. For instance, the main <tt style="font-weight:bold; color:#036">div</tt> for the page content might start in <tt style="font-weight:bold; color:#036">header.php</tt> and end in either <tt style="font-weight:bold; color:#036">index.php</tt> or <tt style="font-weight:bold; color:#036">single.php</tt>. Tracking down where an HTML element begins and ends can get complicated if you are [[Wordpress:Theme Development|developing, designing, or modifying a Theme]]. Use [[Wordpress:Commenting Code|comments]] to note in the template files where a large container tag opens and where it closes so you can track which <tt style="font-weight:bold; color:#036">div</tt> is which at the end of different sections. | ||
: 模板文件包括使用 [[Wordpress:Glossary#XHTML|XHTML]] 标签和 [[Wordpress:Glossary#CSS|CSS]] 参考资料。 HTML 要素和CSS 参考资料可以穿过模板文件，在一个中开始，在另一个中结束。 例如， <tt style="font-weight:bold; color:#036">html</tt> 和<tt style="font-weight:bold; color:#036">body</tt> HTML 要素通常以<tt style="font-weight:bold; color:#036">header.php</tt> 开始并且以<tt style="font-weight:bold; color:#036">footer.php</tt>结束。大多数WordPress 主题利用了 HTML <tt style="font-weight:bold; color:#036">div</tt> 要素, 它也可以跨越几个文件。例如，主要的<tt style="font-weight:bold; color:#036">div</tt> 关于的页面内容可能以<tt style="font-weight:bold; color:#036">header.php</tt> 开始，并且以<tt style="font-weight:bold; color:#036">index.php</tt> 或者 <tt style="font-weight:bold; color:#036">single.php</tt>结束。如果你 [[Wordpress:Theme Development|发展，设计或者修改一个主题]]追溯到一个HTML成份开始和结束的位置会变得复杂。 使用[[Wordpress:Commenting Code|评论] 在模板文件中记录，一个大的container标签打开并且关闭，这样你可以追踪哪个 <tt style="font-weight:bold; color:#036">div</tt>是不同部分的最后中的哪一个 | |||
;'''Test Template Files Under Different Views''' | ;'''Test Template Files Under Different Views''' | ||
;'''在不同的浏览下的测试模板文件''' | |||
:If you have made changes to the comments, sidebar, search form, or any other template file, make sure you test them using different web page views (single post, different types of archives, and pages). | :If you have made changes to the comments, sidebar, search form, or any other template file, make sure you test them using different web page views (single post, different types of archives, and pages). | ||
：如果你对评论，工具条，搜索形式，或者任何其它的模板文件做了更改，要确保你使用了不同的网页浏览将它们测试了（单独的文章，不同形式的归档和网页）。 | |||
;'''Comment Deviations''' | ;'''Comment Deviations''' | ||
;'''评论偏差''' | |||
:If you are [[Wordpress:Designing Themes for Public Release|designing Themes for public release]], keep in mind that someone who downloads your Theme will probably want to modify it slightly for their own use. So, it is helpful if you make notes in your template files where you have made changes from the logic of the Default and/or Classic Themes. It is also a good idea to add comments in your Theme's main style file if you have style information elsewhere (such as in your <tt style="font-weight:bold; color:#036">header.php</tt> file or in HTML tags). | :If you are [[Wordpress:Designing Themes for Public Release|designing Themes for public release]], keep in mind that someone who downloads your Theme will probably want to modify it slightly for their own use. So, it is helpful if you make notes in your template files where you have made changes from the logic of the Default and/or Classic Themes. It is also a good idea to add comments in your Theme's main style file if you have style information elsewhere (such as in your <tt style="font-weight:bold; color:#036">header.php</tt> file or in HTML tags). | ||
：如果你正[[Wordpress:Designing Themes for Public Release|设计主题以公开发行]],牢记有的人下载你的主题，可能想将主题稍微改一下以供他们自己使用。如果你在模板文件上，在你从默认的和/或者经典的主题的逻辑上做了更该的地方，做上笔记，这是很有用的。如果你在其它的地方有样式信息(例如在你的 <tt style="font-weight:bold; color:#036">header.php</tt> 文件或者在HTML标签上)，在你的主题的主要样式文件上添加评论，也是一个好注意。 | |||
;'''Close the Tag Door Behind You''' | ;'''Close the Tag Door Behind You''' | ||
;'''关闭你后面的标签通道''' | |||
:If you start a HTML tag or <tt style="font-weight:bold; color:#036">div</tt> in one template file, make sure you include the closing tag in another template file. The WordPress Forum gets a lot of questions about "what happened to my theme" when they remove the footer template file without closing the tags that began in the header template file. Track down your tags and make sure they are closed. (A good way to verify that this is correct is to test your single and archive page views with an [http://validator.w3c.org HTML validator]). | :If you start a HTML tag or <tt style="font-weight:bold; color:#036">div</tt> in one template file, make sure you include the closing tag in another template file. The WordPress Forum gets a lot of questions about "what happened to my theme" when they remove the footer template file without closing the tags that began in the header template file. Track down your tags and make sure they are closed. (A good way to verify that this is correct is to test your single and archive page views with an [http://validator.w3c.org HTML validator]). | ||
如果你在一个模板文件中启动了一个HTML标签或者 <tt style="font-weight:bold; color:#036">div</tt> ，确保你在另一个模板文件中包含了关闭标签。WordPress论坛得到了许多关于"我的主题怎么了"的问题，当他们移动了脚页模板文件却没有关闭标题模板文件前面的标签时。返回到你的标签，确定它们已经关闭了。（一个证实这个是正确的好方法，就是用一个[http://validator.w3c.org HTML validator]来测试你的单独的和归档的页面浏览。 | |||
;'''CSS Styles in Templates''' | ;'''CSS Styles in Templates''' | ||
;'''模板中的CSS 样式''' | |||
:You are free to use whatever HTML and CSS tags and styles you like in your templates. However, you are encouraged to follow the standard WordPress theme structure (see [[Wordpress:Site Architecture 1.5]]). This will make your Themes more understandable to your users. | :You are free to use whatever HTML and CSS tags and styles you like in your templates. However, you are encouraged to follow the standard WordPress theme structure (see [[Wordpress:Site Architecture 1.5]]). This will make your Themes more understandable to your users. | ||
：你可以在你的模板中使用任何你喜欢的HTML和CSS标签。然而，鼓励你遵循标准的WordPress主题结构（看看[[Wordpress:Site Architecture 1.5|站点体系结构 1.5]]）。这可以使你的用户更加地了解你的主题。 | |||
== Template File Resources == | == Template File Resources == | ||
== 模板文件资源 == | |||
For a comprehensive list of resources related to Template Files, see [[Wordpress:Templates]]. You may also wish to view the other articles in [[Wordpress::Category:Templates]] and [[Wordpress::Category:Template Tags]]. | For a comprehensive list of resources related to Template Files, see [[Wordpress:Templates]]. You may also wish to view the other articles in [[Wordpress::Category:Templates]] and [[Wordpress::Category:Template Tags]]. | ||
关于模板文件资源的全面列表，看看[[Wordpress:Templates|模板]]。你也许也想在[[Wordpress::Category:Templates]] and [[Wordpress::Category:Templates |类别：模板]]和[[Wordpress::Category:Template Tags|类别：模板标签]]中查看更多的文章。 | |||
2008年4月7日 (一) 13:21的版本
Template files are the building blocks of your WordPress site. They fit together like the pieces of a puzzle to generate the web pages on your site. Some templates (the header and footer template files for example) are used on all the web pages, while others are used only under specific conditions.
模板文件是你的WordPress站点的积木。它们就像一个个迷一样地组合在一起，在你的站点上制作出网页。一些模板（例如标题和页脚模板文件）能在所有的网页上使用，然而其它的模板文件只能在一些特别情况下才能使用。
A traditional web page consists of two files: 一个传统的网页包括两个文件：
- The XHTML page to hold the structure and content of the page and
- the CSS Style Sheet which holds the presentation styles of the page.
In WordPress, the (X)HTML structure and the CSS style sheet are present but the content is generated "behind the scenes" by various template files. The template files and the style sheet are stored together as a WordPress Theme. To learn more about creating Themes, read Wordpress:Theme Development. 在WordPress中，(X)HTML和CSS样式表是显示的，但是内容是通过不同的模板文件 "在后台"产生的。模板文件和样式表作为一个WordPress 主题被保存在一起。学习更多的关于创建主题的内容，阅读主题发展。
The WordPress Page Structure
WordPress 网页结构
A simple WordPress web page structure is made up of three basic building "blocks": a header, the content, and a footer. Each of these blocks is generated by a template file in your current WordPress Theme. 一个简单的WordPress网页结构由三个基本的"积木"组成:标题，内容和页脚。每一块都由当前WordPress中的一个模板文件产生。
Header
Content
Footer
Header
Content
Footer
- The header contains all the information that needs to be at the top — i.e. inside the <head> tag — of your XHTML web page, such as the <doctype>, <meta> tags and links to style sheets. It also includes the opening <body> tag and the visible header of your blog (which typically includes the title of your site, and may also include navigation menus, a logo bar, the description of your site, etc.).
- 标题包含了所有应该在上面的信息— 例如在<head> tag &mdash里面; 在你的 XHTML网页, 例如 <doctype>, <meta> 样式表的标签和链接. 它也包括打开的 <body> 标签和可见到的你的博客的标题 (通常包括你的站点的标题，导航菜单，标示语条，以及对你的站点的描述，等等。).
- The content block contains the posts and pages of your blog, i.e. the "meat" of your site.
- 内容块包括了你的博客的文章和网页，例如你的站点的"肉类"
- The footer contains the information that goes at the bottom of your page, such as links to other Wordpress:Pages or categories on your site in a navigation menu, copyright and contact information, and other details.
Basic Template Files
基本的模板文件
To generate such a structure within a WordPress Theme, start with an index.php template file in your Theme's directory. This file has two main functions:
- Include or "call" the other template files
- Include the WordPress Loop to gather information from the database (posts, pages, categories, etc.)
在WordPress 主题中产生一个这样的结构,从你的主题目录中的一个index.php模板文件开始。这个文件有两个主要的功能：
- 包含或者 "访问"其它的模板文件
- 包含 WordPress Loop 从数据库（文章，网页，类别，等等中)收集信息
For our simple structure, we only need to include two other template files: the header and the footer. These must be named header.php and footer.php. The Wordpress:Template Tags that include them look like this:
<?php get_header(); ?> <?php get_footer(); ?>
对于简单的结构，我们只要包括两个其它的模板文件： 标题 和 页脚。这些必须命名为header.php and footer.php. 模板标签 包含了它们，使它们看起来像:
<?php get_header(); ?> <?php get_footer(); ?>
In order to display the posts and pages of your blog (and to customize how they are being displayed), your index.php file should run the WordPress Loop between the header and footer calls.
为了显示你的博客的文章和网页（并且自定义它们显示的方式），你的index.php文件应该在标题和页脚命令之间运行WordPress Loop。
More Complex Page Structures
更多复杂的网页结构
Header
Content
Sidebar
Footer
标题
Content
工具条
页脚
Many WordPress themes include one or several sidebars that contains navigation features and more information about your website. The sidebar is generated by a template file called sidebar.php. It can be included in your index.php template file with the following template tag:
<?php get_sidebar(); ?>
许多WordPress主题包含了一个或者几个的工具条，包含了导航功能和更多的关于你的站点的信息。工具框有一个叫做sidebar.php的模板文件产生的。它可以包含在你的index.php模板文件中，有下面的模板标签:
<?php get_sidebar(); ?>
Where's the Beef?
Beef在哪儿?
Notice that we have not included a template tag to "get" the content of our web page. That is because the content is generated in the WordPress Loop, inside index.php.
注意我们没有包括一个模板标签来"得到"我们的网页的内容。这是因为内容是在WordPress Loop中产生的，在index.php里面。
Also note that the Theme's style sheet determines the look and placement of the header, footer, sidebar, and content in the user's browser screen. For more information on styling your WordPress Themes and web pages, see Wordpress:Blog Design and Layout....
也注意主题的样式表决定了用户的浏览器界面的标题，页脚，工具条和内容的外观和设置。关于设计你的WordPress主题和网页的更多信息，请看博客设计和布局....
Template Files Within Template Files
模板文件中的模板文件
You have seen how WordPress includes standard template files (header, footer, and sidebar) within the index.php template file. You can also include other template files within any of your template files.
你看到了WordPress怎样将标准的模板文件（标题，页脚，和工具条）包含在了the index.php 模板文件中。你也可以将其它的模板文件包含到任何你的模板文件中。
For example, sidebar.php might contain a template file that generates a search form — searchform.php. Because this is not one of WordPress's standard template files, the code to include it is a little different:
<?php include (TEMPLATEPATH . '/searchform.php'); ?>
例如，sidebar.php也许包含一个模板文件，这个文件产生一个搜索形式— searchform.php.因为这不是WordPress标准的模板文件之一，包含它的代码可能有所不同：
<?php include (TEMPLATEPATH . '/searchform.php'); ?>
Instead of using a WordPress template tag to include the file, we'll use the PHP command include, which needs to know where the file is located (TEMPLATEPATH is a special variable within WordPress that points to the theme's template file directory).
我们不是使用一个WordPress模板标题来包含文件，我们使用PHP 命令include,这就需要知道文件的位置(TEMPLATEPATH是WordPress中一个特别的变数，指向主题的模板文件目录)。
Header
Content
Comment Form
Sidebar
Search Form
Footer
标题
内容
评论形式
工具条
搜索形式
页脚
Most WordPress Themes include a variety of template files within other templates to generate the web pages on the site. The following template files are typical for the main template (index.php) of a WordPress site:
大多数WordPress主题在其它的模板中包含许多的模板文件,在站点上产生网页。下面的模板文件是一个WordPress站点的主模板的典型：
- header.php
- theloop.php (The Content)
- wp-comments.php
- sidebar.php
- searchform.php
- footer.php
- header.php
- theloop.php (The Content)
- wp-comments.php
- sidebar.php
- searchform.php
- footer.php
However, this structure can be changed. For instance, you could put the search form in your header. Perhaps your design does not need a footer, so you could leave that template out entirely. 然而，这个结构是可以更改的。例如，你可以将搜索形式放到你的标题上。也许你的设计不需要一个页脚，那么你就可以完全地不管那个模板。
Special Template Files
特殊的模板文件
WordPress features two core page views of web pages in a WordPress site. The single post view is used when the web pages displays a single post. The multi-post view lists multiple posts or post summaries, and applies to category archives, date archives, author archives, and (usually) the "normal" view of your blog's home page. You can use the index.php template file to generate all of these types of pages or rely on WordPress' template hierarchy to choose different template files depending on the situation.
WordPress在WordPress站点的网页上拥有两个核心页面浏览。当网页只显示一篇文章时，可以使用唯一的文章浏览。多篇文章浏览列出了多篇文章或者文章摘要，并且应用到类别归档，日期归档，作者归档，（通常是）你的博客主页的"一般的"浏览。你可以使用index.php模板文件来产生所有的这些形式的网页，或者依赖WordPress的模板层次，根据不同的情况，选择不同的模板文件。
The WordPress Template Hierarchy answers the following question:
What template file will WordPress use when a certain type of page is displayed?
WordPress模板层级回答了以下的问题：
当正在显示一个特别形式的网页的时候，WordPress会使用什么模板文件？
WordPress automatically recognizes template files with certain standard names and uses them for certain types of web pages. For example, when a user clicks on the title of a blog post, WordPress knows that they want to view just that article on its own web page. The WordPress template hierarchy will use the single.php template file rather than index.php to generate the page — if your Theme has a single.php file. Similarly, if the user clicks on a link for a particular category, WordPress will use the category.php template if it exists; if it doesn't, it looks for archive.php, and if that template is also missing, WordPress will go ahead and use the main index.php template. You can even make special template files for specific categories (see Wordpress:Category Templates for more information).
WordPress 能自动地识别带有标准名称的模板文件并将它们用于一些特别形式的网页。例如，当一个用户点击到一个博客文章的标题，WordPress知道他们只想看看它的网页内的一篇文章。 WordPress 模板层级会使用 single.php 模板文件而不是 index.php来产生网页 —如果你的主题有一个 single.php 文件。同样地，如果一个用户点击一个特别类别的链接， WordPress 会使用 category.php 模板，如果这个模板存在的话；如果这个模板不存在，它会寻找 archive.php, 如果这个模板也不存在， WordPress 会继续向前使用主要的 index.php 模板。你甚至可以为特别的种类使用特别的模板文件(看看类别模板得到更多的信息)。
Template File Tips
模板文件小贴士
Here are some tips for creating WordPress template files: 下面是一些关于创建WordPress模板文件的一些贴士：
- Tracking Opening and Closing Tags
- 追踪打开的和关闭的标签
- Template files include the use of XHTML tags and CSS references. HTML elements and CSS references can cross template files, beginning in one and ending in another. For example, the html and body HTML elements typically begin in header.php and end in footer.php. Most WordPress themes make use of HTML div elements, which can also span several files. For instance, the main div for the page content might start in header.php and end in either index.php or single.php. Tracking down where an HTML element begins and ends can get complicated if you are developing, designing, or modifying a Theme. Use comments to note in the template files where a large container tag opens and where it closes so you can track which div is which at the end of different sections.
- 模板文件包括使用 XHTML 标签和 CSS 参考资料。 HTML 要素和CSS 参考资料可以穿过模板文件，在一个中开始，在另一个中结束。 例如， html 和body HTML 要素通常以header.php 开始并且以footer.php结束。大多数WordPress 主题利用了 HTML div 要素, 它也可以跨越几个文件。例如，主要的div 关于的页面内容可能以header.php 开始，并且以index.php 或者 single.php结束。如果你 发展，设计或者修改一个主题追溯到一个HTML成份开始和结束的位置会变得复杂。 使用[[Wordpress:Commenting Code|评论] 在模板文件中记录，一个大的container标签打开并且关闭，这样你可以追踪哪个 div是不同部分的最后中的哪一个
- Test Template Files Under Different Views
- 在不同的浏览下的测试模板文件
- If you have made changes to the comments, sidebar, search form, or any other template file, make sure you test them using different web page views (single post, different types of archives, and pages).
：如果你对评论，工具条，搜索形式，或者任何其它的模板文件做了更改，要确保你使用了不同的网页浏览将它们测试了（单独的文章，不同形式的归档和网页）。
- Comment Deviations
- 评论偏差
- If you are designing Themes for public release, keep in mind that someone who downloads your Theme will probably want to modify it slightly for their own use. So, it is helpful if you make notes in your template files where you have made changes from the logic of the Default and/or Classic Themes. It is also a good idea to add comments in your Theme's main style file if you have style information elsewhere (such as in your header.php file or in HTML tags).
：如果你正设计主题以公开发行,牢记有的人下载你的主题，可能想将主题稍微改一下以供他们自己使用。如果你在模板文件上，在你从默认的和/或者经典的主题的逻辑上做了更该的地方，做上笔记，这是很有用的。如果你在其它的地方有样式信息(例如在你的 header.php 文件或者在HTML标签上)，在你的主题的主要样式文件上添加评论，也是一个好注意。
- Close the Tag Door Behind You
- 关闭你后面的标签通道
- If you start a HTML tag or div in one template file, make sure you include the closing tag in another template file. The WordPress Forum gets a lot of questions about "what happened to my theme" when they remove the footer template file without closing the tags that began in the header template file. Track down your tags and make sure they are closed. (A good way to verify that this is correct is to test your single and archive page views with an HTML validator).
如果你在一个模板文件中启动了一个HTML标签或者 div ，确保你在另一个模板文件中包含了关闭标签。WordPress论坛得到了许多关于"我的主题怎么了"的问题，当他们移动了脚页模板文件却没有关闭标题模板文件前面的标签时。返回到你的标签，确定它们已经关闭了。（一个证实这个是正确的好方法，就是用一个HTML validator来测试你的单独的和归档的页面浏览。
- CSS Styles in Templates
- 模板中的CSS 样式
- You are free to use whatever HTML and CSS tags and styles you like in your templates. However, you are encouraged to follow the standard WordPress theme structure (see Wordpress:Site Architecture 1.5). This will make your Themes more understandable to your users.
：你可以在你的模板中使用任何你喜欢的HTML和CSS标签。然而，鼓励你遵循标准的WordPress主题结构（看看站点体系结构 1.5）。这可以使你的用户更加地了解你的主题。
Template File Resources
模板文件资源
For a comprehensive list of resources related to Template Files, see Wordpress:Templates. You may also wish to view the other articles in [[Wordpress::Category:Templates]] and [[Wordpress::Category:Template Tags]].
关于模板文件资源的全面列表，看看模板。你也许也想在[[Wordpress::Category:Templates]] and [[Wordpress::Category:Templates |类别：模板]]和[[Wordpress::Category:Template Tags|类别：模板标签]]中查看更多的文章。