要構建一個功能完整嘅WordPress主題，你需要準備一系列核心文件。呢啲文件構成咗主題嘅骨架，每個文件都有佢特定嘅作用。
最基本嘅文件包括：
* `style.css`：主题的样式表，同时也是主题的“身份证”，包含主题名称、作者、描述等元信息。
* `index.php`：主题的主模板文件，是默认的首页和文章列表页模板。
* `header.php`：网站的头部模板，通常包含`<head>`部分和网站顶部的导航区域。
* `footer.php`：网站的底部模板，通常包含版权信息、脚本等。
* `functions.php`：主题的功能文件，用于添加自定义功能、注册菜单、侧边栏等。
我哋由創建`style.css`檔案開始。喺檔案頂部，你需要加一個主題資訊頭部註釋。
/*
Theme Name: 我的第一个主题
Theme URI: https://example.com/my-first-theme
Author: 你的名字
Author URI: https://example.com
Description: 这是一个为学习WordPress主题开发而创建的简单自定义主题。
Version: 1.0
License: GPL v2 or later
Text Domain: my-first-theme
*/跟住，創建`index.php`檔案。喺最基礎嘅版本入面，佢需要引入頭部同底部，並且循環輸出文章。
<?php get_header(); ?>
<main id="main-content">
<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<article id="post-<?php the_ID(); ?>">
<h2><a href="/yue/</?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<div class="entry-content">
<?php the_content(); ?>
</div>
</article>
<p>暫時冇文章。</p>
<?php endif; ?>
</main>
<?php get_footer(); ?>`header.php`同埋`footer.php`檔案就分別包含網站通用嘅頭部同底部HTML結構。`functions.php`檔案就用嚟增強主題功能。
理解模板層級同循環
WordPress採用一套智能嘅模板層級系統，嚟決定點樣顯示唔同嘅頁面內容。例如，當訪問一篇單獨嘅文章嗰陣，WordPress會優先搵`single.php`；訪問一個分類頁面嗰陣，會搵`category.php`；如果呢啲檔案唔存在，就會回退到`archive.php`，最終回退到`index.php`。
乜嘢係主循環
`the loop`是WordPress主题开发的核心概念。它是一段PHP代码，用于从数据库中获取文章内容并将其显示在网页上。你在`index.php`中看到的`while ( have_posts() ) : the_post();`就是循环的开始。在循环内部，你可以使用一系列模板标签来输出文章信息，如`the_title()`, `the_content()`, `the_permalink()`等。
推薦閱讀 WordPress主題開發完全指南：從入門到精通。
創建其他模板檔案
為咗令主題更加專業，你應該創建一啲常用嘅模板檔案。例如，創建`single.php`來單獨顯示文章：
<?php get_header(); ?>
<main>
<?php while ( have_posts() ) : the_post(); ?>
<article>
<h1><?php the_title(); ?></h1>
<div class="post-meta">
发布于： | 作者：
</div>
<div class="post-content">
<?php the_content(); ?>
</div>
</article>
</main>
<?php get_footer(); ?>同樣，你可以創建`page.php`來定義頁面模板，`archive.php`來定義分類、標籤等存檔頁模板。
集成菜单同侧边栏
一個現代主題通常包含可自訂嘅導航菜單同側邊欄小工具區域。呢啲功能需要透過`functions.php`檔案嚟登記同啟動。
登記導航菜單
喺`functions.php`入面加以下代碼，就可以幫主題登記一個菜單位置，例如「主菜單」。
function my_first_theme_setup() {
// 注册一个导航菜单位置
register_nav_menus( array(
'primary' => __( '主菜单', 'my-first-theme' ),
) );
}
add_action( 'after_setup_theme', 'my_first_theme_setup' );註冊後，用戶就可以喺WordPress後台嘅「外觀」->「選單」中，將選單分配到呢個位置。跟住，喺`header.php`中你需要顯示選單嘅地方，加入以下代碼嚟調用呢個選單：
<nav id="site-navigation">
<?php
wp_nav_menu( array(
'theme_location' => 'primary',
'menu_id' => 'primary-menu',
) );
?>
</nav>加入小工具側邊欄
小工具係WordPress一個非常靈活嘅功能。要加入一個側邊欄，同樣需要喺`functions.php`中註冊一個「小工具區域」。
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`）中，使用`dynamic_sidebar()`函数来输出它。
<aside id="secondary" class="widget-area">
<?php dynamic_sidebar( 'sidebar-1' ); ?>
</aside>最後，唔好忘記喺`index.php`或者`single.php`中透過`get_sidebar();`嚟引入呢個側邊欄檔案。
推薦閱讀 WordPress主題開發指南：從零開始構建自訂主題。
加样式同脚本
为了保持代码的整洁和可维护性，不应该直接在HTML中硬编码样式和脚本链接。正确的方式是通过`functions.php`文件，使用`wp_enqueue_style()`和`wp_enqueue_script()`函数将它们加入队列。
引入樣式表
雖然`style.css`係必需嘅，但WordPress唔會自動載入佢。你需要明確噉將佢加入隊列。通常，我哋仲會將主樣式表同重置樣式表分開。
function my_first_theme_scripts() {
// 引入主题的主样式表
wp_enqueue_style( 'my-first-theme-style', get_stylesheet_uri() );
// 引入一个自定义样式表 (假设位于 /assets/css/main.css)
wp_enqueue_style( 'my-first-theme-main', get_template_directory_uri() . '/assets/css/main.css' );
// 引入一个自定义JavaScript文件 (假设位于 /assets/js/navigation.js)
wp_enqueue_script( 'my-first-theme-navigation', get_template_directory_uri() . '/assets/js/navigation.js', array(), false, true );
}
add_action( 'wp_enqueue_scripts', 'my_first_theme_scripts' );使用現代CSS開發實踐
喺2026年嘅前端開發入面，關注響應式設計同無障礙性係至關重要嘅。喺你嘅`style.css`或者獨立嘅`main.css`入面，應該使用媒體查詢嚟確保網站喺唔同裝置上面都顯示得好好睇睇。
/* 基础样式 */
body {
font-family: sans-serif;
line-height: 1.6;
}
/* 响应式导航菜单 */
@media screen and (max-width: 768px) {
#primary-menu {
display: none;
}
/* 移动端菜单样式 */
}測試與除錯
主題開發完成之後，測試係必不可少嘅一環。你需要喺唔同環境、唔同瀏覽器同裝置上進行全面測試。
啟用除錯模式
喺開發過程中，務必開啟WordPress嘅除錯模式。咁樣可以幫你快速發現PHP錯誤、警告同通知。打開`wp-config.php`檔案，搵到或者加入以下代碼：
推薦閱讀 2026 年 WordPress 主題開發進階指南：從零到一構建響應式企業網站。
define( 'WP_DEBUG', true );
define( 'WP_DEBUG_LOG', true ); // 将错误记录到 /wp-content/debug.log 文件
define( 'WP_DEBUG_DISPLAY', false ); // 不在页面上显示错误，更安全主題單元測試
建議使用官方嘅WordPress主題單元測試數據來全面測試你嘅主題。呢套數據包含各種類型嘅文章、頁面、媒體、評論等，可以確保你嘅主題喺遇到各種內容時都能正確顯示，冇遺漏嘅樣式或佈局問題。
摘要
從創建基礎嘅`style.css`同`index.php`文件，到理解模板層級同循環，再到註冊菜單、側邊欄以及安全地加入樣本腳本，你已經行過咗構建一個基礎但完整嘅自定義WordPress主題嘅全過程。記住，主題開發係一個迭代嘅過程，從最簡版本開始，逐步添加功能同完善細節係最佳實踐。持續學習模板標籤、動作鈎同過濾器，將會令你能夠創建出更強大、更靈活嘅主題。
常見問題
開發 WordPress 主題需要咩基本知識?
你需要掌握HTML、CSS同PHP嘅基礎知識。對JavaScript有一定嘅了解都會好有幫助，用於添加互動功能。此外，熟悉WordPress嘅基本概念，例如文章、頁面、分類、標籤、小工具同菜單，係必不可少嘅。
點解我改咗主題之後後台冇生效？
通常係因為瀏覽器緩存或者WordPress緩存搞鬼。首先試下強制重新整理瀏覽器（Ctrl + F5 或 Cmd + Shift + R）。如果仲係唔得，檢查下你有冇正確咁將樣式同腳本加入佢個隊列，同埋確保`functions.php`檔案冇語法錯誤。好少情況下，可能要清除伺服器或者插件嘅緩存先得。
點樣令我嘅主題支援多語言？
你需要做好主题的“国际化”准备。这意味着在代码中所有需要翻译的文本，都应使用翻译函数（如`__()`， `_e()`）进行包装，并为`text-domain`设置一个唯一标识（在`style.css`的头部已定义）。然后，你可以使用如Poedit这样的工具创建`.po`和`.mo`翻译文件，使你的主题能够被轻松翻译成其他语言。
自訂主題同子主題有咩分別？
自訂主題係由零開始獨立開發嘅全新主題。而子主題就係基於一個現有嘅「父主題」，佢會繼承父主題所有功能、樣式同模板檔案。子主題容許你只係修改或者加啲需要嘅部分（通常係樣式同少量模板檔案），唔使郁到父主題。咁樣喺對流行主題進行客製化或者升級嘅時候，可以確保你嘅修改唔會被覆蓋，係一種更安全、更有效率嘅做法。
下一步應該點做?
延伸閱讀及實用知識
以下內容與本文主題相關,適合進一步閱讀。一般而言,最好由與你目前問題最緊密相關的文章開始,然後逐步擴展到周邊主題。