开发一个 WordPress 主题，本质上是把一个静态 HTML 模板转换成一整套动态的 PHP 模板文件，让用户可以通过后台管理内容，而不是修改代码。整个过程并不神秘，只要理解 WordPress 的模板层级和几个关键函数，你就能把任何设计稿变成 WordPress 主题。

第一步：创建主题文件夹和基本文件

在 /wp-content/themes/ 下创建一个新文件夹，比如 mytheme。里面至少需要两个文件：

style.css（主题信息文件）：

/*
Theme Name: 我的主题
Theme URI: https://你的网站.com
Author: 你的名字
Description: 一个自定义 WordPress 主题
Version: 1.0
License: GPL v2 or later
Text Domain: mytheme
*/

index.php（回退模板）：

<?php
get_header();
if (have_posts()) :
    while (have_posts()) : the_post();
        the_title('<h1>', '</h1>');
        the_content();
    endwhile;
endif;
get_sidebar();
get_footer();
?>

这时候你的主题就已经可以被 WordPress 识别并启用了。

第二步：拆分静态页面

一个标准的 WordPress 主题通常会把 HTML 布局拆分成多个 PHP 文件：

  • header.php：<head> 部分和导航栏

  • footer.php：页脚和闭合标签

  • sidebar.php：侧边栏（如果有）

  • index.php：主循环

  • single.php：单篇文章

  • page.php：独立页面

  • archive.php：归档页（分类、标签、作者、日期）

  • search.php：搜索结果页

  • 404.php：404 错误页

模板层级决定了 WordPress 使用哪个文件来渲染哪种页面。比如，访问一个分类时，WordPress 会依次查找：category-{slug}.php → category-{id}.php → category.php → archive.php → index.php。理解这个层级对开发非常重要。

第三步：在模板中使用 WordPress 函数

把静态内容替换为动态函数。以下是常用函数对照表：

  • 静态标题 → wp_title() 或 the_title()

  • 静态内容 → the_content()

  • 静态描述 → the_excerpt()

  • 静态作者 → the_author()

  • 静态日期 → the_time('F j, Y')

  • 静态分类 → the_category(', ')

  • 静态标签 → the_tags()

  • 静态评论 → comments_template()

  • 静态菜单 → wp_nav_menu(array('theme_location' => 'primary'))

  • 静态搜索框 → get_search_form()

  • 静态站点名称 → bloginfo('name')

  • 静态站点描述 → bloginfo('description')

  • 静态主题目录 URL → get_stylesheet_directory_uri()

  • 静态首页链接 → home_url()

例如，一个典型的 header.php 中的动态 <title> 标签：

<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?php wp_head(); ?>
    <title><?php wp_title('|', true, 'right'); ?><?php bloginfo('name'); ?></title>
</head>

注意 wp_head() 函数必不可少，它让插件和主题可以注入脚本和样式。

第四步：注册主题支持

在 functions.php 中，你需要启用一些 WordPress 功能：

add_theme_support('title-tag'); // 动态标题
add_theme_support('post-thumbnails'); // 特色图片（缩略图）
add_theme_support('html5', array('search-form', 'comment-form', 'comment-list')); // HTML5 支持
add_theme_support('custom-logo'); // 自定义 Logo
add_theme_support('customize-selective-refresh-widgets'); // 小工具实时预览

// 注册导航菜单
register_nav_menus(array(
    'primary' => '主菜单',
    'footer' => '页脚菜单'
));

第五步：添加样式和脚本

用 wp_enqueue_scripts 钩子正确加载 CSS 和 JS，而不是直接在 header.php 中硬编码：

add_action('wp_enqueue_scripts', 'mytheme_scripts');
function mytheme_scripts() {
    wp_enqueue_style('mytheme-style', get_stylesheet_uri());
    wp_enqueue_style('mytheme-main', get_template_directory_uri() . '/css/main.css', array(), '1.0');
    
    wp_enqueue_script('mytheme-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '1.0', true);
    
    if (is_singular() && comments_open() && get_option('thread_comments')) {
        wp_enqueue_script('comment-reply');
    }
}

第六步：创建自定义首页模板

很多网站需要首页有不同的布局。创建一个 front-page.php 文件，它会优先用于网站首页。如果你想分别设置静态首页和博客页，在后台设置 → 阅读中选择对应的页面即可。

第七步：实现小工具（侧边栏）

在 functions.php 中注册侧边栏：

add_action('widgets_init', 'mytheme_widgets_init');
function mytheme_widgets_init() {
    register_sidebar(array(
        'name' => '主侧边栏',
        'id' => 'sidebar-1',
        'before_widget' => '<div id="%1$s" class="widget %2$s">',
        'after_widget' => '</div>',
        'before_title' => '<h3 class="widget-title">',
        'after_title' => '</h3>',
    ));
}

然后在 sidebar.php 中调用：

if (is_active_sidebar('sidebar-1')) {
    dynamic_sidebar('sidebar-1');
}

第八步：处理循环中的分页

在归档页和首页，需要显示分页链接：

the_posts_pagination(array(
    'mid_size' => 2,
    'prev_text' => '« 上一页',
    'next_text' => '下一页 »'
));

或者使用经典的 previous_posts_link() 和 next_posts_link()。

第九步：优化性能和安全

在 functions.php 中移除不需要的功能：

remove_action('wp_head', 'wp_generator'); // 隐藏版本号
remove_action('wp_head', 'wlwmanifest_link'); // 移除 Windows Live Writer 链接
remove_action('wp_head', 'rsd_link'); // 移除 RSD 链接

一个功能完整的 WordPress 主题最少只需要这几个核心文件，但根据设计复杂度的不同，你可能需要 searchform.php、comments.php、taxonomy.php、author.php 等更多模板。建议对照官方 Template Hierarchy 图表来规划你的文件结构。掌握了这套流程之后，你就可以把任何设计稿变成完全可管理的 WordPress 主题了。