基礎準備工作
在開始編寫代碼之前，合適的環境和基礎的理解是成功的基石。首先，你需要一個本地開發環境。你可以選擇集成軟件包如 XAMPP、MAMP 或 Local by Flywheel，它們能快速爲你配置好 PHP、MySQL 和 Web 服務器。當然，也可以選擇更靈活的方式，在本地手動搭建環境。確保你的 PHP 版本在 7.4 或以上，MySQL 在 5.6 或以上。
接下來，你需要爲你的自定義主題創建一個獨立的目錄。這個目錄必須位於 WordPress 安裝目錄的 wp-content/themes/ 文件夾下。例如，你可以創建一個名爲 my-first-theme 的文件夾。一個 WordPress 主題只需要兩個文件就能被系統識別：index.php 以及 style.css其中,style.css 不僅是樣式表，更包含了定義主題元數據的文件頭，這是主題的“身份證”。
創建主題核心文件
編寫主題樣式表頭
style.css 文件的開頭必須是格式化的 CSS 註釋塊，其中包含了 WordPress 識別主題所需的所有信息。這是每個主題必須正確配置的部分。
推荐阅读 從零到一：WordPress主題開發完整指南與實戰教程。
/*
Theme Name: 我的第一个主题
Theme URI: https://example.com/my-first-theme/
Author: 你的名字
Author URI: https://yourwebsite.com
Description: 这是一个入门级的自定义 WordPress 主题，用于学习开发。
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: my-first-theme
*/其中，“Text Domain”用於國際化，我們將在後面使用函數 __() 或者 _e() 來使主題中的文本支持多語言翻譯。
構建基本模板文件
index.php 是主題的默認模板，也是最重要的回退模板。當 WordPress 找不到更具體的模板文件（如 single.php）時，就會使用它。一個最基本的 index.php 應該包含 WordPress 的循環（The Loop），這是輸出文章內容的核心機制。
<!DOCTYPE html>
<html no numeric noise key 1022>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body no numeric noise key 1019>
<header id="site-header">
<h1><a href="/zh-hant/</?php echo esc_url( home_url( '/' ) ); ?>"></a></h1>
<p></p>
</header>
<main id="main-content">
<article id="post-<?php the_ID(); ?>" no numeric noise key 1011>
<h2><a href="/zh-hant/</?php the_permalink(); ?>"></a></h2>
<div class="entry-content">
</div>
</article>
<p><?php _e( '抱歉，没有找到任何文章。', 'my-first-theme' ); ?></p>
</main>
<footer id="site-footer">
<p>©</p>
</footer>
</body>
</html>這個模板使用了多個核心 WordPress 函數，如 wp_head(), the_title(), the_content()函数 get_sidebar() 會嘗試加載一個名爲 sidebar.php 的模板文件。
實現模板層級與功能
WordPress 使用一套名爲“模板層級”的規則來決定爲特定頁面使用哪個模板文件。理解這個層級是開發靈活主題的關鍵。例如，當訪問一篇博客文章時，WordPress 會按順序查找：single-post.php -> single.php -> singular.php -> index.php您可以通过创建这些特定文件来自定义不同页面的外观。
添加文章特色圖像支持
現代主題通常支持“文章特色圖像”（Post Thumbnail）。要啓用這個功能，你需要在主題的 functions.php 文件中使用了 add_theme_support() 函數。首先，在主題目錄下創建 functions.php 文件。
推荐阅读 面向實戰：WordPress主題開發從零到精通的全面指南。
<?php
/**
* 我的第一个主题的功能函数文件
*/
if ( ! function_exists( 'my_first_theme_setup' ) ) :
function my_first_theme_setup() {
// 让 WordPress 管理标题标签
add_theme_support( 'title-tag' );
// 启用文章特色图像支持
add_theme_support( 'post-thumbnails' );
// 为文章和页面设置默认特色图像尺寸
set_post_thumbnail_size( 1200, 800, true );
// 注册一个导航菜单位置
register_nav_menus( array(
'primary' => __( '主导航菜单', 'my-first-theme' ),
) );
}
endif;
add_action( 'after_setup_theme', 'my_first_theme_setup' );引入樣式與腳本文件
正確地將 CSS 和 JavaScript 文件加入隊列是 WordPress 開發的最佳實踐，它避免了資源衝突和重複加載。我們通過 wp_enqueue_style() 以及 wp_enqueue_script() 函數來實現。在 functions.php 中添加一個新的函數。
function my_first_theme_scripts() {
// 引入主样式表
wp_enqueue_style( 'my-first-theme-style', get_stylesheet_uri(), array(), wp_get_theme()->get( 'Version' ) );
// 引入自定义 JavaScript 文件
wp_enqueue_script( 'my-first-theme-navigation', get_template_directory_uri() . '/js/navigation.js', array(), wp_get_theme()->get( 'Version' ), true );
// 如果评论功能开启且有评论，加载评论回复脚本
if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
wp_enqueue_script( 'comment-reply' );
}
}
add_action( 'wp_enqueue_scripts', 'my_first_theme_scripts' );主題進階與最佳實踐
一個完整的主題不僅僅是展示內容，還需要考慮可訪問性、性能和組織結構。將不同的頁面部分（如頁眉、頁腳、側邊欄）分離到獨立的模板文件中，可以使代碼更易於維護。
分離頁眉與頁腳模板
创建 header.php 以及 footer.php 文件。將 index.php 中 <body> 標籤之前的所有內容移到 header.php将 </body> 標籤之前的所有內容移到 footer.php然后，将原来的内容翻译成中文，并详细解释一下： index.php 精簡爲：
<main id="main-content">
<article id="post-<?php the_ID(); ?>" no numeric noise key 1012>
<div class="post-thumbnail">
</div>
<h2><a href="/zh-hant/</?php the_permalink(); ?>"></a></h2>
<div class="entry-content">
</div>
</article>
<p><?php _e( '抱歉，没有找到任何文章。', 'my-first-theme' ); ?></p>
</main>創建側邊欄模板
同樣地，創建一個 sidebar.php 文件，並在其中使用動態側邊欄函數 dynamic_sidebar()首先，你需要在 上注册一个账户。 functions.php 使用中文（简体） register_sidebar() 函數註冊一個側邊欄小工具區域。
function my_first_theme_widgets_init() {
register_sidebar( array(
'name' => __( '主侧边栏', 'my-first-theme' ),
'id' => 'sidebar-1',
'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' );然後，在 sidebar.php 中調用它：
<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
<aside id="secondary" class="widget-area">
<?php dynamic_sidebar( 'sidebar-1' ); ?>
</aside>
<?php endif; ?>总结
通過本文的步驟，你已經成功地從零開始構建了一個基礎但功能完整的 WordPress 自定義主題。你學會了創建核心文件、理解模板層級、使用 functions.php 添加主題功能、以及遵循最佳實踐來組織和加載資源。這個主題具備了顯示文章、支持特色圖像、註冊菜單和側邊欄等基本功能。以此爲起點，你可以繼續探索更復雜的模板文件（如頁面模板、分類模板）、自定義文章類型、主題定製器 API 等，逐漸打造出功能強大、設計專業的 WordPress 主題。記住，實踐是學習的關鍵，嘗試修改代碼並觀察變化，是鞏固知識的最佳方式。
推荐阅读 WordPress主題開發入門指南：從零開始建立自訂主題。
常见问题解答（FAQ）
我的主題在後臺不顯示怎麼辦？
請首先檢查你的主題文件夾是否放置在正確的 wp-content/themes/ 目錄下。然後，確認 style.css 文件頂部的主題信息頭（CSS 註釋）格式是否正確無誤，特別是 “Theme Name:” 這一行必須存在且格式正確。任何拼寫錯誤或格式問題都可能導致 WordPress 無法識別你的主題。
修改了 functions.php 文件導致網站白屏怎麼辦？
“白屏死機”通常是 functions.php 文件中存在語法錯誤（如缺少分號、括號）或致命錯誤導致的。最快速的解決方法是使用 FTP 或文件管理器訪問你的服務器，將出錯的 functions.php 文件重命名（例如改爲 functions.php.bak这样一来，WordPress 就会忽略该文件，网站就能恢复访问了。之后，你可以检查并修正代码中的错误。
如何爲我的主題添加頁面模板？
要創建一個自定義頁面模板，首先在你的主題目錄下新建一個 PHP 文件，例如 template-fullwidth.php在该文件的最顶部，添加以下特定的模板注释：
<?php
/**
* Template Name: 全宽页面
*/然後，你可以在這個文件中編寫你的 HTML 和 PHP 代碼，記得使用 get_header(), get_footer() 等函數。保存後，在 WordPress 後臺編輯或創建頁面時，就可以在“頁面屬性”的“模板”下拉框中看到並選擇“全寬頁面”了。
主題開發中 get_template_part() 函數有什麼用？
get_template_part() 函數是 WordPress 主題開發中用於模塊化代碼的利器。它的作用是加載你主題中的一個特定模板部分。例如，在循環中，你可以用 get_template_part( 'content', get_post_format() ); 來加載 content.php 或更具體的如 content-video.php 文件。這極大地提高了代碼的複用性和可維護性，讓你能輕鬆地爲不同類型的文章內容創建不同的顯示模板。
接下来，我该怎么做呢？
延伸阅读与实用知识
以下内容与本文主题相关，适合继续深入阅读。建议先从与你当前问题最相关的文章开始阅读，之后再逐步扩展到相关主题，这样通常效果会更好。