點解要由零開始開發WordPress主題
喺WordPress生態系統入面，有海量嘅免費同埋付費主題可以揀，噉點解開發者仲需要學識由零開始建立主題呢？核心原因在於控制力、性能優化同埋技能提升。用現成主題雖然快，但通常伴隨住冗餘代碼、唔必要嘅功能同埋難以自訂嘅限制。由零開發意味住你可以完全掌控每一行程式碼，確保主題只包含網站必需嘅功能，從而得到更快速嘅載入速度、更好嘅SEO表現同埋更高嘅安全性。
由零開始建立主題亦係深入理解WordPress核心運作機制嘅最佳途徑。你會直接同模板層級、WP_Query、動作掛鉤（Action Hooks）同埋過濾器掛鉤（Filter Hooks）打交道，呢種理解係進行高級自訂同埋插件開發嘅基礎。另外，一個精心建立嘅自訂主題可以完美配合品牌形象同埋用戶體驗需求，呢啲係通用主題好難做到嘅。
搭建開發環境同埋建立主題基礎結構
喺寫第一行程式碼之前，建立一個高效嘅本地開發環境係好重要㗎。推薦用Local by Flywheel、DevKinsta或者Docker呢啲工具，佢哋可以好快咁配置好包含PHP、MySQL同網頁伺服器嘅完整環境。
推薦閱讀 WordPress 主題開發入門:從零開始打造你嘅第一個自訂主題。
跟住，喺你個WordPress安裝目錄嘅wp-content/themes文件夾入面，開一個新嘅文件夾做你嘅主題目錄，例如my-custom-theme。一個有效嘅WordPress主題至少需要兩個檔案：style.css同埋index.php。
style.css檔案唔單止係樣式表，仲承載住主題嘅元資料。檔案開頭嘅註解係主題嘅「身份證」。
/*
Theme Name: My Custom Theme
Theme URI: https://example.com/my-custom-theme
Author: Your Name
Author URI: https://example.com
Description: 一个从零开始构建的现代化WordPress主题。
Version: 1.0.0
License: GPL v2 or later
Text Domain: my-custom-theme
*/Text Domain用於國際化，必須同主題資料夾嘅名稱一致。
index.php係主題嘅預設模板檔案，亦都係模板層級入面最後嘅後備方案。初頭階段，佢可以好簡單，淨係用嚟確保主題俾WordPress識別到。
<!DOCTYPE html>
<html no numeric noise key 1006>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<?php wp_head(); ?>
</head>
<body no numeric noise key 1003>
<?php wp_body_open(); ?>
<header>
<h1>我嘅自訂主題</h1>
</header>
<main>
<?php
if ( have_posts() ) :
while ( have_posts() ) :
the_post();
the_content();
endwhile;
endif;
?>
</main>
<footer>
<p>網站底部資訊</p>
</footer>
<?php wp_footer(); ?>
</body>
</html>呢個時候，你可以喺WordPress後台嘅「外觀」->「主題」度見到同啟動你嘅主題。
推薦閱讀 建立專業網站：從零開始開發自訂 WordPress 主題嘅完整指南。
核心模板檔案同模板層級
WordPress用一套精妙嘅「模板層級」系統嚟決定為當前請求載入邊個模板檔案。理解呢個層級係主題開發嘅核心。
理解模板載入順序
當用戶訪問一個頁面嗰陣，WordPress會根據查詢類型（係首頁、單篇文章、頁面定係分類目錄？）從最具體嘅模板檔案開始搵，如果唔存在，就逐級回退，直到用到index.php。舉個例，對於一篇單獨嘅文章，WordPress會按順序搵：single-post-{slug}.php -> single-post-{id}.php -> single-post.php -> single.php -> singular.php -> index.php。
創建常用模板檔案
你需要建立以下關鍵模板檔案嚟構建主題嘅基本結構：
* header.php：網站頭部，包含<head>區域同頂部導航。
* footer.php: 網站底部。
* functions.php：主題嘅功能檔案，用嚟加功能、註冊菜單、側邊欄等等。
* page.php: 用於顯示靜態頁面。
* single.php: 用嚟顯示單篇文章。
* archive.php: 用嚟顯示文章列表（分類、標籤、作者等）。
* 404.php: 404錯誤頁面。
* search.php: 搜尋結果頁面。
使用get_header(), get_footer(), get_sidebar()等模板標籤喺模板檔案入面引入部件。
喺functions.php度增強主題功能
functions.php係你個主題嘅「控制中心」。喺呢度，你可以透過WordPress提供嘅各種鉤子（Hooks）嚟擴展同修改功能。
註冊主題支援嘅功能
使用add_theme_support()函數嚟聲明你嘅主題支援邊啲WordPress核心功能。呢樣通常會擺喺一個透過after_setup_theme鉤子執行嘅函數入面。
推薦閱讀 由零開始：高效掌握 WordPress 主題開發嘅核心流程同實戰技巧。
function my_custom_theme_setup() {
// 让主题支持文章和评论的RSS feed链接
add_theme_support( 'automatic-feed-links' );
// 支持文章标题标签（Title Tag），无需手动写入<head>
add_theme_support( 'title-tag' );
// 支持文章特色图像
add_theme_support( 'post-thumbnails' );
// 支持自定义Logo
add_theme_support( 'custom-logo', array(
'height' => 100,
'width' => 400,
'flex-height' => true,
'flex-width' => true,
) );
// 支持HTML5标记（用于评论表单、搜索表单等）
add_theme_support( 'html5', array( 'comment-list', 'comment-form', 'search-form', 'gallery', 'caption', 'style', 'script' ) );
}
add_action( 'after_setup_theme', 'my_custom_theme_setup' );註冊導航菜單同側邊欄
導航菜單同側邊欄（小工具區域）亦都需要喺functions.php度註冊。
// 注册导航菜单位置
function my_custom_theme_menus() {
register_nav_menus( array(
'primary' => __( '主导航菜单', 'my-custom-theme' ),
'footer' => __( '底部菜单', 'my-custom-theme' ),
) );
}
add_action( 'init', 'my_custom_theme_menus' );
// 注册侧边栏（小工具区域）
function my_custom_theme_widgets_init() {
register_sidebar( array(
'name' => __( '主侧边栏', 'my-custom-theme' ),
'id' => 'sidebar-1',
'description' => __( '在此添加小工具。', 'my-custom-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_custom_theme_widgets_init' );註冊之後，你就可以喺後台「外觀」->「選單」同「外觀」->「小工具」度進行設定，並喺模板度用wp_nav_menu()同埋dynamic_sidebar()嚟調用佢哋。
樣式、腳本引入同循環控制
現代主題開發需要跟隨最佳實踐嚟管理CSS同JavaScript，並安全高效咁輸出文章內容。
安全噉加入CSS同JavaScript
千祈唔好直接喺模板檔案入面硬連結CSS同JS檔案。應該用wp_enqueue_style()同埋wp_enqueue_script()函數，並且掛載到wp_enqueue_scripts掛咗鈎
function my_custom_theme_scripts() {
// 引入主题主样式表
wp_enqueue_style( 'my-custom-theme-style', get_stylesheet_uri(), array(), wp_get_theme()->get( 'Version' ) );
// 引入自定义CSS
wp_enqueue_style( 'my-custom-theme-custom', get_template_directory_uri() . '/assets/css/custom.css', array(), '1.0' );
// 引入jQuery（WordPress已内置）和自定义JS
wp_enqueue_script( 'my-custom-theme-navigation', get_template_directory_uri() . '/assets/js/navigation.js', array( 'jquery' ), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_custom_theme_scripts' );將第三個參數（$deps）設為array( 'jquery' )可以聲明依賴，確保jQuery先載入。最後一個參數為true表示腳本喺頁面底部載入。
喺循環度安全輸出內容
喺模板檔案（例如single.php, archive.php）入面，用「循環」嚟輸出文章內容。一定要用WordPress提供嘅模板標籤同轉義函數嚟確保安全。
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<article id="post-<?php the_ID(); ?>" no numeric noise key 1009>
<header class="entry-header">
<h1 class="entry-title"><?php the_title(); ?></h1>
<div class="entry-meta">
|
</div>
</header>
<div class="entry-content">
<?php
// 输出文章内容，并应用段落过滤器等
the_content();
?>
</div>
<footer class="entry-footer">
<?php the_tags( '标签: ', ', ', '<br />' ); ?>
</footer>
</article>
<p><?php esc_html_e( '抱歉，没有找到符合条件的内容。', 'my-custom-theme' ); ?></p>
<?php endif; ?>使用the_title(), the_content()等函數會自動輸出內容。用esc_html_e()或esc_html__()對需要翻譯嘅字串進行轉義同國際化。
摘要
由零開始開發一個WordPress主題係一個系統性工程，遠遠唔止係寫HTML同CSS咁簡單。你需要理解WordPress嘅核心概念：模板層級決定咗內容嘅顯示邏輯；functions.php係你嘅功能中樞，透過掛鉤系統同WordPress核心互動；WP_Query同「循環」係動態內容輸出嘅引擎；而安全噉引入資源、跳脫輸出同國際化就係構建專業級主題嘅必要準則。由創建最簡單嘅style.css同埋index.php開始，逐步加入模板檔案、註冊選單、支援特色功能，你會一步步見證一個功能完整、高效能、易維護嘅自訂主題嘅誕生。呢個過程唔單止可以令你打造出獨一無二嘅網站，更加可以令你成為一個真正嘅WordPress開發者。
常見問題
由頭開始開發主題必須要識咩程式語言？
由頭開始開發一個WordPress主題，你需要掌握HTML、CSS同PHP作為核心語言。HTML用嚟建立頁面結構，CSS用嚟樣式設計同排版（建議同時了解響應式設計）。PHP係WordPress嘅伺服器端語言，用嚟處理邏輯、調用數據同生成動態頁面。另外，對JavaScript（尤其係jQuery）有基本了解會好有幫助，用嚟實現前端互動效果。
主題開發入面，點樣實現頁面排版嘅自訂？
喺WordPress主題開發入面，頁面排版主要透過模板檔案同CSS嚟實現。首先，你可以為唔同頁面類型（例如首頁、網誌列表、單頁）創建唔同嘅模板檔案（例如front-page.php, home.php），喺每個檔案入面定義獨特嘅HTML結構。其次，利用CSS嘅Flexbox或者Grid佈局技術嚟實現響應式嘅版面設計。更高級嘅方法係創建多個側邊欄區域，並且容許用戶喺後台透過「小工具」拖拽組件嚟動態組合佈局。
乜嘢係子主題，點解同埋點樣使用佢？
子主題係一個依賴於另一個主題（父主題）而運作嘅主題。佢容許你修改或者擴展父主題嘅功能同樣式，而唔需要直接修改父主題嘅代碼。咁樣做嘅好處係：當父主題更新嗰陣，你嘅自定義修改（喺子主題入面）唔會被覆蓋，更新過程安全無虞。
使用子主題非常簡單。喺wp-content/themes目錄下創建一個新資料夾作為子主題，並喺其中創建一個style.css文件，其文件頭必須通過Template:字段聲明父主題嘅目錄名。子主題嘅functions.php會被優先載入，你可以喺呢度加新功能或者透過鉤子修改父主題行為。模板文件亦都會被優先使用。
點樣可以令我嘅主題支援多語言（國際化）？
讓主題支援多語言，即係國際化（i18n），主要涉及將用戶睇到嘅文本字串包裝，等翻譯工具可以識別。喺代碼入面，唔好直接寫死英文或者中文文本，而係用WordPress嘅翻譯函數，例如()用喺PHP入面返翻譯字串，_e()用嚟直接輸出，esc_html()用嚟跳脫同返。
你需要喺style.css的Text Domain同所有翻譯函數調用入面，用一致嘅主題文本域（Text Domain）。然後，可以用Poedit呢類軟件掃描你嘅主題代碼，生成.pot翻譯模板檔案，譯者基於呢個創建對應語言（例如zh_CN.po）嘅翻譯檔案，最後編譯成.mo文件放入主題嘅languages資料夾。WordPress 會根據網站語言設定自動載入對應翻譯。
下一步應該點做?
延伸閱讀及實用知識
以下內容與本文主題相關,適合進一步閱讀。一般而言,最好由與你目前問題最緊密相關的文章開始,然後逐步擴展到周邊主題。