Typecho模板文档大全之header编写教程

说明本教程属于系列教程，用于讲解Typecho主题编写的相关教程。本篇教程用于讲解header.php文件的编写具体内容。全部文档教程来源于泽泽，官网是https://qqdie.com/。目前，我还

最后更新于2019年02月02日；如遇到问题，请留言及时通知站长；欢迎加入三生三世，讨论各种问题！

说明

本教程属于系列教程，用于讲解Typecho主题编写的相关教程。本篇教程用于讲解header.php文件的编写具体内容。全部文档教程来源于泽泽，官网是 https://qqdie.com/。目前，我还没写过主题。不过魔改了大概四份主题，所以对这些也算懂一点吧。

header.php

用于编写Typecho主题的头部文件，一般引用css以及meta等头部信息，导航也会放在这个文件里。

编码

打开这个文件，见到的第一个php代码就是：

<meta charset="<?php $this->options->charset(); ?>">

调用默认的编码，现在最经常用的大都是utf-8吧。所以我通常是直接写成utf-8，省去php处理时间。

页面标题

<?php $this->archiveTitle(array(
            'category'  =>  _t('分类 %s 下的文章'),
            'search'    =>  _t('包含关键字 %s 的文章'),
            'tag'       =>  _t('标签 %s 下的文章'),
            'author'    =>  _t('%s 发布的文章')
        ), '', ' - '); ?><?php $this->options->title(); ?>

<?php $this->archiveTitle(); ?>是当前页面的标题，<?php $this->options->title(); ?>是网站的标题。

导入样式

<link rel="stylesheet" href="<?php $this->options->themeUrl('style.css'); ?>">

其中style.css是样式文件相对模板目录的路径和文件名。

其它HTML头部信息

<?php $this->header(); ?>

这是typecho的自有函数，会输出HTML头部信息；同时这个也是头部插件接口，有了它插件可以向网站头部插入css或者js代码。

网站名称与logo

<?php if ($this->options->logoUrl): ?>
<a id="logo" href="<?php $this->options->siteUrl(); ?>">
<img src="<?php $this->options->logoUrl() ?>" alt="<?php $this->options->title() ?>" />
</a>
<?php else: ?>
<a id="logo" href="<?php $this->options->siteUrl(); ?>"><?php $this->options->title() ?></a>
<p class="description"><?php $this->options->description() ?></p>
<?php endif; ?>

第一句的if判断是判断模板是否通过模板设置设置了logo的地址，如果设置了就显示logo图片，否则就显示博客标题。
<?php $this->options->siteUrl(); ?>是网站地址
<?php $this->options->title() ?>是网站名字
<?php $this->options->description() ?>是网站描述。
logo部分的讲解将会再functions.php章节中详细讲解。

站内搜索

<form id="search" method="post" action="<?php $this->options->siteUrl(); ?>" role="search">
<input type="text" id="s" name="s" class="text" placeholder="<?php _e('输入关键字搜索'); ?>" />
<button type="submit" class="submit"><?php _e('搜索'); ?></button>
</form>

当你的文章很多很多，这个搜索就必不可少。

页面导航

<nav id="nav-menu" class="clearfix" role="navigation">
<a<?php if($this->is('index')): ?> class="current"<?php endif; ?> href="<?php $this->options->siteUrl(); ?>"><?php _e('首页'); ?></a>
<?php $this->widget('Widget_Contents_Page_List')->to($pages); ?>
<?php while($pages->next()): ?>
<a<?php if($this->is('page', $pages->slug)): ?> class="current"<?php endif; ?> href="<?php $pages->permalink(); ?>" title="<?php $pages->title(); ?>"><?php $pages->title(); ?></a>
<?php endwhile; ?>
</nav>

其中<?php $this->options->siteUrl(); ?>是网站地址，然后下面的while循环是循环输出独立页面的，其中<?php $pages->permalink(); ?>是独立页面的超链接，<?php $pages->title(); ?>是独立页面的标题。