Typecho主题开发 | 一些常用的扩展点

前言

前面我们已经通过两篇文章，简单的介绍了如何为开发一个自己的 Typecho 主题。我本来还想着再简单剖析一下源码，介绍一下 Typecho 有哪些扩展形式，以及预留了哪些扩展点的。但考虑到可能正如一些朋友所说的，会的人不需要看，不会的人又未必能看懂。我自己一想也对，真到了需要开发的时候，大部分情况还是会面向搜索引擎开发，遇到了问题再解决问题，反而会更容易一些。

考虑到前面的几篇文章已经基本把 Typecho 主题的开发思路说的差不多了，剩下的都是一些细节。因此，这篇文章我想干脆把我开发过程中遇到的最常见问题，进行一下梳理，方便大家需要时查询。毕竟，实话实说，Typecho 的官方文档做的确实太差了，很多东西需要翻源码才能了解。

1. 如何使用QQ头像

不知道是出于什么考虑，Typecho 原有的头像服务用的是 Gravatar，而 Gravatar 在国内访问受限不说，用户使用率也很低，因此，很多时候都需要改为国内更常用的 QQ 头像，让用户快速有一个相对熟悉又具有识别性的头像展示，方便交流互动。这时就可以在 functions.php 文件中加入如下代码：

function getGravatar($email, $s = 96, $d = 'mp', $r = 'g')
{
    preg_match_all('/((\d)*)@qq.com/', $email, $vai);
    if (empty($vai['1']['0'])) {
        $url = 'https://cdn.sep.cc/avatar/';
        $url .= md5(strtolower(trim($email)));
        $url .= "?s=$s&d=$d&r=$r";
    } else {
        $url = 'https://q2.qlogo.cn/headimg_dl?dst_uin=' . $vai['1']['0'] . '&spec=100';
    }
    return $url;
}

该头像是通过 QQ 邮箱获取的，也就是说使用 QQ 头像用户需要填写正确的QQ邮箱，然后在需要的地方采用如下方式引用即可，这是 Typecho 最简单的一种扩展方式。

<img src="<?= getGravatar($comments->mail); ?>">

事实上，这种方式不一定需要放在 functions.php 文件，但为了统一管理，还是遵守大家一致的习惯为好。

2. 如何扩展主题配置项

这个在 Hello World 的那篇文章里面已经说过了，这次再简单提一下，因为它是另一种 Typecho 中预留的扩展方式---钩子函数。下面是我们之前写过的代码：

function themeConfig($form)
{
    $hello = new \Typecho\Widget\Helper\Form\Element\Text(
        'hello',
        null,
        null,
        _t('Hello'),
        _t('填写一个说Hello的对象')
    );

    $form->addInput($hello);
}

为什么要这么写呢？在源码的更改外观的方法中，有如下图所示的一段代码：

这段代码大致的意思是：先判断一下 functions.php 文件是否存在，如果存在的话，就继续判断文件中是否存在 themeConfig 方法，如果也存在，就执行 themeConfig 方法完成配置工作。

这也就是为什么 functions.php 文件名不能随便改， themeConfig 方法名必须固定了。像这样的钩子函数还有很多，如themeInit、themeFields等，就不一一列举了。

3. 如何增加文章页自定义字段

就像我开发的导航主题一样，每个文章里面都增加了跳转链接和站点图标的配置字段，这就需要用到 themeFields（另一个钩子函数）了，代码如下：

function themeFields($layout)
{
    if (preg_match("/write-post.php/", $_SERVER['REQUEST_URI'])) {
        $field1 = new Text(
            'field1',
            null,
            null,
            _t('自定义字段'),
            _t('自定义字段')
        );

        $layout->addItem($field1);
    }
}

其中，preg_match("/write-post.php/", $_SERVER['REQUEST_URI']) 是为了让自定义字段只在文章详情页中有效，而不会作用于独立页面或其它页面。

3. 如何实现自定义模板页

这个特别简单，但官方文档也没有说明，所以很多人不知道，具体实现如下图所示。

没错，就是添加一个单独的 PHP 文件，然后将注释中的@package 标记成 custom 就可以了，一个关键字就解决了，这要是靠猜的话，谁能猜得到？

4. 如何自定义插件

Typecho 中的插件是一个很灵活的功能，预留了很丰富的扩展点，玩的好的话可以玩出花来，但我这里不展开说明，只是简单的介绍一下规则。

Typecho 中的插件定义和主题类似，需要在 usr\plugins 目录下新建一个与插件名相同的目录，然后在目录中创建一个 Plugin.php 文件，可以参考内置的 HelloWorld 插件。

我这里也以 HelloWorld 插件为例来简单解释，如下图所示。

元数据和主题相同，也是通过注释实现的；
类名和文件名保持一致，都叫 Plugin，但 Plugin 类需要实现 PluginInterface 接口；
PluginInterface 接口中有四个方法，除了不常用的 personalConfig 之外，其它三个方法语义都非常明确，分别是启用插件时该做什么，禁用插件时该做什么以及如何通过面板配置插件。

而插件的大部分的工作都是在启用插件时实现的，如我自己开发的统计浏览量的插件，核心代码如下图所示：

其中，第38行是在初始化数据库字段，41~43行是在针对 Typecho 预留的接口做自定义实现，而44行是在添加给前端异步调用的HTTP接口。

从上图不难看出，beforeRender、select、footer 就是 Typecho 预留的、可扩展的接口，我们在插件中做了自定义实现。实现完成之后会由 Typecho 自己埋点调用，如这里的 footer 默认就是在 footer.php 文件中调用的，如下图所示。

像这样的接口还有很多，例如还有与 footer 对应的 header，但想要更细致的了解，目前可能就只能通过翻阅源码，或者查看大佬们的经验文章才能实现了。

结语

本文主要介绍了一下自己开发主题或者使用别人开发的主题，但又想略作定制的时候可能会用到的一些小知识点。像增强一下功能、调整一下主题配置、自定义一个模板页或者修改一下插件之类的简单工作，就完全可以自己动手啦！