從理解WordPress主題架構開始，係開發者必須行出嘅第一步。一個標準主題由一系列模板檔案、樣式表同函數檔案組成，佢哋一齊合作，將網站嘅數據同內容以可視化嘅方式呈現畀用戶。核心思想係WordPress透過主循環查詢內容，然後跟據唔同嘅頁面類型，載入對應嘅模板檔案嚟渲染頁面。
一個最基本嘅主題至少需要兩個檔案：index.php 同埋 style.css。style.css 唔單止係樣式表，佢仲包含咗定義主題元數據嘅註釋頭，用喺WordPress後台識別主題。隨住主題功能增加，你需要創建更多模板檔案，例如用喺文章單頁嘅 single.php、用喺頁面嘅 page.php，以及控制全局佈局嘅 header.php、footer.php 同埋 sidebar.php。
主題開發嘅核心係模板層級系統。當用戶訪問一個頁面時，WordPress會按照特定嘅優先級順序搵最匹配嘅模板檔案。例如，對於一個分類頁面，WordPress會依次搵 category-{slug}.php、category-{id}.php、category.php、archive.php，最後先係 index.php。理解呢個層級對於創建靈活且可自訂嘅主題至關重要。
推薦閱讀 WordPress主題開發初學者完全指南：從零到一構建你嘅第一個主題。
準備工作同開發環境搭建
喺編寫第一行程式碼之前，建立一個高效嘅本地開發環境係必不可少嘅。咁樣可以令你喺唔影響線上網站嘅情況下進行自由測試同除錯。
首先，你需要一個本地伺服器環境。可以選擇集成軟件包例如XAMPP、MAMP或者Local by Flywheel，佢哋一鍵式安裝咗Apache/Nginx、PHP同MySQL。對於追求現代化工作流程嘅開發者，使用Docker容器來搭建一個同生產環境高度一致嘅WordPress環境係更好嘅選擇。
其次，一個強大嘅代碼編輯器係核心生產力工具。Visual Studio Code（VS Code）因為佢豐富嘅插件生態而廣受歡迎。對於WordPress開發，建議安裝好似PHP Intelephense（用於PHP代碼智能提示）、WordPress Snippet（代碼片段）、同埋用於實時預覽嘅瀏覽器同步插件。
最後，版本控制係專業開發嘅基石。由項目一開始就用Git初始化你嘅主題目錄，並連接到GitHub、GitLab或Bitbucket等遠程倉庫。呢樣唔單止方便代碼備份同團隊協作，更加係後續進行版本發佈同管理嘅基礎。同時，配置一個簡單嘅任務運行器（例如NPM scripts）來處理SCSS編譯、JS壓縮等重複性工作，可以極大提升開發效率。
構建主題核心文件同模板
呢個係主題開發嘅實質性編碼階段。我哋會由創建必需嘅文件開始，逐步構建一個功能完整、符合標準嘅WordPress主題。
推薦閱讀 WordPress主題開發終極指南：由零到一建立專業主題。
建立樣式表同函數檔案
首先，喺 wp-content/themes 目錄下創建一個新嘅文件夾，例如「my-first-theme」。喺該文件夾內，創建 style.css 文件，並喺文件頂部添加主題信息頭。
/*
Theme Name: My First Theme
Theme URI: https://example.com/my-first-theme
Author: Your Name
Author URI: https://example.com
Description: 一个从零开始开发的WordPress主题教程示例。
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: my-first-theme
*/跟住，創建主題嘅核心函數文件 functions.php。呢個文件用嚟存放主題嘅所有功能函數、樣式腳本註冊以及主題特性支援聲明。佢就好似主題嘅大腦。
<?php
// 为主题添加菜单支持
function my_first_theme_setup() {
// 让主题支持自定义菜单
register_nav_menus( array(
'primary' => __( '主导航菜单', 'my-first-theme' ),
'footer' => __( '页脚菜单', 'my-first-theme' ),
) );
// 让文章和页面支持特色图像
add_theme_support( 'post-thumbnails' );
// 支持HTML5标记
add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery', 'caption' ) );
// 添加标题标签支持
add_theme_support( 'title-tag' );
}
add_action( 'after_setup_theme', 'my_first_theme_setup' );
// 引入样式表和脚本
function my_first_theme_scripts() {
// 引入主样式表
wp_enqueue_style( 'my-first-theme-style', get_stylesheet_uri() );
// 引入自定义JavaScript文件
wp_enqueue_script( 'my-first-theme-script', get_template_directory_uri() . '/js/main.js', array(), null, true );
}
add_action( 'wp_enqueue_scripts', 'my_first_theme_scripts' );
?>分解頁面結構模板
WordPress提倡將頁面結構模組化。創建 header.php、footer.php 同埋 sidebar.php 嚟拆分公共部分。
header.php 應包含文檔類型聲明、區域同頁面嘅開頭部分，通常包括網站標題、描述同主菜單。使用 wp_head() 鉤子等WordPress同插件能夠喺度插入必要嘅代碼。
footer.php 則包含頁尾內容同關閉標籤，並使用 wp_footer() 鉤子。
index.php 作為最終嘅後備模板，負責將各個部分組合埋一齊，並運行主循環嚟顯示文章列表。
推薦閱讀 WordPress主題開發終�極指南：從零開始構建自訂模板。
<?php get_header(); ?>
<main id="primary" class="site-main">
<?php
if ( have_posts() ) :
while ( have_posts() ) :
the_post();
// 包含文章内容模板
get_template_part( 'template-parts/content', get_post_type() );
endwhile;
the_posts_navigation();
else :
get_template_part( 'template-parts/content', 'none' );
endif;
?>
</main>
<?php get_sidebar(); ?>
<?php get_footer(); ?>實現主題功能同高級特性
基礎模板搭建完成之後，我哋可以透過WordPress強大嘅API嚟增加互動性同動態功能，令到主題由「靜態」變成「智能」。
創建自訂文章循環同查詢
除咗預設嘅主循環，你經常需要喺側邊欄或者特定區域顯示自訂內容。呢個時候就需要用 WP_Query 類嚟創建新嘅查詢循環。
例如，喺側邊欄顯示最新發佈嘅5篇文章：
5,
'post_status' => 'publish',
) );
if ( $recent_posts->have_posts() ) :
while ( $recent_posts->have_posts() ) : $recent_posts->the_post();
// 输出每篇文章的标题和链接
the_title( '<h3><a href="/yue/' . esc_url( get_permalink() ) . '/">', '</a></h3>' );
endwhile;
wp_reset_postdata(); // 重置全局post数据，至关重要
endif;
?>集成小工具同自訂區域
小工具區域係WordPress主題靈活性嘅關鍵。喺 functions.php 入面用 register_sidebar() 函數嚟註冊新嘅小工具區域（側邊欄）。
function my_first_theme_widgets_init() {
register_sidebar( array(
'name' => __( '主页侧边栏', 'my-first-theme' ),
'id' => 'sidebar-home',
'description' => __( '此小工具区域将显示在主页上。', 'my-first-theme' ),
'before_widget' => '<section id="%1$s" class="widget %2$s">',
'after_widget' => '</section>',
'before_title' => '<h2 class="widget-title">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'my_first_theme_widgets_init' );註冊後，喺模板文件（如 front-page.php）入面用 dynamic_sidebar() 函數調用呢個區域。
加入主題自訂選項
為咗等用戶唔使改程式碼就可以調整主題外觀（例如Logo、顏色），你需要用WordPress自訂器（Customizer）API。呢個會涉及創建設定（Setting）、控制項（Control）同部分（Section）。
一個簡單嘅例子，加一個網站標語顏色選項：
function my_first_theme_customize_register( $wp_customize ) {
// 添加一个设置
$wp_customize->add_setting( 'tagline_color', array(
'default' => '#333333',
'sanitize_callback' => 'sanitize_hex_color',
'transport' => 'postMessage', // 使用postMessage实现实时预览
) );
// 添加一个控件（颜色选择器）
$wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'tagline_color', array(
'label' => __( '标语颜色', 'my-first-theme' ),
'section' => 'colors', // 放入现有的“颜色”部分
'settings' => 'tagline_color',
) ) );
}
add_action( 'customize_register', 'my_first_theme_customize_register' );
// 将自定义颜色输出到前台
function my_first_theme_customize_css() {
?>
<style type="text/css">
.site-description { color: <?php echo esc_attr( get_theme_mod( 'tagline_color', '#333333' ) ); ?>; }
</style>
<?php
}
add_action( 'wp_head', 'my_first_theme_customize_css' );主題測試、優化同發佈
開發完成之後，一個穩定、高效同安全嘅主題需要通過嚴格嘅測試流程，同埋做好發布前嘅準備工作。
進行跨環境兼容性測試
喺唔同版本嘅PHP（建議測試7.4至8.2版本）、唔同版本嘅WordPress核心，同埋各種主流瀏覽器（Chrome、Firefox、Safari、Edge）上面測試你嘅主題。確保主題嘅基本功能好似導航、佈局、評論表格喺所有環境下都正常運作。
同時，必須測試主題嘅響應式設計。使用開發者工具嘅設備模擬器，檢查由手機到桌面唔同屏幕尺寸下嘅佈局係咪合理，圖片係咪適配，觸摸目標係咪夠大。
遵守WordPress編碼標準同效能優化
用WordPress官方推薦嘅PHP Code Sniffer（跟埋WordPress編碼標準規則集）工具嚟檢查你嘅程式碼，確保佢符合WordPress嘅PHP同CSS編碼標準。咁樣唔單止提高咗程式碼嘅可讀性同可維護性，亦係將主題提交到官方目錄嘅強制要求。
效能方面，確保所有前端資源（CSS、JavaScript）都經過最小化同壓縮。為主題圖片實現延遲加載，並考慮用 wp_add_inline_script() 進行關鍵CSS嘅內聯處理以減少渲染阻塞。跟住WordPress最佳實踐嚟編寫數據庫查詢，避免喺循環入面做多餘查詢。
準備發佈所需文件同應用商店提交
創建一個 readme.txt 文件，仿照WordPress插件目錄嘅格式，詳細說明主題功能、安裝步驟、常見問題、更新日誌等。呢份係向用戶展示主題嘅重要文檔。
如果你計劃將主題免費提交到WordPress.org官方目錄，需要仔細閱讀其主題審查要求，確保主題滿足所有指南（安全性、代碼質量、功能、許可等）。然後通過WordPress主題提交系統上傳你嘅主題zip包，等待審核。
對於商業主題，你需要搭建一個展示網站，提供詳細嘅文檔、示範同付費購買渠道。無論邊種方式，都要確保你嘅主題遵循GPL協議，呢個係WordPress生態嘅基石。
摘要
WordPress主題開發係一個結合前端技術、PHP後端邏輯同WordPress核心API嘅系統性工程。由理解模板層級同工作原理開始，到搭建環境、構建核心模板檔案，再透過功能函數、小工具同自訂器增強主題嘅互動性同可定制性，每一步都要求開發者具備清晰嘅邏輯同對WordPress生態嘅深入理解。最終嘅測試、優化同發佈流程，就係將個人作品打磨成專業產品，令佢能夠穩定、高效咁服務廣大用戶嘅必要步驟。遵循最佳實踐同編碼標準，唔單止可以提升主題質量，亦可以令你更深入咁融入WordPress嘅開源社區。
常見問題
開發WordPress主題需要掌握邊啲核心技術？
開發WordPress主題，你需要紮實掌握HTML5同CSS3嚟構建頁面結構同樣式。PHP係核心編程語言，用嚟處理動態邏輯同同WordPress數據庫交互。對JavaScript（特別係原生JS或者jQuery）嘅基本了解都係必要嘅，用嚟實現前端交互。另外，必須熟悉WordPress嘅核心概念，例如模板層級、主循環、掛鉤（動作同過濾器）以及各種內置函數。
點樣令我嘅主題支援多語言翻譯？
WordPress使用GNU gettext技術實現國際化（i18n）。喺你嘅主題入面，所有需要翻譯嘅文本字串都應該使用特定嘅函數進行包裝，例如 () 用喺php入面回顯翻譯，esc_html() 用於轉義後回顯，_e() 用嚟直接輸出翻譯等等。你需要喺functions.php入面，經由load_theme_textdomain()函數度載入語言檔案。跟住，用Poedit呢類工具，從你嘅主題代碼度抽取出字串，生成.pot檔案，並以此為模板創建唔同語言嘅.po同埋.mo檔案。
主題嘅functions.php檔案有冇大小限制？
從技術上嚟講，functions.php 檔案本身冇硬性嘅檔案大小或者代碼行數限制。不過，考慮到代碼嘅可維護性同組織性，將成百上千行代碼全部堆埋喺一個檔案度係好差嘅做法。最佳實踐係將唔同嘅功能模組拆分到獨立嘅PHP檔案度，然後喺functions.php入面用require_once或get_template_part()按需引入。例如，你可以創建/inc目錄，喺入面存放customizer.php, widgets.php, helpers.php等文件，令代碼結構更加清晰。
點解我嘅自訂CSS樣式喺WordPress後台編輯器度唔生效？
WordPress後台嘅可視化編輯器（古騰堡區塊編輯器或者經典編輯器）為咗安全同隔離性，佢編輯區域嘅內容通常運行喺一個獨立嘅環境入面。所以，你個主題前台載入嘅CSS檔案預設唔會影響到呢個編輯區域。要令你個主題樣式喺編輯後台都生效，提供「所見即所得」嘅編輯體驗，你需要用add_theme_support( 'editor-styles' )嚟聲明支援，同埋用add_editor_style()函數將你嘅CSS檔案（或者一個專為編輯器寫嘅CSS檔案）加入到後台編輯器入面。
下一步應該點做?
延伸閱讀及實用知識
以下內容與本文主題相關,適合進一步閱讀。一般而言,最好由與你目前問題最緊密相關的文章開始,然後逐步擴展到周邊主題。