如何将WordPress现有首页index.php改为独立页面architects.php？

1. 将原首页转为独立页面模板（architects.php） #

• 在VS Code中打开主题目录下的index.php，完整复制所有代码
• 在主题目录新建文件architects.php，粘贴复制的代码
• 在architects.php的最开头（<?php get_header(); ?>之前）添加WordPress自定义模板标识：

  <?php /* Template Name: Architects Page */ ?>
  

• 保存文件，此时WordPress可识别这是一个可选择的页面模板

2. 创建新的首页模板（front-page.php） #

• 在主题目录新建front-page.php文件，写入基础结构和四个锚点按钮：

  <?php get_header(); ?>
  
  <div class="home-buttons-container">
      <!-- 指向Architects页面的按钮 -->
      <a href="<?php echo get_permalink(get_page_by_path('architects')); ?>" class="home-button">Architects</a>
      <!-- 指向其他分类页面的按钮（示例：分类slug为designers） -->
      <a href="<?php echo get_category_link(get_category_by_slug('designers')->term_id); ?>" class="home-button">Designers</a>
      <!-- 第三个分类按钮示例 -->
      <a href="<?php echo get_category_link(get_category_by_slug('projects')->term_id); ?>" class="home-button">Projects</a>
      <!-- 第四个分类按钮示例 -->
      <a href="<?php echo get_category_link(get_category_by_slug('news')->term_id); ?>" class="home-button">News</a>
  </div>
  
  <?php get_footer(); ?>
  

• 可根据需求添加CSS样式美化按钮，确保与站点风格统一

3. 后台配置页面与首页设置 #

• 登录WordPress后台（http://localhost/你的站点/wp-admin）
• 创建Architects页面：进入「页面」→「新建页面」，标题设为Architects，右侧「页面属性」→「模板」选择「Architects Page」，点击「发布」
• 设置首页：进入「设置」→「阅读」，「首页显示」选择「静态页面」：
  • 「首页」选择新建的首页页面（若未创建，先新建空白页面Home并发布，WordPress会自动用front-page.php作为其模板）
  • 「文章页」可选择任意页面（不影响当前设置）
• 保存设置

4. 验证效果 #

• 访问站点首页，应显示四个按钮，点击「Architects」可跳转到保留原设计和动画的页面
• 检查原JavaScript变量（bgvidsrc等）及动画效果是否正常加载，确保功能与样式和之前一致

注意事项 #

• 无需删除原index.php，WordPress会在无对应模板时 fallback 到它，但当前设置已指定front-page.php为首页、architects.php为独立页面模板，不会产生冲突
• 若按钮链接失效，检查页面/分类的slug是否与代码匹配，或直接替换为后台页面的永久链接

内容的提问来源于stack exchange，提问作者Jose