理解主題嘅基礎結構同核心文件
一個標準WordPress主題嘅核心係一個包含特定文件嘅文件夾，佢位於/wp-content/themes/目錄下。每個主題至少需要兩個核心文件先至可以被WordPress識別同啟動。
首先係style.css，呢個唔單止係主題嘅樣式表，更加係一個資訊檔案。佢頂部嘅註解區塊定義咗主題嘅基本資料，例如主題名稱、作者、描述同版本。冇咗呢個正確格式嘅頭部註解，WordPress 就唔能夠喺後台嘅主題列表中顯示你嘅主題。
另一個必需文件係index.php，佢係主題嘅預設模板檔案。當 WordPress 搵唔到更具體嘅模板嚟顯示內容嗰陣，就會用呢個檔案。
推薦閱讀 WordPress主題開發入門指南：從零開始打造自訂網站外觀。
除此之外，一個功能齊全嘅主題通常會包含以下幾個檔案：header.php、footer.php、sidebar.php同埋functions.php。檔案functions.php最為關鍵，佢係主題嘅「大腦」，容許你添加功能、註冊側邊欄、定義導航選單等等，而唔使修改核心程式碼。
點樣設計一個標準主題信息頭
在style.css文件入面，頭部信息嘅格式必須嚴格遵守。以下係一個標準示例：
/*
Theme Name: 我的第一个主题
Theme URI: https://www.example.com/my-first-theme/
Author: 你的名字
Author URI: https://www.example.com/
Description: 这是一个用于学习WordPress主题开发的简单主题。
Version: 1.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
*/呢啲資料會顯示喺WordPress後台嘅「外觀」->「主題」頁面入面。Text Domain用於國際化，喺你準備將主題翻譯成其他語言嗰陣至關重要。
創建基礎頁面模板結構
模板文件係WordPress主題嘅骨架，佢哋決定咗唔同類型嘅內容點樣展示。理解同運用WordPress嘅模板層級結構係高效開發嘅關鍵。
構建頁面頭部同尾部文件
將頁面中重複嘅部分分離到單獨嘅文件入面，係保持代碼整潔同可維護性嘅最佳實踐。header.php檔案通常包含文檔類型聲明、<head>
推薦閱讀 從零開始學WordPress主題開發：構建自訂網站主題嘅完整指南。
<!DOCTYPE html>
<html no numeric noise key 1005>
<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 1002>
<header id="site-header">
<h1><a href="/yue/</?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></h1>
</header>相應地，footer.php文件包含頁尾內容（例如版權資訊），並結束喺header.php度打開嘅HTML標籤，同時調用wp_footer()函數。
<footer id="site-footer">
<p>©</p>
</footer>
<?php wp_footer(); ?>
</body>
</html>wp_head()同埋wp_footer()呢兩個鈎係必需嘅，佢哋容許插件同WordPress核心本身喺頁面嘅頭同尾分別注入代碼。
實現主頁同文章頁模板
作為主題嘅通用容器，index.php檔案使用WordPress模板標籤嚟引入其他模板部分並循環輸出文章。
<?php get_header(); ?>
<main id="primary">
<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<article id="post-<?php the_ID(); ?>" no numeric noise key 1007>
<h2><a href="/yue/</?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<div class="entry-content">
<?php the_content(); ?>
</div>
</article>
</main>對於單篇文章頁面，你需要創建single.php。其結構與index.php類似，但通常會調用the_post_thumbnail()嚟顯示特色圖像，同埋用the_category()同埋the_tags()嚟顯示分類同標籤。
喺主題函數檔案度擴展功能
functions.php個文件係你為WordPress主題加晒所有自訂功能同設定嘅地方。佢就好似另一個插件，但係專屬你個主題嘅。
設定主題嘅基本支援功能
使用add_theme_support()函數可以宣告主題支援嘅各種功能，例如文章特色圖、自訂Logo、HTML5標記等等。呢啲通常會喺一個after_setup_theme掛鈎觸發嘅函數入面完成。
推薦閱讀 WordPress主題開發完整指南：從零到一構建專業響應式網站。
function my_theme_setup() {
// 启用文章特色图像
add_theme_support( 'post-thumbnails' );
// 注册导航菜单位置
register_nav_menus( array(
'primary' => __( '主导航菜单', 'my-first-theme' ),
'footer' => __( '页脚菜单', 'my-first-theme' ),
) );
// 支持HTML5标记
add_theme_support( 'html5', array( 'search-form', 'comment-form', 'comment-list', 'gallery', 'caption' ) );
}
add_action( 'after_setup_theme', 'my_theme_setup' );實現側邊欄同小工具區域
小工具係WordPress嘅重要組成部分。要為主題創建一個小工具區域（側邊欄），你需要喺functions.php入面用register_sidebar()函數。
function my_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_theme_widgets_init' );註冊之後，你就可以喺sidebar.php模板檔案入面使用dynamic_sidebar( ‘sidebar-1’ )嚟調用呢個區域啦。
集成樣式表同腳本檔案
正確噉樣將CSS樣式表同JavaScript腳本加入主題係保證性能同兼容性嘅關鍵。千祈唔好直接喺模板檔案入面硬性編碼連結，應該用WordPress提供嘅排隊（enqueue）系統。
定義主題嘅主要樣式表
雖然style.css係必需嘅，但係我哋通常只係保留佢嘅頭部信息用嚟識別主題，而將實際樣式寫喺另一個CSS檔案入面，並透過wp_enqueue_style()函數載入。
function my_theme_scripts() {
// 加载主样式表
wp_enqueue_style( 'my-theme-style', get_stylesheet_uri(), array(), '1.0' );
// 加载一个自定义样式表
wp_enqueue_style( 'my-theme-custom-style', get_template_directory_uri() . '/assets/css/custom.css', array('my-theme-style'), '1.0' );
}
add_action( 'wp_enqueue_scripts', 'my_theme_scripts' );get_stylesheet_uri()函數會自動指向主題根目錄下嘅style.css檔案。使用排隊系統容許插件或子主題輕鬆依賴或替換你嘅樣式。
加入與整合自訂腳本
對於JavaScript檔案，做法類似，但你需要使用wp_enqueue_script()函數。一個好嘅實踐係將腳本放喺頁尾加載，以提升頁面渲染速度。
function my_theme_scripts() {
// ... 样式加载代码 ...
// 在页脚加载一个自定义JS文件，并依赖jQuery
wp_enqueue_script( 'my-theme-script', get_template_directory_uri() . '/assets/js/main.js', array( 'jquery' ), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_theme_scripts' );留意最後一個參數true，佢話畀WordPress聽將腳本放喺頁尾。如果你嘅腳本需要喺<head>false。
摘要
WordPress主題開發係一個將設計、HTML、PHP同WordPress核心知識融會貫通嘅過程。從理解主題嘅style.css同埋index.php由呢兩個最基本嘅文件開始，透過建立獨立嘅模板檔案嚟構建頁面結構，再利用強大嘅functions.php檔案為你嘅主題注入各種功能，最後透過標準嘅排隊方式管理樣式同腳本。跟從WordPress嘅編碼標準同模板層級，唔單止可以創建出結構清晰、易於維護嘅主題，仲可以確保佢同成個WordPress生態系統兼容。動手由創建一個最精簡嘅主題資料夾開始，逐步添加功能，係掌握呢項技能嘅最佳途徑。
常見問題
開發一個WordPress主題需要掌握邊啲語言
開發一個基礎嘅WordPress主題，必須掌握HTML、CSS同PHP。HTML用嚟構建頁面結構，CSS用嚟控制樣式同佈局，而PHP係WordPress嘅伺服器端腳本語言，用嚟實現所有動態功能。對於更複雜、互動性更強嘅主題，JavaScript嘅知識亦都必不可少。
點樣可以令我嘅主題支援多語言
令你嘅主題支援多語言嘅過程叫做國際化。你需要喺style.css喺個頭部信息度正確設定Text Domain，並喺functions.php入面用load_theme_textdomain()函數載入語言檔案。
之後，喺主題嘅PHP檔案入面，所有需要翻譯嘅字串都應該用好似__('Hello World', 'my-theme-text-domain')噉樣嘅翻譯函數包住。最後，用好似Poedit呢類工具生成.po同埋.mo語言檔案畀翻譯者用。
響應式設計喺主題開發入面係咪必須嘅
喺2026年嘅今日，響應式設計已經唔係一種「加分項」，而係主題開發嘅必備要求。全球有超過一半嘅網絡流量嚟自流動裝置，一個唔具備響應式設計嘅主題會嚴重損害用戶體驗，同埋對網站喺流動裝置上嘅搜尋引擎排名產生負面影響。
你應該使用CSS媒體查詢等技術，確保你嘅主題佈局能夠自適應唔同尺寸嘅螢幕，由桌面電腦到智能手機，都能夠提供良好嘅瀏覽體驗。好多現代CSS框架（例如Tailwind CSS）亦為快速構建響應式介面提供咗便利。
我嘅主題點樣可以畀用戶透過後台自訂
為用戶提供後台自訂選項主要透過WordPress嘅「自訂器」API實現。你可以喺functions.php入面用$wp_customize->add_setting()同埋$wp_customize->add_control()方法入面添加設定同控件。
例如，你可以加一個選項畀用戶修改網站標題嘅顏色。呢啲設定嘅數值可以喺主題模板檔案入面透過get_theme_mod()函數攞到同輸出。呢個為用戶提供咗唔使編輯程式碼就可以個人化主題外觀嘅能力，大大提升咗主題嘅易用性同專業性。
下一步應該點做?
延伸閱讀及實用知識
以下內容與本文主題相關,適合進一步閱讀。一般而言,最好由與你目前問題最緊密相關的文章開始,然後逐步擴展到周邊主題。