Skip to content

毛俊的博客

Typecho默认主题功能增强

typecho1 min read

在之前的文章Typecho默认主题优化中对Typecho的默认主题进行了一些页面显示优化。在此基础上,将在这篇文章中增加一些增强功能,让Typecho在使用上更加的人性化。

### 一言 Typecho默认主题的右侧搜索框下有些空白区,显示有点空白。增加一言功能,让页面每次刷新或打开新页面时都可以显示一言,增加页面的趣味性。一言可以采用网络接口的方式或者读取本地的方式。这里我们采用本地读取一言,方便后期维护。

在默认的主题下,编辑function.php文件,追加以下内容:

1/**
2* 每日一句
3*
4*/
5
6
7function one_sentence(){
8
9$filename = 'data.dat';
10header('Content-type: text/html; charset=utf-8');
11
12if(!file_exists($filename)) {
13 die($filename . ' 数据文件不存在');
14}
15
16$data = file_get_contents($filename);
17$data = explode(PHP_EOL, $data);
18$result = $data[array_rand($data)];
19$result = str_replace(array("\r","\n","\r\n"), '', $result);
20
21echo $result;
22}

编辑header.php文件,找到以下内容所在的行:

1<nav id="nav-menu" class="clearfix" role="navigation">
2</nav>

</nav>之前增加函数调用语句:

1<span class="kit-hidden-tb" style="float:right"> <?php echo one_sentence();?> </span>

class的样式是让一言在小屏幕不显示,宽屏时右对齐。

根目录添加data.dat文件,添加需要显示的一言内容:

1往者不可谏,来着犹可追。——《论语·微子》
2多行不义必自毙。——《左传》
3敏而好学,不耻下问。——《论语·公冶长》
4避其锐气,击其惰归。——《孙子兵法·军争》
5十年树木,百年树人。——《管子·权修》
6居安思危,思则有备,有备无患。——《左传》
7天时不如地利,地利不如人和。——《孟子·公孙丑》
8人谁无过?过而能改,善莫大焉。——《论语》
9信言不美,美言不信。——老子
10满招损,谦受益。——《尚书·大禹谟》
11高岸为谷,深谷为陵。——《诗经·小雅》
12天作孽,犹可违,自作孽,不可活。——《尚书》
13言之无文,行而不远。——《左传》
14三军可夺帅也,匹夫不可夺志也。——《论语·子罕》
15天行健,君子以自强不息。——《周易·乾·象》
16皮之不存,毛将焉附。——《左传》
17路漫漫其修远兮,吾将上下而求索。——屈原《离骚》
18长太息以掩涕兮,哀民生之多艰。——屈原《离骚》
19人而无仪,不死何为。——《诗经·鄘风》
20捐躯赴国难,视死忽如归。——曹植《白马篇》
21天下之事常成于困约,而败于奢靡。——陆游
22知之者不如好之者,好之者不如乐之者。——《论语·雍也》
23志当存高远。——诸葛亮《诫外生书》
24不去庆父,鲁难未已。——《左传》
25老吾老,以及人之老;幼吾幼,以及人之幼。——《孟子·梁惠王下》
26博学之,审问之,慎思之,明辨之,笃行之。——《中庸》
27人非圣贤,孰能无过。——《训俗遗规》
28亦余心之所善兮,虽九死其犹未悔。——《屈原·离骚》
29若要功夫深,铁杵磨成针。——曹学《蜀中广记·上川南道彭山县》
30少壮不努力,老大徒悲伤。——汉乐府古辞《长歌行》
31穷则独善其身,达则兼济天下。——《孟子·尽心上》
32仁者见仁,智者见智。——《易经·系辞上》
33青,取之于蓝而青于蓝;冰,水为之而寒于水。——《荀子·劝学》
34千羊之皮,不如一狐之腋。——《史记》
35余将董道而不豫兮,固将重昏而终身。——《屈原·涉江》
36高山仰止,景行行止。——《诗经·小雅·车辖》
37锲而舍之,朽木不折;锲而不舍,金石可镂。——《荀子·劝学》
38不傲才以骄人,不以宠而作威。——诸葛亮
39尺有所短;寸有所长。物有所不足;智有所不明。——屈原《卜居》
40言必信,行必果。——《论语·子路》
41有志者事竟成。——《后汉书·耿列传》
42其身正,不令而行;其身不正,虽令不从。——论语·子路
43三人行,必有我师焉:择其善而从之,其不善者而改之。——《论语·述而》
44非学无以广才,非志无以成学。——《三国·诸葛亮·诫子书》
45绳锯木断,水滴石穿。——罗大经《鹤林玉露》
46君子坦荡荡,小人长戚戚。——孔子
47老当益壮,宁知白首之心;穷且益坚,不坠青云之志。——王勃
48尺有所短,寸有所长。——《史记》
49他山之石,可以攻玉。——《诗经·小雅·鹤鸣》
50苟余心之端直兮,虽僻远其何伤?——《屈原·涉江》
51人有不为也,而后可以有为。——《孟子·离娄下》
52路漫漫其修远今,吾将上下而求索。——屈原
53孔子登东山而小鲁,登泰山而小天下。——《孟子·尽心上》
54积土而为山,积水而为海。——《荀子·儒效》
55生于忧患,死于安乐。——《孟子·告子下》
56知足不辱,知止不殆。——老子
57桃李不言,下自成蹊。——《史记》
58傲不可长,欲不可纵,乐不可极,志不可满。——魏徵
59既来之,则安之。——《论语·季氏》
60知己知彼,百战不殆。——《孙子兵法·谋攻》
61真者,精诚之至也,不精不诚,不能动人。——《庄子·渔夫》
62独学而无友,则孤陋而寡闻。——《礼记·杂记》
63勿以恶小而为之,勿以善小而不为。惟贤惟德,能服于人。——刘备

注意:一言的内容不要过长,不然页面显示效果不好。

保存后刷新页面即可查看效果。

博客总访问

为了统计博客一共被访问了多少次,可以在页面底部增加统计功能。在默认主题目录下编辑function.php内容,追加以下内容:

1function total_view()
2 {
3 $db = Typecho_Db::get();
4 $row = $db->fetchAll('SELECT SUM(VIEWS) FROM `typecho_contents`');
5 echo number_format($row[0]['SUM(VIEWS)']);
6 }

然后编辑footer.php文件,在</footer>标签前添加:

1<?php _e('Total UV): '); ?><?php get_total_view($this); ?>.

保存后刷新页面即可查看效果。

文章更新时间:

Typecho默认的文章页面只显示创建时间,而没有更新时间。不方便浏览者知晓页面内容是否有更新变化。同样在默认主题的目录下编辑post.php文件,在<ul class="post-meta"></ul>下找到之前的时间文字并将其修改为发布时间,然后在下面增加一行代码显示更新时间

1<li><?php _e('更新时间: '); ?><?php echo date('Y-m-d H:i:s', $this->modified);?></li>

保存刷新页面查看。

归档页自定义模板

Typecho默认的归档页面是有主页显示效果类似的。里面包含了文章内容,为了更直接的查看文章归档,可以只保留标题和评论数显示。在默认主题目录下新建timeline.php(保留原先的archive.php)文件:

1<?php if (!defined('__TYPECHO_ROOT_DIR__')) exit; ?>
2<?php
3/**
4 * archive
5 *
6 * @package custom
7 */
8 $this->need('header.php'); ?>
9
10<div class="col-mb-12 col-12" id="main" role="main">
11 <article class="post" itemscope itemtype="http://schema.org/BlogPosting">
12 <h1 class="post-title" itemprop="name headline"><a itemprop="url" href="<?php $this->permalink() ?
13>"><?php $this->title() ?></a></h1>
14
15<?php if($this->user->hasLogin()):?>
16<a href="<?php $this->options->adminUrl(); ?>write-page.php?cid=<?php echo $this->cid;?>" >编辑</a>
17<?php endif;?>
18
19
20 <div class="post-content" itemprop="articleBody">
21<?php $this->widget('Widget_Contents_Post_Recent', 'pageSize=10000')->to($archives);
22 $year=0; $mon=0; $i=0; $j=0;
23 $output = '<div id="archives">';
24 while($archives->next()):
25 $year_tmp = date('Y',$archives->created);
26<?php $this->widget('Widget_Contents_Post_Recent', 'pageSize=10000')->to($archives);
27<?php if (!defined('__TYPECHO_ROOT_DIR__')) exit; ?>
28<?php
29/**
30 * archive
31 *
32 * @package custom
33 */
34 $this->need('header.php'); ?>
35
36<div class="col-mb-12 col-12" id="main" role="main">
37 <article class="post" itemscope itemtype="http://schema.org/BlogPosting">
38 <h1 class="post-title" itemprop="name headline"><a itemprop="url" href="<?php $this->permalink() ?
39>"><?php $this->title() ?></a></h1>
40
41<?php if($this->user->hasLogin()):?>
42<a href="<?php $this->options->adminUrl(); ?>write-page.php?cid=<?php echo $this->cid;?>" >编辑</a>
43<?php endif;?>
44
45
46 <div class="post-content" itemprop="articleBody">
47<?php $this->widget('Widget_Contents_Post_Recent', 'pageSize=10000')->to($archives);
48 $year=0; $mon=0; $i=0; $j=0;
49 $output = '<div id="archives">';
50 while($archives->next()):
51 $year_tmp = date('Y',$archives->created);
52 $mon_tmp = date('m',$archives->created);
53 $y=$year; $m=$mon;
54 if ($mon != $mon_tmp && $mon > 0) $output .= '</ul></li>';
55 if ($year != $year_tmp && $year > 0) $output .= '</ul>';
56 if ($year != $year_tmp) {
57 $year = $year_tmp;
58 $output .= '<h3>'. $year .' 年</h3><ul>';
59 }
60 if ($mon != $mon_tmp) {
61 $mon = $mon_tmp;
62 $output .= '<li><span>'. $mon .' 月</span><ul>';
63 }
64 $output .= '<li>'.date('d日: ',$archives->created).'<a href="'.$archives->permalink .'">'. $archiv
65es->title .'</a> <em>('. $archives->commentsNum.')</em></li>';
66 endwhile;
67 $output .= '</ul></li></ul></div>';
68 echo $output;
69?>
70 </div>
71 </article>
72</div><!-- end #main-->
73
74<?php $this->need('sidebar.php'); ?>
75<?php $this->need('footer.php'); ?>

然后登入到Typecho的管理后台,新建独立页面,然后选择默认为timeline,保存后点击新建的页面名称查看效果。

分页标题

Typecho的文章分页标题默认都是一样的,为了更好的区分页面。可以在不同页面中显示不同的页面标题。编辑header.php文件,在<title></title>尾部添加以下内容:

1<?php if($this->_currentPage>1) echo ' _ 第 '.$t
2his->_currentPage.' 页 '; ?>

保存后刷新页面即可查看到效果。

浏览器标识

可以给访问的用户添加浏览器标识,在默认主题目录下编辑function.php文件,追加以下内容:

1/** 获取浏览器信息 */
2function getBrowser($agent)
3{ $outputer = false;
4 if (preg_match('/MSIE\s([^\s|;]+)/i', $agent)) {
5 $outputer = '<i></i> IE浏览器';
6 } else if (preg_match('/FireFox\/([^\s]+)/i', $agent)) {
7 $outputer = '<i></i> 火狐浏览器';
8 } else if (preg_match('/Maxthon([\d]*)\/([^\s]+)/i', $agent)) {
9 $outputer = '<i></i> 傲游浏览器';
10 } else if (preg_match('#SE 2([a-zA-Z0-9.]+)#i', $agent)) {
11 $outputer = '<i></i> 搜狗浏览器';
12 } else if (preg_match('#360([a-zA-Z0-9.]+)#i', $agent)) {
13 $outputer = '<i></i> 360浏览器';
14 } else if (preg_match('/Edge([\d]*)\/([^\s]+)/i', $agent)) {
15 $outputer = '<i></i> Edge';
16 } else if (preg_match('/EdgiOS([\d]*)\/([^\s]+)/i', $agent)) {
17 $outputer = '<i></i> Edge';
18 } else if (preg_match('/UC/i', $agent)) {
19 $outputer = '<i></i> UC浏览器 ';
20 }else if (preg_match('/OPR/i', $agent)) {
21 $outputer = '<i></i> 欧朋浏览器';
22 } else if (preg_match('/MicroMesseng/i', $agent)) {
23 $outputer = '<i></i> 微信内嵌浏览器';
24 } else if (preg_match('/WeiBo/i', $agent)) {
25 $outputer = '<i></i> 微博内嵌浏览器';
26 } else if (preg_match('/QQ/i', $agent)||preg_match('/QQBrowser\/([^\s]+)/i', $agent)) {
27 $outputer = '<i></i> QQ浏览器';
28 } else if (preg_match('/MQBHD/i', $agent)) {
29 $outputer = '<i></i> QQ浏览器 ';
30 } else if (preg_match('/BIDU/i', $agent)) {
31 $outputer = '<i></i> 百度浏览器';
32 } else if (preg_match('/LBBROWSER/i', $agent)) {
33 $outputer = '<i></i> 猎豹浏览器';
34 } else if (preg_match('/TheWorld/i', $agent)) {
35 $outputer = '<i></i> 世界之窗浏览器';
36 } else if (preg_match('/XiaoMi/i', $agent)) {
37 $outputer = '<i></i> 小米浏览器';
38 } else if (preg_match('/UBrowser/i', $agent)) {
39 $outputer = '<i></i> UC浏览器 ';
40 } else if (preg_match('/mailapp/i', $agent)) {
41 $outputer = '<i></i> email内嵌浏览器';
42 } else if (preg_match('/2345Explorer/i', $agent)) {
43 $outputer = '<i></i> 2345浏览器';
44 } else if (preg_match('/Sleipnir/i', $agent)) {
45 $outputer = '<i></i> 神马浏览器';
46 } else if (preg_match('/YaBrowser/i', $agent)) {
47 $outputer = '<i></i> Yandex浏览器';
48 } else if (preg_match('/Opera[\s|\/]([^\s]+)/i', $agent)) {
49 $outputer = '<i></i> Opera浏览器';
50 } else if (preg_match('/MZBrowser/i', $agent)) {
51 $outputer = '<i></i> 魅族浏览器';
52 } else if (preg_match('/VivoBrowser/i', $agent)) {
53 $outputer = '<i></i> vivo浏览器';
54 } else if (preg_match('/Quark/i', $agent)) {
55 $outputer = '<i></i> 夸克浏览器';
56 } else if (preg_match('/mixia/i', $agent)) {
57 $outputer = '<i></i> 米侠浏览器';
58 }else if (preg_match('/fusion/i', $agent)) {
59 $outputer = '<i></i> 客户端';
60 } else if (preg_match('/CoolMarket/i', $agent)) {
61 $outputer = '<i></i> 基安内置浏览器';
62 } else if (preg_match('/Thunder/i', $agent)) {
63 $outputer = '<i></i> 迅雷内置浏览器';
64 } else if (preg_match('/Chrome([\d]*)\/([^\s]+)/i', $agent)) {
65 $outputer = '<i></i> Chrome ';
66 } else if (preg_match('/safari\/([^\s]+)/i', $agent)) {
67 $outputer = '<i></i> Safari';
68 } else{
69 return false;
70 }
71 return $outputer;
72}
73/** 获取操作系统信息 */
74function getOs($agent)
75{
76 $os = false;
77
78 if (preg_match('/win/i', $agent)) {
79 if (preg_match('/nt 6.0/i', $agent)) {
80 $os = '<i></i> Windows Vista';
81 } else if (preg_match('/nt 6.1/i', $agent)) {
82 $os = '<i></i> Windows 7';
83 } else if (preg_match('/nt 6.2/i', $agent)) {
84 $os = '<i></i> Windows 8';
85 } else if(preg_match('/nt 6.3/i', $agent)) {
86 $os = '<i></i> Windows 8.1';
87 } else if(preg_match('/nt 5.1/i', $agent)) {
88 $os = '<i></i> Windows XP';
89 } else if (preg_match('/nt 10.0/i', $agent)) {
90 $os = '<i></i> Windows 10';
91 } else{
92 $os = '<i></i> Windows';
93 }
94 } else if (preg_match('/android/i', $agent)) {
95if (preg_match('/android 9/i', $agent)) {
96 $os = '<i></i> Android P';
97 }
98else if (preg_match('/android 8/i', $agent)) {
99 $os = '<i></i> Android O';
100 }
101else if (preg_match('/android 7/i', $agent)) {
102 $os = '<i></i> Android N';
103 }
104else if (preg_match('/android 6/i', $agent)) {
105 $os = '<i></i> Android M';
106 }
107else if (preg_match('/android 5/i', $agent)) {
108 $os = '<i></i> Android L';
109 }
110else{
111 $os = '<i></i> Android';
112}
113 }
114 else if (preg_match('/ubuntu/i', $agent)) {
115 $os = '<i></i> Linux';
116 } else if (preg_match('/linux/i', $agent)) {
117 $os = '<i></i> Linux';
118 } else if (preg_match('/iPhone/i', $agent)) {
119 $os = '<i></i> iPhone';
120 } else if (preg_match('/iPad/i', $agent)) {
121 $os = '<i></i> iPad';
122 } else if (preg_match('/mac/i', $agent)) {
123 $os = '<i></i> OSX';
124 }else if (preg_match('/cros/i', $agent)) {
125 $os = 'chrome os';
126 }else {
127 return false;
128 }
129 return $os;
130}

然后在对应需要显示浏览器标识的地方输出以上函数即可。

默认后台地址

默认的后台登入地址是域名后跟/admin,如果熟悉Typecho的用户就有可能尝试登入。为了安全可以将其修改为其他登入地址,进入网站的根目录,编辑config.inc.php文件,找到下面这行,将/admin修改成自己想要的后台登入地址。

1/** 后台路径(相对路径) */
2define('__TYPECHO_ADMIN_DIR__', '/admin/');

保存后将根目录admin文件夹重名名修改的地址。

保存后刷新页面查看效果。

分页页数

Typecho的默认分页数量是5,可以将其增加到10提高阅读体验。编辑默认主题目录下的functioin.php文件,追加以下内容:

1/**
2* 自定义分页数量
3*/
4function themeInit($archive) {
5 if ($archive->is('index')) {
6 $archive->parameter->pageSize = 10;
7 }elseif($archive->is('archive')){
8 $archive->parameter->pageSize = 10;
9 }
10}

保存后刷新即可。

文章自动摘要

Typecho的文章在主页默认是全文显示了,可以在后台编写文章时通过摘要分隔线功能划分显示的摘要部分,每次手动设置容易忘记。为了简单起见,可以在代码中设置自动摘要内容。在默认主题目录下编辑index.php,找到以下内容:

1<?php $this->content('阅读剩余部分'); ?>

将其内容替换为

1<?php $this->excerpt(200, '...'); ?>

上面的`200``数值可以自行修改,表示截取多少个字节作为摘要显示。

github star

分享github仓库时可以让其显示star的数量,只需要增加以下代码即可:

1<iframe src="https://ghbtns.com/github-btn.html?user=amplest&repo=molerose-typecho-themes-dev&type=star&count=true" frameborder="0" scrolling="0" width="170px" height="20px"></iframe>

文章回复可见

文章正文设置回复可见。在默认主题目录下编辑post.php文件, 找到<?php $this->content(''); ?>,将其替换为:

1<?php
2$db = Typecho_Db::get();
3$sql = $db->select()->from('table.comments')
4 ->where('cid = ?',$this->cid)
5 ->where('mail = ?', $this->remember('mail',true))
6 ->limit(1);
7$result = $db->fetchAll($sql);
8if($this->user->hasLogin() || $result) {
9 $content = preg_replace("/\[hide\](.*?)\[\/hide\]/sm",'<div class="reply2view"><i class="icon-lock-open"></i>$1</div>',$this->content);
10}
11else{
12 $content = preg_replace("/\[hide\](.*?)\[\/hide\]/sm",'<div class="reply2view"><i class="icon-lock"></i>此处内容需要评论回复后方可阅读。</div>',$this->content);
13}
14echo $content
15?>

完)

参考链接: Typecho非插件实现内容回复可见功能

© 2020 by 毛俊的博客. All rights reserved.
Theme by LekoArts