记录下对 Typecho 插件的使用，以及对主题的修改。

这些修改主要是让自己用的舒服，并且实现一点原主题没有实现的功能，包含且不至于支持emoji、导航添加 icon、404 页面的内容、访客显示、加载时间、网站地图、建站时间、留言算数验证、内容过期提醒、UA 及 IP 显示、书单影单页面等。

在不破坏原主题风格的情况下，丰富一点我要的东西，仅此而已。其实之前有写文章介绍过某些功能的实现，这篇文章做了汇总，且把之前没介绍过的内容也做了统一的介绍。

状态

基于 Typecho 1.1 (17.10.30)

前台主题 Initial 2.5.2（有一定修改，下有具体修改记录）

后台主题 Purple

网站部署在阿里云虚拟主机

域名托管于阿里云

PHP 版本为 5.6

插件

Access 获取访客信息，生成统计图表。

BlockIP 禁止讨厌鬼访问网站，眼不见心不烦

CodeStyle 代码显示样式风格 可多用户不同风格

Comment2Wechat 微信推送评论通知

DoubanBoard 在博客上展示你的豆瓣书单与豆瓣影单

Login Designer 博客登录/注册页面美化插件，提供多种美化样式

PageViews 网站浏览量统计显示

Pio 一个简易的 Live2D 插件，看板娘

ShortLinks 把外部链接转换为内部链接

Sitemap Google Sitemap 生成器

Sticky 文章置顶

TeStore 读取Github上维护的专用表格实现插件仓库各项功能

APlayer for Typecho | Meting APlayer 播放在线音乐

主题

支持 emoji

这个不是主题的问题，需要调整数据库：Typecho 开启 emoji 表情支持功能

icon 修改

在 iconfont 创建项目，加入需要的 icon 图标，生成 Font class 的 css 链接，访问后获取代码，复制粘贴到 主题-设置外观-自定义样式 中。

一级导航

首页
  • archive.php 文件的 首页 文字前的 a 标签内添加 class="iconfont iconhome" ；
  • header.php 文件的 首页 文字前的 a 标签内添加 class="iconfont iconhome" ；
  • post.php 文件的 首页 文字前的 a 标签内添加 class="iconfont iconhome" ；
其他

主题-设置外观-导航栏设置 全部选中，显示并合并分类和页面。

在分类的合并显示名称前添加 <i class="iconfont iconnews"></i> ；

在页面的合并显示名称前添加 <i class="iconfont iconfolderopen-fill"></i> ；

在 post.php 文件的 微信 文字前的 a 标签内添加 class="iconfont iconicon-test" ；

在 post.php 文件的 支付宝 文字前的 a 标签内添加 class="iconfont iconalipay" 。

404 标题和内容

<h2 class="post-title">好像是丢了些什么</h2>
<p>实在找不到了</p>
<p>我们看看别的吧</p>
<a href="https://blog.46cbm.top/compilling.html">归档</a>

访客显示 | 加载时间 | 网站地图 | 建站时间

功能实现

  • 访客显示配合插件 PageViews。
  • 网站地图配合插件 Sitemap。
  • 加载时间配合功能代码，在 functions.php 文件中最后面添加：
 /* 加载时间功能代码 */

function timer_start() {
    global $timestart;
    $mtime     = explode( ' ', microtime() );
    $timestart = $mtime[1] + $mtime[0];
    return true;
}
timer_start();
function timer_stop( $display = 0, $precision = 3 ) {
    global $timestart, $timeend;
    $mtime     = explode( ' ', microtime() );
    $timeend   = $mtime[1] + $mtime[0];
    $timetotal = number_format( $timeend - $timestart, $precision );
    $r         = $timetotal < 1 ? $timetotal * 1000 . " ms" : $timetotal . " s";
    if ( $display ) {
        echo $r;
    }
    return $r;
}

建站时间配合功能代码，在 functions.php 文件最后面添加：

 /* 建站时间功能代码 */

// 设置时区
date_default_timezone_set('Asia/Shanghai');
/**
 * 秒转时间，格式 年 月 日 时 分 秒
 */
function getBuildTime() {
    // 在下面按格式输入本站创建的时间
    $site_create_time = strtotime('2019-12-20 20:00:00');
    $time = time() - $site_create_time;
    if (is_numeric($time)) {
        $value = array(
            "years" => 0, "days" => 0, "hours" => 0,
            "minutes" => 0, "seconds" => 0,
        );
        if ($time >= 31556926) {
            $value["years"] = floor($time / 31556926);
            $time = ($time % 31556926);
        }
        if ($time >= 86400) {
            $value["days"] = floor($time / 86400);
            $time = ($time % 86400);
        }
        if ($time >= 3600) {
            $value["hours"] = floor($time / 3600);
            $time = ($time % 3600);
        }
        if ($time >= 60) {
            $value["minutes"] = floor($time / 60);
            $time = ($time % 60);
        }
        $value["seconds"] = floor($time);
        echo '<span class="btime">'.$value['years'].
        '年'.$value['days'].
        '天'.$value['hours'].
        '小时'.$value['minutes'].
        '分</span>';
    } else {
        echo '';
    }
}

显示

修改 footer.php 文件，在 <?php if ($this->options->ICPbeian): ?> 前增加

/* 访客显示 | 加载时间 | 网站地图 | 建站时间 */

<p>&copy; <?php echo date('Y'); ?>
    <a href="<?php $this->options->siteUrl(); ?>">
        <?php $this->options->title(); ?>
    </a>. 
    Powered by 
    <a href="https://blog.46cbm.top/go/typecho/" target="_blank">
        Typecho
    </a>
        &amp; 
    <a href="https://blog.46cbm.top/go/initial/" target="_blank">
        Initial
    </a>
        .
</p>
 /* 显示访问人数 */
风风雨雨<?php getBuildTime(); ?>，
<?php PageViews_Plugin::showPageViews('你是第','个来看我的人！');?>
 /* 显示加载时间 */
 | 加载<?php echo timer_stop();?>
 /* 显示网站地图 */
 | <a href="https://blog.46cbm.top/sitemap.xml">网站地图</a>

鼠标特效

在 footer.php 文件的 </body> 标签前添加功能代码：

/* 鼠标特效代码 */

<script type="text/javascript"> 
var a_idx = 0; 
jQuery(document).ready(function($) { 
    $("body").click(function(e) { 
        var a = new Array("氤氲", "缱绻", "旖旎", "潋滟", "荼蘼", "踯躅", "陟遐" ,"娉婷", "伶俜", "知命不惧", "日日自新", "谢观"); 
        var $i = $("<span/>").text(a[a_idx]); 
        a_idx = (a_idx + 1) % a.length; 
        var x = e.pageX, 
        y = e.pageY; 
        $i.css({ 
            "z-index": 999999999999999999999999999999999999999999999999999999999999999999999, 
            "top": y - 30, 
            "left": x - 10, 
            "position": "absolute", 
            "font-weight": "bold", 
            "color": "#fbb331" 
        }); 
        $("body").append($i); 
        $i.animate({ 
            "top": y - 160, 
            "opacity": 50 
        }, 
        1500, 
        function() { 
            $i.remove(); 
        }); 
    }); 
}); 
</script>

留言验证

功能实现

配合功能代码，在 functions.php 文件中最后面添加：

 /* 留言验证功能代码 */

function spam_protection_math(){
    $num1=rand(1,49);
    $num2=rand(1,49);
    echo "<label style=\"line-height:30px;\" for=\"math\"><code>$num1</code>+<code>$num2</code> = </label>\n";
    echo "<input type=\"text\" name=\"sum\" class=\"text\" value=\"\" size=\"25\" tabindex=\"4\" style=\"width:130px;float:right;\" placeholder=\"计算结果：\">\n";
    echo "<input type=\"hidden\" name=\"num1\" value=\"$num1\">\n";
    echo "<input type=\"hidden\" name=\"num2\" value=\"$num2\">";
}
function spam_protection_pre($comment, $post, $result){
    $sum=$_POST['sum'];
    switch($sum){
        case $_POST['num1']+$_POST['num2']:
        break;
        case null:
        throw new Typecho_Widget_Exception(_t('对不起: 请输入验证码。<a href="javascript:history.back(-1)">返回上一页</a>','评论失败'));
        break;
        default:
        throw new Typecho_Widget_Exception(_t('对不起: 验证码错误，请<a href="javascript:history.back(-1)">返回</a>重试。','评论失败'));
    }
    return $comment;
}

找到代码：

function themeInit($archive) {
    $options = Helper::options();
    $options->commentsAntiSpam = false;
    if ($options->PjaxOption || FindContents('page-whisper.php', 'commentsNum', 'd')) {
        $options->commentsOrder = 'DESC';
        $options->commentsPageDisplay = 'first';
    }
    if ($archive->is('single')) {
        $archive->content = hrefOpen($archive->content);
        if ($options->AttUrlReplace) {
            $archive->content = UrlReplace($archive->content);
        }
        if ($archive->fields->catalog) {
            $archive->content = createCatalog($archive->content);
        }
    }
}

加上 $comment = spam_protection_pre($comment); ，改成：

function themeInit($archive) {
    $options = Helper::options();
    $options->commentsAntiSpam = false;
    if ($options->PjaxOption || FindContents('page-whisper.php', 'commentsNum', 'd')) {
        $options->commentsOrder = 'DESC';
        $options->commentsPageDisplay = 'first';
    }
    if ($archive->is('single')) {
        $archive->content = hrefOpen($archive->content);
        if ($options->AttUrlReplace) {
            $archive->content = UrlReplace($archive->content);
        }
        if ($archive->fields->catalog) {
            $archive->content = createCatalog($archive->content);
        }
    }
    $comment = spam_protection_pre($comment);
}

显示

在 comments.php 文件的 <?php endif; ?> 前添加功能代码：

/* 算数验证 */
<?php spam_protection_math();?>

文章内容过期提醒

老方案

在 post.php 文件的 <div class="post-content"> 前添加功能代码：

<blockquote><p>本文最后更新时间为：<?php echo date('Y 年 m 月 d 日 H:i:s' , $this->modified); ?>，部分内容具有时效性，请自行斟酌确认。</p></lockquote>

以上方案已取消。

新方案

在 post.php 文件的 <li><?php Postviews($this); ?></li> 后添加：

<li><?php 
$s = date('Y/n/j', $this->modified);
$t = (time() - strtotime($s)) / 86400;
echo ceil($t - 1).'天前更新';
?></li>
文章目录