WordPress中文文檔：WordPress主題開(kāi)發(fā)

本文介紹如何開(kāi)發(fā)設(shè)計(jì)你自己的 WordPress 主題，所討論的是編寫(xiě)代碼去構(gòu)建你自己的主題的技術(shù)內(nèi)容。

為什么要使用 WordPress 主題

WordPress 主題由一系列文件和 CSS 樣式表構(gòu)成，構(gòu)成了一個(gè)美麗的 WordPress 網(wǎng)站。每個(gè)主題都是不同的， 這樣WordPress用戶就可以隨時(shí)更改 WordPress 網(wǎng)站的外觀。

你也許想為自己開(kāi)發(fā) WordPress 主題，或者制作公開(kāi)發(fā)行的的主題。但是除了這個(gè)為什么要自己制作主題呢?

• 創(chuàng)建自己獨(dú)特的 WordPress 主題外觀.
• 利用模板， 模板標(biāo)簽， 和 WordPress循環(huán) 來(lái)產(chǎn)生不同的效果.
• 為了產(chǎn)生不同的效果，比如在category pages頁(yè)面和搜索結(jié)果頁(yè)面產(chǎn)生個(gè)性的效果.
• 為了迅速?gòu)膬蓚€(gè)主題改變你的博客外觀，可以充分利用 Theme or style switcher 這個(gè)插件迅速改變外觀.
• 設(shè)計(jì) WordPress 主題，這樣大家就可以通過(guò)網(wǎng)絡(luò)更好的使用你的作品.

WordPress 主題有很多優(yōu)點(diǎn)

• WordPress 主題把CSS樣式表和 模板文件 從系統(tǒng)中獨(dú)立出來(lái)，所以這樣升級(jí)博客的時(shí)候就不會(huì)破壞你的主題樣式。
• 允許你自由的定制主題樣式。
• 允許你迅速改變主題。
• 你甚至都不需要學(xué)習(xí)HTML，CSS，PHP等，即可擁有一個(gè)美觀的主題。

為什么要自己制作主題呢？這才是問(wèn)題的關(guān)鍵.

• 這是一個(gè)學(xué)習(xí) CSS，HTML，和PHP的好機(jī)會(huì).
• 這是一個(gè)積累你的 CSS，HTML，PHP實(shí)踐經(jīng)驗(yàn)的的機(jī)會(huì).
• 制作主題的過(guò)程中充滿創(chuàng)造力.
• 這非常的有趣（大多數(shù)情況下）.
• 如果你 設(shè)計(jì)公共主題， 你會(huì)感覺(jué)非常好，因?yàn)槟銥?WordPress 社區(qū)做出了自己的貢獻(xiàn) (好吧，可以吹牛了～)

主題開(kāi)發(fā)標(biāo)準(zhǔn)

WordPress 主題應(yīng)該按照如下標(biāo)準(zhǔn)開(kāi)發(fā):

• 使用結(jié)構(gòu)化的、沒(méi)有錯(cuò)誤的PHP和有效的HTML代碼。請(qǐng)看 WordPress Coding Standards。
• 使用簡(jiǎn)潔的、有效的CSS。參見(jiàn) CSS Coding Standards。
• 遵循設(shè)計(jì)指南 Site Design and Layout。

主題的剖析

WordPress主題目錄位于 wp-content/themes/。主題的子目錄擁有所有樣式文件、模板文件、可選的函數(shù)文件 (functions.php)、JavaScript 文件、圖片等。比如說(shuō)一個(gè)叫做 "test" 的主題就會(huì)放在 wp-content/themes/test/目錄里。請(qǐng)避免使用數(shù)字名字，這會(huì)導(dǎo)致無(wú)法在主題列表中正常顯示出來(lái)。

WordPress每一個(gè)發(fā)行版都會(huì)有一個(gè)默認(rèn)的主題。請(qǐng)認(rèn)真查看默認(rèn)的主題，這樣可能會(huì)對(duì)制作你自己的主題有幫助。

WordPress 主題除了圖片和JavaScript，經(jīng)常由三種文件構(gòu)成。

1. 樣式表文件 style.css， 控制著頁(yè)面的外觀
2. 函數(shù)文件 (functions.php)。
3. 模板文件，它控制著從數(shù)據(jù)庫(kù)中調(diào)出的數(shù)據(jù)所呈現(xiàn)的外觀。

讓我們單獨(dú)看一下。

主題樣式表

CSS文件不僅列出了一些主題的樣式設(shè)計(jì)， style.css 必須 以注釋的形式列出主題的詳細(xì)信息 兩個(gè)不同的主題是不允許擁有相同的表述的 ， 因?yàn)檫@樣會(huì)導(dǎo)致主題選擇出錯(cuò)。如果你通過(guò)拷貝一個(gè)你已經(jīng)制作的主題來(lái)制作你新的主題，請(qǐng)確保先更改這些頭部注釋.

下面是樣式表頭部注釋的例子，被稱作樣式表頭注釋。比如主題叫做 "Twenty Ten":

/*
Theme Name: Twenty Ten
Theme URI: https://wordpress.org/
Description: The 2010 default theme for WordPress.
Author: wordpressdotorg
Author URI: https://wordpress.org/
Version: 1.0
Tags: black, blue, white, two-columns, fixed-width, custom-header, custom-background, threaded-comments, sticky-post, translation-ready, microformats, rtl-language-support, editor-style, custom-menu (optional)

License:
License URI:

General comments (optional).
*/

這些位于style.css里的文件是必須要寫(xiě)的，這是用來(lái)區(qū)分安裝的主題。

注意使用不同的標(biāo)簽來(lái)描述你的主題，如果你的主題提交到WordPress官方主題庫(kù)，這允許用戶使用標(biāo)記過(guò)濾器找到你的主題。下面是完整的允許的標(biāo)簽列表。

樣式表指南

• 當(dāng)創(chuàng)作你的CSS的時(shí)候請(qǐng)參考CSS 編碼標(biāo)準(zhǔn)
• 盡可能使用有效地 CSS。作為例外，也可以使用一些前綴，遵循CSS3標(biāo)準(zhǔn)。
• 盡量減少使用CSS hacks。明顯瀏覽器支持(如IE)是個(gè)例外，如果可能的話，將CSS hack文件區(qū)分開(kāi)來(lái)或者使用獨(dú)立的文件。
• 所有的 HTML 元素應(yīng)該有樣式聲明，無(wú)論是文章頁(yè)面還是評(píng)論部分。
  • Tables， captions， images， lists， block quotes，等等。
• 強(qiáng)烈建議添加打印友好的字體
  • 你能通過(guò)使用media="print"屬性來(lái)包含一個(gè)適用于打印的樣式表文件，或者在你的主樣式表文件中增加一部分專為打印提供的設(shè)置。

子主題

最簡(jiǎn)單的主題可能是子主題，其僅僅包含一個(gè)style.css文件，也可以加上一些圖片。之所以它能工作是因?yàn)樗且粤硪粋€(gè)主題為基礎(chǔ)進(jìn)行工作的。

更多關(guān)于子主題的信息，請(qǐng)看Child Themes。

函數(shù)文件

一個(gè)主題可以使用一個(gè)函數(shù)文件，位于主題的子目錄，叫做 functions.php。這個(gè)文件就像一個(gè)插件， 如果它位于你正在使用的主題里的話， 他在你的主題初始化的時(shí)候就會(huì)自動(dòng)加載(后臺(tái)和前臺(tái)都一樣加載)。對(duì)于這個(gè)文件的建議：

• 定義你的模板使用的函數(shù).
• 啟用縮略圖功能，如職位，自定義標(biāo)題和背景，和導(dǎo)航菜單.
• 設(shè)置一個(gè)選項(xiàng)菜單，讓網(wǎng)站擁有者可以自定義顏色，樣式，和你的主題的其他特性.

默認(rèn)的WordPress的主題包含一個(gè)functions.php文件，它定義這些功能很多，所以你可能會(huì)把它當(dāng)做參考.既然functions.php基本上可以作為一個(gè)插件，所以Function_Reference可以讓你更多的了解這個(gè)函數(shù)，以及你可以怎么利用這些函數(shù).

需要注意的是，如果你要在不同的主題使用同一個(gè)功能時(shí)，那么請(qǐng)將函數(shù)應(yīng)建立在一個(gè)插件上，而不是一個(gè)特定主題的functions.php。這樣一來(lái)，及時(shí)你更換主題，你還是可以通過(guò)這個(gè)插件實(shí)現(xiàn)你想要的功能。

模板文件

模板 是一些PHP文件，他可以輸出HTML代碼呈獻(xiàn)給瀏覽器，決定著主題的外觀。下面讓我們來(lái)看一下主題的模板。

WordPress允許為你的網(wǎng)站定義不同的模板。他雖然不是必需的，但是這些不同的模板為你的網(wǎng)站添上一筆。模板是根據(jù)模板層次（Template Hierarchy）的，由一個(gè)具體的主題決定。

作為一個(gè)主題開(kāi)發(fā)者，你可以自由決定如何定制你的模板。比如說(shuō)，極端情況下， 你甚至可以僅僅使用一個(gè)文件index.php作為模板文件，所有 頁(yè)面都會(huì)使用這個(gè)模板.更多的情況是，使用不同的模板文件產(chǎn)生不同的結(jié)果，以達(dá)到最大定制。

模板文件列表

這里是被WordPress確認(rèn)的主題文件列表.當(dāng)然，你的主題可以包含任何樣式表，圖像或者文件。記住 下面列出的文件對(duì)WordPress有特殊的意義——點(diǎn)擊模板層次（Template Hierarchy） 查看具體情況。

style.css

主樣式表，這個(gè)文件 必須 位于你的主題里面，而且必須在頭部注釋處寫(xiě)清楚你的主題的信息.

rtl.css

rtl 樣式表。如果網(wǎng)站的閱讀方向是自右向左的，他會(huì)自動(dòng)被包含進(jìn)來(lái)。你可以使用 the RTLer 插件來(lái)生成這個(gè)文件.

index.php

主模板.如果你的主題使用自己的模板，index.php 是必須要有的.

comments.php

評(píng)論模板.

front-page.php

首頁(yè)模板，僅用于開(kāi)啟 靜態(tài)首頁(yè) 時(shí)。

home.php

主頁(yè)模板，默認(rèn)的首頁(yè)。如果你開(kāi)啟了 靜態(tài)首頁(yè) 這是展現(xiàn)最新的文章的模板頁(yè)面。

single.php

單獨(dú)頁(yè)面模板。顯示單獨(dú)的一篇文章時(shí)被調(diào)用。對(duì)于這個(gè)以及其他的請(qǐng)求模板，如果模板不存在會(huì)使用 index.php。

single-<post-type>.php

自定義單獨(dú)頁(yè)面模板。例如， single-books.php 展示自定義文章類型為 books的文章. 如果文章類型未被設(shè)置則使用index.php。

page.php

頁(yè)面模板. 獨(dú)立頁(yè)面調(diào)用。

category.php

分類模板。 分類頁(yè)面調(diào)用。

tag.php

標(biāo)簽?zāi)０?/a>。標(biāo)簽頁(yè)面調(diào)用。

taxonomy.php

術(shù)語(yǔ)模板。請(qǐng)求自定義分類法的術(shù)語(yǔ)時(shí)使用。

author.php

作者模板。作者頁(yè)面調(diào)用。

date.php

日期/時(shí)間模板，按時(shí)間查詢時(shí)使用的模板。

archive.php

存檔模板。查詢分類，作者或日期時(shí)使用的模板。需要注意的是，該模板將會(huì)分別被category.php， author.php， date.php所覆蓋（如果存在的話）。

search.php

搜索結(jié)果模板，顯示搜索結(jié)果時(shí)使用的模板。

attachment.php

附件模板，查看單個(gè)附件時(shí)使用的模板。

image.php

圖片附件模板。當(dāng)在wordpress中查看單個(gè)圖片時(shí)將調(diào)用此模板，如果不存在此模板，則調(diào)用attachment.php 模板。

404.php

404 錯(cuò)誤頁(yè)面 模板。當(dāng)WordPress無(wú)法查找到匹配查詢的日志或頁(yè)面時(shí)，使用404.php文件。

按照Template Hierarchy，這些文件在 WordPress 中有特殊的意義，即當(dāng)對(duì)應(yīng)的 條件標(biāo)簽 返回 true 的時(shí)候，他們將在這種情況下代替index.php ，例如，如果當(dāng)前顯示的是單一的一篇博文，那么is_single() 這個(gè)函數(shù)將返回’true’，并且，如果有一個(gè)single.php文件存在于當(dāng)前主題中，該文件模板就將起作用.

基本模板

在最簡(jiǎn)單的情況下，一個(gè)WordPress主題由兩個(gè)文件構(gòu)成：

• style.css
• index.php

這些文件都位于主題目錄. 這index.php 模板 是非常靈活的.他可以用來(lái)包含所有的引用 header， sidebar， footer， content， categories， archives， search， error， 和其它在WordPress產(chǎn)生的文件.

或者，他也可以模塊化，使用單獨(dú)的文件分擔(dān)工作.如果你沒(méi)有提供其它的模板文件，WordPress 會(huì)使用默認(rèn)文件.比如說(shuō)，如果你沒(méi)有提供comments.php 文件， WordPress會(huì)自動(dòng)使用 wp-comments.php 模板文件 模板層次（Template Hierarchy）. （注：從 3.0 版本開(kāi)始，默認(rèn)的文件不能保證是現(xiàn)成的或者相同的。為了安全起見(jiàn)，請(qǐng)使用自己的模板文件。）

典型的模板文件包括：

• comments.php
• comments-popup.php
• footer.php
• header.php
• sidebar.php

使用這些模板文件，你可以把這些文件嵌入到index.php 中，最后生成的文件里.

• 包含header， 使用get_header().
• 包含sidebar， 使用 get_sidebar().
• 包含 footer， 使用 get_footer().
• 包含 search form， 使用 get_search_form().

include 用法:

<?php get_sidebar(); ?>

<?php get_footer(); ?>

一些模板函數(shù)的默認(rèn)文件可能被廢棄或不存在，在你的主題，你應(yīng)該提供這些文件。至于3.0版本以上，不推薦使用位于 wp-includes/theme-compat 的默認(rèn)文件。例如，你應(yīng)該提供 header.php 文件讓  get_header() 函數(shù)更好地安全工作，以及為 comments_template() 函數(shù)提供  comments.php 文件。

關(guān)于更多的如何利用各種模板，如何產(chǎn)生不同的信息， 請(qǐng)閱讀 Templates 文檔.

自定義頁(yè)面模板

在你的主題目錄中，你可以定義每個(gè)頁(yè)面的模板。要?jiǎng)?chuàng)建一個(gè)新的自定義頁(yè)面模板，你必須創(chuàng)建一個(gè)文件，比如我們創(chuàng)建一個(gè)  snarfer.php 文件，然后將下面的內(nèi)容添加到這個(gè)文件中：

<?php
/*
Template Name: Snarfer
*/
?>

上面的代碼定義了這個(gè) snarfer.php 文件作為“Snarfer”模板。當(dāng)然，你可以使用其他名稱替換“Snarfer”。此模板的名稱將出現(xiàn)在“主題編輯器”（即：外觀 – 編輯）中，作為編輯這個(gè)文件的鏈接。

需要注意的是，你不能使用WordPress默認(rèn)保留的名字來(lái)命名這個(gè)文件，因?yàn)槟切┟质怯刑厥庥猛镜摹Ｄ憧梢圆榭?WordPress保留的文件名。

上面的代碼只是用來(lái)聲明這個(gè)模板的，至于這個(gè)模板要顯示什么，如何顯示，就要靠你自己添加代碼了。要了解WordPress模板的各種功能，你可以通過(guò) 模板標(biāo)簽 查看介紹。你可能會(huì)發(fā)現(xiàn)，通過(guò)復(fù)制一些其他的模板（比如 page.php 或 index.php）的代碼到 snarfer.php，然后添加上面的5行代碼，就可以擁有和其他模板一樣的功能。你就可以在此基礎(chǔ)上對(duì)代碼進(jìn)行二次修改，而不必從頭開(kāi)始了。一旦你創(chuàng)建好這個(gè)模板，請(qǐng)將它添加到你的主題目錄中，這樣，你就可以在創(chuàng)建或編輯頁(yè)面的時(shí)候，通過(guò)“頁(yè)面屬性”這個(gè)模塊下的“模板”選擇這個(gè)模板啦。（注：如果你的主題不存在任何頁(yè)面模板，就沒(méi)辦法在“頁(yè)面屬性”中看到“模板”這個(gè)選項(xiàng)）

基于查詢的模板文件

WordPress可以根據(jù)不同查詢類型加載不同的模板。你可以通過(guò)兩種方法做到這一點(diǎn)：作為內(nèi)置模板層次（Template Hierarchy）的一部分，并通過(guò)使用 條件標(biāo)簽（Conditional Tag） 在模板文件的 循環(huán) （loop）中加載。

要使用 模板層次，你基本上需要提供特殊用途的模板文件，它會(huì)自動(dòng)覆蓋原來(lái)的 index.php 。例如，如果你的主題中提供了一個(gè)名為 category.php  的模板文件，但一個(gè)分類被查詢時(shí)，就會(huì)優(yōu)先加載 category.php 文件取代 index.php ；如果category.php 不存在，就會(huì)使用 index.php。

你還可以通過(guò)文件的命名獲得一個(gè)更具體的模板層次，比如一個(gè)名為 category-6.php 的文件，如果查詢的分類ID為 6 ，那么就會(huì)優(yōu)先加載這個(gè) category-6.php 文件取代 category.php 。（要獲得分類的ID，你只需訪問(wèn)后臺(tái) 文章 – 分類目錄，然后點(diǎn)擊編輯任何一個(gè)分類下的“編輯”，就可以在URL中看到“categories.php?action=edit&cat_ID=3”這樣的字樣，3 就是ID號(hào)）。你可以閱讀 分類模板 了解更多詳情。

如果你的主題需要更好地控制哪些模板文件中提供的 模板層次，你可以使用 條件標(biāo)簽。通過(guò)使用 條件標(biāo)簽 ，判斷在WordPress循環(huán)中哪些條件為真，就加在對(duì)應(yīng)的特定模板，或者顯示對(duì)應(yīng)的內(nèi)容。

例如，要為一個(gè)特定的類別加載一個(gè)獨(dú)特的樣式表，可以使用類似的代碼：

<?php
if ( is_category( '9' ) ) {
    get_template_part( 'single2' ); // 將這個(gè)模板樣式應(yīng)用于分類ID為 9 的文章
} else {
    get_template_part( 'single1' ); // 其他分類的文章使用這個(gè)模板樣式
}
?>

或者使用一個(gè)查詢，例如：

<?php
$post = $wp_query->post;
if ( in_category( '9' ) ) {
    get_template_part( 'single2' );
} else {
    get_template_part( 'single1' );
}
?>

上面例子的2種代碼，都可以根據(jù)判斷不同的分類，將不同的模板應(yīng)用在特定的分類上。查詢條件 不限分類，不過(guò)，建議你閱讀 條件標(biāo)簽 這篇文章查看所有的可用選項(xiàng)。

定義自定義模板

你可以通過(guò)使用 WordPress 插件系統(tǒng)來(lái)根據(jù)自己的標(biāo)準(zhǔn)定義不同的自定義模板。可以通過(guò)使用“template_redirect”這個(gè)行動(dòng)鉤子來(lái)實(shí)現(xiàn)這個(gè)先進(jìn)的功能。你可以在 插件API 參考 了解過(guò)多創(chuàng)建創(chuàng)建的信息。

包括模板文件

要在模板中加載另一個(gè)模板（除了 header、sidebar、footer，其中包括有預(yù)定義的命令，如 get_header()），你可以使用 get_template_part() 。通過(guò)這種方式，可以在主題中重復(fù)利用一個(gè)代碼片段。

從模板中引用文件

在同一個(gè)模板中引用其他文件，避免 硬編碼（hard-coded） 的 URIs 或文件路徑。而應(yīng)該使用 bloginfo() 引用URIs 或文件路徑：請(qǐng)看 從模板中引用文件。

請(qǐng)注意，在樣式表中的 URIs 是相對(duì)于樣式表，而不是相對(duì)于引用樣式表的頁(yè)面。例如，如果要包含一個(gè) images/ 目錄到你的主題中，你只需要指定相對(duì)目錄中的CSS，像這樣：

h1 {
    background-image: url(images/my-background.jpg);
}

插件 API 鉤子

開(kāi)發(fā)主題的時(shí)候，需要注意的是你的主題最好能和用戶可能安裝的任何插件共存。插件可以通過(guò)“動(dòng)作鉤子（Action Hooks, 查看Plugin API）”為wordpress增加功能。

大部分Action Hooks存在于wp的php核心中，所以你的主題不需要任何多余的特殊標(biāo)簽來(lái)讓它可以正常運(yùn)轉(zhuǎn)。但是少數(shù)的Action Hooks需要在你的主題中做特殊處理，以使插件能夠?qū)㈩^，尾，側(cè)邊欄等信息輸出到頁(yè)面中。如下是你需要包含到主題 中的Action Hooks列表：

wp_head()

放在<head>標(biāo)簽之內(nèi)，在 header.php文件中. 大部分插件常在這里導(dǎo)入javascript文件。

wp_footer()

在footer.php，在</body>標(biāo)簽之前 . 使用舉例：一些插件會(huì)在這里插入要在文檔最后執(zhí)行的PHP代碼。更常見(jiàn)的用法是插入網(wǎng)頁(yè)靜態(tài)代碼，比如Google Analytics。

wp_meta()

通常用在主題菜單或側(cè)邊欄 sidebar.php 模板文件的 <li>Meta</li> 中。使用舉例：包括一個(gè)旋轉(zhuǎn)的廣告或標(biāo)簽云。

comment_form()

放在 comments.php ，在文件的結(jié)束標(biāo)簽(</div>)之前。 使用舉例：顯示評(píng)論預(yù)覽。

主題定制API

在 WordPress 3.4開(kāi)始，添加了一個(gè)新的主題自定義功能，幾乎適用于所有WordPress主題。通過(guò)在主題中提供一個(gè)支持聲明 add_theme_support() 或者使用 設(shè)置API ，就可以自動(dòng)填充一些選項(xiàng)到主題的定制管理頁(yè)面中，同時(shí)允許管理員在線實(shí)時(shí)預(yù)覽主題的效果。

主題和插件開(kāi)發(fā)者，如果有興趣添加一些新的選項(xiàng)到主題定制頁(yè)面中，可以查看 主題定制API 文檔 和 Ottopress.com 網(wǎng)站的教程。

不可信的數(shù)據(jù)

你應(yīng)該避免在你的主題中動(dòng)態(tài)生成內(nèi)容，尤其是在HTML屬性中輸出的內(nèi)容。正如 WordPress標(biāo)準(zhǔn)編碼文檔 所提及的，在屬性中加載的本文應(yīng)該使用 esc_attr() 包括，以避免單引號(hào)或雙引號(hào)結(jié)束屬性值和產(chǎn)生無(wú)效的XHTML，從而導(dǎo)致安全問(wèn)題。

常見(jiàn)的安全輸出情況下，需要有一些特殊的模板標(biāo)簽。在這種情況下，輸出一個(gè)標(biāo)題屬性，應(yīng)該使用 the_title_attribute() 而不是 the_title() ，這樣才能避免安全問(wèn)題。下面來(lái)看一個(gè)例子，正確轉(zhuǎn)義一篇文章標(biāo)題鏈接的標(biāo)題屬性：

<a href="<?php the_permalink(); ?>" title="<?php sprintf( __( 'Permanent Link to %s', 'theme-name' ), the_title_attribute( 'echo=0' ) ); ?>"><?php the_title(); ?></a>

使用正確的響應(yīng)函數(shù)替換已經(jīng)棄用的應(yīng)該避免的函數(shù)：使用 esc_html() 替換 wp_specialchars() 和 htmlspecialchars()，使用 esc_url() 替換 clean_url()，使用 esc_attr() 替換 attribute_escape()。查看 Data_Validation 了解更多。

翻譯支持/ I18N

為了確保本地語(yǔ)言的平穩(wěn)過(guò)渡，請(qǐng)?jiān)谥黝}文件中，使用基于 WordPress  gettext-based i18n 的功能來(lái)包裝所有需要翻譯的文本。這樣更有利于將語(yǔ)言包的翻譯掛載到當(dāng)前網(wǎng)站中。請(qǐng)閱讀 WordPress 本地化 和 I18n for WordPress Developers 了解更多信息。

主題類（Theme Classes）

使用下面的模板標(biāo)簽來(lái)添加WordPress的 body、post、和 comment 的元素屬性。其中 post 類，只適用于在循環(huán)（Loop）中的元素。

• body_class()
• post_class()
• comment_class()

模板文件清單

開(kāi)發(fā)你的主題時(shí)，請(qǐng)按照下面的標(biāo)準(zhǔn)檢查你的主題模板文件：

頭部文檔（header.php）

• 使用正確的 DOCTYPE.
•  <html> 開(kāi)始標(biāo)簽應(yīng)該包含 language_attributes().
•  <meta> 字符集元素應(yīng)該放到其他元素的上面，包括 <title> 元素。
• 使用 bloginfo() 設(shè)置 <meta> 字符集和description元素。
• 使用 wp_title() 設(shè)置 <title> 元素。 查看原因。
• 使用 get_stylesheet_uri() 來(lái)獲取當(dāng)前主題的樣式表文件。
• 使用 Automatic Feed Links 添加 feed 鏈接。
• 添加聲明 wp_head() 到 </head> 結(jié)束標(biāo)簽的前面。插件會(huì)使用這個(gè)動(dòng)作鉤子（action hook ）來(lái)加載它們的JS、CSS 和其他功能代碼。

下面是一個(gè)格式正確的HTML5兼容的頭部區(qū)域的例子：

<!DOCTYPE html>
<html <?php language_attributes(); ?>>
    <head>
        <meta charset="<?php bloginfo( 'charset' ); ?>" />
        <title><?php wp_title(); ?></title>
        <meta name="description" content="<?php bloginfo( 'description' ); ?>">
        <link rel="profile" href="http://gmpg.org/xfn/11" />
        <link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" type="text/css" media="screen" />
        <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
        <?php if ( is_singular() && get_option( 'thread_comments' ) ) wp_enqueue_script( 'comment-reply' ); ?>
        <?php wp_head(); ?>
    </head>

導(dǎo)航菜單（header.php）

主題的主菜單應(yīng)該支持使用 wp_nav_menu() 的自定義菜單功能：

• 菜單應(yīng)該支持長(zhǎng)鏈接的標(biāo)題和大量的列表項(xiàng)。不應(yīng)該打破這些項(xiàng)目的設(shè)計(jì)或布局。
• 應(yīng)該正確支持子菜單的顯示。可以的話，建議通過(guò)下來(lái)菜單來(lái)顯示子菜單，并且支持多級(jí)子菜單。

Widgets小工具（sidebar.php）

• 主題應(yīng)該支持小工具（Widgets），允許一些布局區(qū)域（比如側(cè)邊欄）掛載小工具（比如標(biāo)簽云、友情鏈接、分類類表 等）。
• 小工具的應(yīng)該是可以從 外觀 – 小工具 中進(jìn)行設(shè)置，并且當(dāng)添加小工具時(shí)，原來(lái)硬性寫(xiě)定到小工具區(qū)域的默認(rèn)內(nèi)容應(yīng)該被替換。

頁(yè)腳（footer.php）

• 在 </body>結(jié)束標(biāo)簽的前面添加 wp_footer() ：

<?php wp_footer(); ?>
</body>
</html>

主頁(yè)（index.php）

• 通過(guò)摘要或全文輸出的方式顯示文章列表。可以根據(jù)自己的需要選擇適合的方式。
• 包括 wp_link_pages() ，以便支持在文章中的導(dǎo)航鏈接。

歸檔（archive.php）

• 顯示歸檔名稱（標(biāo)簽，分類，日期，或作者歸檔）。
• 通過(guò)摘要或全文輸出的方式顯示文章列表。可以根據(jù)自己的需要選擇適合的方式。
• 包括 wp_link_pages() ，以便支持在頁(yè)面中的導(dǎo)航鏈接。

頁(yè)面（page.php）

• 顯示頁(yè)面標(biāo)題和內(nèi)容
• 顯示評(píng)論列表和評(píng)論表單（除非評(píng)論已關(guān)閉）
• 包括 wp_link_pages() ，以便支持在文章中的導(dǎo)航鏈接。
• 元數(shù)據(jù)（如標(biāo)簽，類別，日期和作者）不應(yīng)該被顯示。
• 為已登錄的具有編輯權(quán)限的用戶顯示一個(gè)“編輯”鏈接

文章（single.php）

• 包括 wp_link_pages() ，以便支持在這篇文章中的導(dǎo)航鏈接。
• 顯示文章標(biāo)題和內(nèi)容
  • 標(biāo)題應(yīng)該是純文本，而不應(yīng)該添加一個(gè)指向自己的鏈接
• 顯示文章日期
  • 尊重日期和時(shí)間格式設(shè)置，除非是很重要的設(shè)計(jì)。（用戶可以在 儀表盤(pán)>設(shè)置>常規(guī)，設(shè)置時(shí)間和日期的格式）
  • 輸出的格式應(yīng)該基于用戶的設(shè)置，使用函數(shù) the_time( get_option( ‘date_format’ ) )
• 顯示作者的名字（如果適用）
• 顯示文章分類和標(biāo)簽
• 為已登錄的具有編輯權(quán)限的用戶顯示一個(gè)“編輯”鏈接
• 顯示評(píng)論列表和評(píng)論表單
• 使用 previous_post_link() 和 next_post_link()  顯示上一篇和下一篇文章

評(píng)論（comments.php）

• 作者的評(píng)論應(yīng)該高亮顯示，以便區(qū)分。
• 顯示用戶的 gravatars 頭像（如果適用）
• 支持嵌套評(píng)論
• 顯示 引用通告（trackbacks/pingbacks）
• 該文件不應(yīng)該包含函數(shù)的定義，除非使用  function_exist() 來(lái)檢查，以避免再次聲明中指定的錯(cuò)誤。理想情況下，所有的函數(shù)應(yīng)該在 functions.php 文件中。

搜索結(jié)果（search.php）

• 通過(guò)摘要或全文輸出的方式顯示文章列表。可以根據(jù)自己的需要選擇適合的方式。
• 搜索結(jié)果頁(yè)面顯示的搜索字詞產(chǎn)生的結(jié)果。這是一個(gè)簡(jiǎn)單而有效的方式來(lái)提醒別人，他們只是在搜索——特別是在結(jié)果為零的情況下。使用  the_search_query() 或 get_search_query() （顯示或返回值，分別）。例如：

  <h2><?php printf( __( 'Search Results for: %s' ), '<span>' . get_search_query() . '</span>'); ?></h2>

• 這是一個(gè)好的做法，在搜索結(jié)果頁(yè)面中再次包含搜索表單，可以使用 get_search_form()

JavaScript

• JavaScript代碼應(yīng)該盡可能放在外部文件中。
• 使用 wp_enqueue_script() 加載你的腳本。
• Javascript的直接加載到HTML文件（模板文件）應(yīng)該是CDATA編碼，以防止舊版本的瀏覽器出現(xiàn)錯(cuò)誤。
  

  <script type="text/javascript">
  /* <![CDATA[ */
  // content of your Javascript goes here
  /* ]]> */
  </script>

截圖

為你的主題添加一個(gè)截圖。截圖應(yīng)該命名為 screenshot.png ，并且放在你的主題的根目錄下。截圖應(yīng)該能直接展示你的主題設(shè)計(jì)和保存為 PNG 格式。推薦的圖像大小為600×450，截圖將顯示為300×225，但雙尺寸的圖像，用來(lái)給HIDPI顯示器上更好的顯示效果。

主題選項(xiàng)

主題可以有選擇地支持 主題選項(xiàng)屏幕 。舉個(gè)簡(jiǎn)單的代碼例子，查看 A Sample WordPress Theme Options Page。

如果要給用戶使用 主題選項(xiàng)屏幕 的權(quán)限，應(yīng)該使用“edit_theme_options”來(lái)設(shè)置用戶的權(quán)限，而不是使用 “switch_themes”，除非這個(gè)用戶角色可以直接切換主題。需要了解更多，你可以閱讀 Roles and Capabilities 和  Adding Administration Menus。

如果你正在主題中使用 “edit_themes”能力來(lái)為管理員添加訪問(wèn) 主題選項(xiàng)屏幕 （或其他自定義屏幕）的權(quán)限，要知道，自 3.0 版以來(lái)，這個(gè)能力默認(rèn)并沒(méi)有分配給WordPress多站點(diǎn)的管理員。查看 說(shuō)明。 在這種情況下，如果你希望管理員訪問(wèn)“主題選項(xiàng)”菜單，請(qǐng)使用 “edit_theme_options”能力。查看WordPress多站點(diǎn)的管理員的附加能力。

主題測(cè)試過(guò)程

1. 修復(fù)PHP和WordPress錯(cuò)誤。添加下面的調(diào)試設(shè)置到你的wp-config.php，以便看到廢棄的函數(shù)調(diào)用和其他WordPress相關(guān)的錯(cuò)誤：define(‘WP_DEBUG’, true); 。查看 Deprecated Functions Hook 了解更多。
2. 對(duì)照上面提到的 模板文件清單 檢查模板文件。
3. 使用 Theme Unit Test 做一個(gè)運(yùn)行測(cè)試。
4. 驗(yàn)證HTML和CSS。請(qǐng)參閱驗(yàn)證一個(gè)網(wǎng)站。
5. 檢查 JavaScript 錯(cuò)誤。
6. 測(cè)試在所有目標(biāo)瀏覽器。例如，IE7，IE8，IE9，Safari，Chrome，Opera，和 Firefox。
7. 清理任何多余的意見(jiàn)，調(diào)試設(shè)置，或待辦項(xiàng)目。
8. 請(qǐng)查閱 Theme Review 如果你希望將主題公開(kāi)發(fā)布到WordPress官方主題庫(kù)。

資源和參考

請(qǐng)?jiān)L問(wèn) 原文 閱讀這個(gè)部分的內(nèi)容。

注：本文由 倡萌@WordPress大學(xué) 翻譯自“ Theme Development ”，前半部分譯文參考WordPress官方中文翻譯。