前言
handsome 主题是一款精心设计的 typecho 主题,它在保持功能丰富的同时又不失简洁优雅,我现在已经升级到了10.1.0版本。本文将介绍一些实用的美化技巧,帮助你打造一个独具特色的博客。
右侧导航栏
打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义CSS即可
1 | /*右侧导航栏*/ |
主题标题居中
打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义CSS即可
1 | /*主题标题居中*/ |
页面两侧框架留白间距
打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义CSS即可
1 | /*两侧框架留白间距*/ |
handsome 原生入站提示
打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义输出body尾部代码即可
1 | <script> |
评论一键赞、踩、打卡

打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义JavaScript即可
1 | <!--评论 打卡、赞、踩 功能--> |
打开Handsome主题目录下的 component/comments.php 文件,找到并删除如下内容:

修改成如下代码:
1 | <textarea id="comment" class="textarea form-control OwO-textarea" name="text" rows="5" placeholder="<?php _me("说点什么吧……") ?>" οnkeydοwn="if(event.ctrlKey&&event.keyCode==13){document.getElementById('submit').click();return false};"><?php $this->remember('text'); ?></textarea> |
时光机头像圆形
打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义CSS即可
1 | /* 时光机圆形头像 */ |
logo 扫光
打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义CSS即可
1 | /* logo 扫光开始 */ |
赞赏按钮跳动
打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义CSS即可
1 | /*赞赏按钮跳动开始*/ |
鼠标点击特效
打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义JavaScript即可
1 | /* 鼠标点击特效 */ |
复制版权提示
打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义JavaScript即可
1 | /* 复制成功提示代码开始 */ |
彩色标签云及右栏数字
打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义JavaScript即可
1 | /*彩色标签云代码开始*/ |
自定义右键
打开后台-更改外观-设置外观-开发者设置-复制代码粘贴至自定义输出body尾部的HTML即可
1 | <!-- 自定义右键 --> |
响应时间和访客总数
将以下代码放到/usr/themes/handsome/function.php的最下面
1 | /*访问总量代码开始*/ |
然后将以下代码放到/usr/themes/handsome/component/sidebar.php内,找到博客信息添加即可
1 | <!--访客总数代码开始--> |
全站字数统计
将以下代码放到/usr/themes/handsome/component/sidebar.php的开头
1 |
|
然后将以下代码放到/usr/themes/handsome/component/sidebar.php内,加到合适的位置
1 | <!--全站字数开始--> |
版权提示
在主题文件post.php内,文章内容下方加上下面的代码
1 | <div style="padding: 10px;background: rgba(220, 220, 220, 0.22);font-size: 13px;border-left: 3px solid;text-align: left;"> |
时间流逝
将以下代码加到/usr/themes/handsome/component/sidebar.php,在 119 行左右,放在<?php endif; ?>之后
1 | <!-- 时间倒计时代码开始 --> |
添加完成后,将以下代码放入后台-外观设置-开发者设置-自定义css
1 | /* 时间流逝 */ |
添加完成后,在到/usr/themes/handsome/assets/js里面创建名为timeinfo.js后把下面代码复制进去保存
1 | function init_life_time() { |
添加完成,将以下代码放入后台-外观设置-开发者设置-自定义输出body尾部
1 | <!-- 时间流逝 --> |
添加心知天气
这个在10.1.0版本好像不生效了
首先需要在知心天气官网注册并申请免费 API 密钥
将以下代码放入/usr/themes/handsome/component/headnav.php第 117 行左右,并替换你的公钥和密钥
1 | <!-- 知心天气--> |
总结
通过以上美化方案,你可以让你的 Handsome 主题博客更加个性化和美观。这些功能都是经过精心挑选的,既实用又不会影响博客的加载速度。你可以根据自己的需求选择性地使用这些功能。
如果你在使用过程中遇到任何问题,欢迎在评论区留言讨论。同时,也欢迎你分享自己的美化心得,让我们一起打造更好的博客!