并不是所有的模板文件都会生成将由浏览器呈现的整个内容。 一些模板文件被其他模板文件拉入,如comments.php,header.php,footer.php,sidebar.php和content-{$ slug} .php。 您将通过这些模板文件中的每一个来了解目的以及如何构建它们。
## Header.php
header.php文件完全符合您的期望。 它包含浏览器将为标题呈现的所有代码。 这是一个部分模板文件,因为除非不同的模板文件调用模板标签get_header(),浏览器将不会呈现此文件的内容。
通常网站具有相同的标题,无论您所在的页面或帖子如何。 但是,根据页面的不同,一些网站会有轻微的变化,例如辅助导航或不同的横幅图像。 如果您使用条件标签,您的header.php文件可以处理所有这些变体。
几乎所有的主题都有一个header.php文件,因为这个文件的功能和可维护性几乎要求它的创建。
下面是一个在 twenty fifteen主题中找到的header.php的例子。
```
<!DOCTYPE html>
<html <?php language_attributes(); ?> class="no-js">
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width">
<link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
<!--[if lt IE 9]>
<script src="<?php echo esc_url( get_template_directory_uri() ); ?>/js/html5.js"></script>
<![endif]-->
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<div id="page" class="hfeed site">
<a class="skip-link screen-reader-text" href="#content"><?php _e( 'Skip to content', 'twentyfifteen' ); ?></a>
<div id="sidebar" class="sidebar">
<header id="masthead" class="site-header" role="banner">
<div class="site-branding">
<?php if ( is_front_page() && is_home() ) : ?>
<h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
<?php else : ?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a>
<?php endif; $description = get_bloginfo( 'description', 'display' ); if ( $description || is_customize_preview() ) : ?>
<?php echo $description; ?>
<?php endif; ?>
<button class="secondary-toggle"><?php _e( 'Menu and widgets', 'twentyfifteen' ); ?></button>
</div>
<!-- .site-branding -->
</header>
<!-- .site-header -->
<?php get_sidebar(); ?>
</div>
<!-- .sidebar -->
<div id="content" class="site-content">
```
一些代码首先可能看起来有点令人生畏,但如果我们把它打破了,那就变得简单了。 开幕后,头部被创建。 模板标签wp_head()拉入我们所有的样式和任何出现在头部而不是我们在我们的functions.php文件中排队的页脚的脚本。
接下来,身体被打开,HTML和PHP的混合存在。 您可以在网站品牌div中看到一些基于用户所在页面显示的条件标签。 然后网站导航被拉入。最后,主站点内容div被打开,最接近footer.php文件。
要注意的一个重要的模板标签是在开头body标签中找到的body_class()。 这是一个超级方便的标签,通过根据模板文件和其他正在使用的设置给予您的身体类别,使您的主题更容易设计。
## Footer.php
很像header.php文件,footer.php是一个非常常见的模板文件,大多数主题都使用。 footer.php文件中的代码将不会被渲染,除非另外一个模板文件使用get_footer()模板标签来拉入footer.php。 与标题类似,您可以使用条件标签来创建页脚的变体。
开发人员通常会将脚本区放在页脚中,以便最终用户可以轻松地将不同的内容类型拖放到页脚中。
以下是Twenty Fifteen主题的footer.php文件的示例。
```
</div>
<!-- .site-content -->
<footer id="colophon" class="site-footer" role="contentinfo">
<div class="site-info">
<?php /** * Fires before the Twenty Fifteen footer text for footer customization. * * @since Twenty Fifteen 1.0 */ do_action( 'twentyfifteen_credits' ); ?>
<a href="<?php echo esc_url( __( 'https://wordpress.org/', 'twentyfifteen' ) ); ?>"><?php printf( __( 'Proudly powered by %s', 'twentyfifteen' ), 'WordPress' ); ?></a>
</div>
<!-- .site-info -->
</footer>
<!-- .site-footer -->
</div>
<!-- .site -->
<?php wp_footer(); ?>
</body>
</html>
```
## 404.php
当用户尝试访问您网站上不存在的页面时,会将其导向到index.php页面,除非您已经创建了一个404.php模板。 这是一个好主意,有一些消息,说明页面丢失或不再可用。 创建此模板有助于保持主题的视觉方面一致,并向最终用户提供有用的信息。
这是 twenty fifteen主题的一个404.php模板文件的例子。
```
get_header(); ?>
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<section class="error-404 not-found">
<header class="page-header">
<h1 class="page-title"><?php _e( 'Oops! That page can’t be found.', 'twentyfifteen' ); ?></h1>
</header>
<!-- .page-header -->
<div class="page-content">
<?php _e( 'It looks like nothing was found at this location. Maybe try a search?', 'twentyfifteen' ); ?>
<?php get_search_form(); ?>
</div>
<!-- .page-content -->
</section>
<!-- .error-404 -->
</main><!-- .site-main -->
</div>
<!-- .content-area -->
<?php get_footer(); ?>
```
## Comments.php
comments.php文件处理你所期待的,评论。 这是一个部分模板,被拉入其他模板文件以显示用户在页面或帖子上留下的注释。 几个不同的页面和帖子显示注释,所以有必要在需要时将一个文件拉入。
在注释模板页面上扩展了创建注释中涉及的代码。
## Sidebar.php
很多主题都使用侧边栏来显示小部件。 对于侧边栏工作在主题中,必须注册,然后必须创建侧栏的模板文件。 您将在后面的章节中了解有关注册侧边栏的更多信息。 边栏文件通常具有条件语句和其中的is_active_sidebar('sidebar-name')功能,以确保侧边栏中正在使用窗口小部件,以使空HTML不会不必要地添加到页面中。
这是twenty fifteen的侧边栏模板文件的例子。 注意底部的侧边栏是使用<?php dynamic_sidebar('sidebar-1')拉入的; >。 现在无论如何,插入该边栏的小部件将显示在正在使用此模板的页面上。
```
if ( has_nav_menu( 'primary' ) || has_nav_menu( 'social' ) || is_active_sidebar( 'sidebar-1' ) ) : >
<div id="secondary" class="secondary">
<?php if ( is_active_sidebar( 'sidebar-1' ) ) : >
<div id="widget-area" class="widget-area" role="complementary">
<?php dynamic_sidebar( 'sidebar-1' ); >
</div>
<!-- .widget-area -->
<?php endif; >
</div>
<!-- .secondary -->
<?php endif; >
```
## Content-{$slug}.php
许多主题开发者将他们的模板文件分解成小尺寸的小块。他们经常将包装器和页面架构元素放在诸如page.php,home.php,comments.php等模板文件中,然后将代码显示在另一个模板文件中。输入内容 - {$ slug} .php:常见的例子是content-page.php,content-post.php,content-portfolio.php,content-none.php。这些不是WordPress识别并将以某种方式解释的文件名,而是显示特定类型内容的常见方法。
例如,通常在博客帖子上,您想要显示作者的姓名,帖子的日期以及可能的帖子类别。你也可能有链接到上一个和下一个帖子。该信息在常规页面上是不合适的。类似地,在投资组合页面上,您可能会有一个特色图片或图库,您可能会以不同于说博客或页面的精选图片的方式显示。
您将要使用get_template_part()模板标签来拉入内容 - {$ slug} .php文件。要拉入你的content-page.php文件,你可以调用get_template_part('content','page');
这是一个content-page.php模板文件的twenty fifteen的例子。
```
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<?php // Post thumbnail. twentyfifteen_post_thumbnail(); ?>
<header class="entry-header">
<?php the_title( '
<h1 class="entry-title">', '</h1>
' ); ?>
</header>
<!-- .entry-header -->
<div class="entry-content">
<?php the_content(); ?>
<?php wp_link_pages( array( 'before' => '
<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentyfifteen' ) . '</span>',
'after' => '</div>
',
'link_before' => '<span>',
'link_after' => '</span>',
'pagelink' => '<span class="screen-reader-text">' . __( 'Page', 'twentyfifteen' ) . ' </span>%',
'separator' => '<span class="screen-reader-text">, </span>',
) );
?>
</div>
<!-- .entry-content -->
<?php edit_post_link( __( 'Edit', 'twentyfifteen' ), '
<footer class="entry-footer"><span class="edit-link">', '</span></footer>
<!-- .entry-footer -->' ); ?>
</article>
<!-- #post-## -->
```
- 简介
- 主题开发
- WordPress许可证
- 什么是主题
- 开发环境
- 主题开发示例
- 主题基础
- 模板文件
- 主样式表(style.css)
- 文章类型
- 规划主题文件
- 模板层级
- 模板标签
- 循环
- 主题函数
- 连接主题文件和目录
- 使用CSS和JavaScript
- 条件标签
- 类别,标签和自定义分类
- 模板文件
- 内容模板文件
- 页面模板文件
- 附件模板文件
- 自定义内容类型
- 部分和其他模板文件
- 评论模板
- 分类模板
- 404页面
- 主题功能
- 核心支持的功能
- 管理菜单
- 自定义Headers
- 自定义Logo
- 文章格式
- 置顶文章
- Sidebars
- Widgets
- 导航菜单
- 分页
- 媒体
- Audio
- Images
- Galleries
- Video
- 精选图片和缩略图
- 国际化
- 本地化
- 辅助功能
- 主题选项 – 自定义API
- 定制对象
- 改进用户体验的工具
- 定制JavaScript API
- JavaScript / Underscore.js渲染的自定义控件
- 高级用法
- 主题安全
- 数据消毒/逃避
- 数据验证
- 使用随机数
- 常见漏洞
- 高级主题
- 子主题
- UI最佳实践
- JavaScript最佳做法
- 主题单元测试
- 验证你的主题
- Plugin API Hooks
- 发布你的主题
- 所需的主题文件
- 测试
- 主题评论指南
- 写文档
- 提交你的主题到WordPress.org
- 参考文献
- 模板标签列表
- 条件标签列表
- 编码标准
- HTML编码标准
- CSS编码标准
- JavaScript编码标准
- PHP编码标准
- 插件开发
- 插件开发简介
- 什么是插件
- 插件基础
- 头部要求
- 包括软件许可证
- 启用 / 停用 Hooks
- 卸载方法
- 最佳做法
- 插件安全
- 检查用户功能
- 数据验证
- 保护输入
- 保护输出
- 随机数
- Hooks
- Actions
- Filters
- 自定义Hooks
- 高级主题
- 管理菜单
- 顶级菜单
- 子菜单
- 短代码
- 基本短码
- 封闭短码
- 带参数的短代码
- TinyMCE增强型短码
- 设置
- 设置API
- 使用设置API
- 选项API
- 自定义设置页面
- 元数据
- 管理帖子元数据
- 自定义元数据
- 渲染元数据
- 自定义文章类型
- 注册自定义文章类型
- 使用自定义文章类型
- 分类
- 使用自定义分类
- 在WP 4.2+中使用“split术语”
- 用户
- 创建和管理用户
- 使用用户元数据
- 角色和功能
- HTTP API
- JavaScript
- jQuery
- Ajax
- 服务器端PHP和入队
- Heartbeat API
- 概要
- 计划任务
- 了解WP-Cron计划
- 安排WP-Cron 事件
- 将WP-Cron挂接到系统任务计划程序中
- WP-Cron简单测试
- 国际化
- 本地化
- 如何国际化您的插件
- 国际化安全
- WordPress.org
- 详细插件指南
- 规划您的插件
- 如何使用Subversion
- 插件开发者常见问题
- 开发工具
- Debug Bar 和附加组件
- 辅助插件
- REST API手册
- 资源
- 文章
- 文章修订
- 文章类型
- 文章状态
- 类别
- 标签
- 页面
- 评论
- 分类
- 媒体
- 用户
- 设置
- 使用REST API
- 全局参数
- 分页
- 链接和嵌入
- 发现
- 认证
- 经常问的问题
- 骨干JavaScript客户端
- 客户端库
- 扩展REST API
- 添加自定义端点
- 自定义内容类型
- 修改回应
- 模式
- 词汇表
- 路由和端点
- 控制器类