插件
推荐插件
FontLibs：多种字体可以更换
Sitemap：自动生成 Sitemap 站点地图
simpleadmin：一款即插即用的typecho后台美化插件
UserAgent：显示评论人使用的操作系统和浏览器信息（Handsome主题专用）
去掉地址栏的index.php
去掉地址栏的index.php
1配置伪静态规则
如果使用的宝塔面板，就在 网站-设置-伪静态-选择Typecho-保存即可
2.配置URL格式
进入Typecho后台控制面板
点击 设置->永久链接 将是否使用地址重写功能改为启用 ，这里可能系统提示不支持地址重写，选择强制开启之类的就行了。再在自定义文章路径中选择自己喜欢的URL格式，保存设置后马上就生效了
删除Handsome主题首页的站点名称及副标题
后台控制台 - 外观 - 编辑当前外观 - 编辑文件
index.php
删除以下代码：
<h1 class="m-n font-thin text-black l-h"><?php $this->options->title(); ?></h1>
浏览器动态标题
主题设置 - 开发者设置 - 自定义输出body尾部的HTML代码添加以下代码
<!--浏览器动态标题开始-->
<script>
var OriginTitle = document.title;
var titleTime;
document.addEventListener('visibilitychange', function () {
if (document.hidden) {
$('[rel="icon"]').attr('href', "//file.kaygb.top/static_image/tx.png");
document.title = 'ヽ(●-`Д´-)ノ我藏好了哦！';
clearTimeout(titleTime);
}
else {
$('[rel="icon"]').attr('href', "//file.kaygb.top/static_image/tx.png");
document.title = 'ヾ(Ő∀Ő3)ノ被你发现啦~！' + OriginTitle;
titleTime = setTimeout(function () {
document.title = OriginTitle;
}, 2000);
}
});
</script>
<!--浏览器动态标题结束-->
左上角博客LOGO/博客名称的扫光效果
主题设置 - 开发者设置 - 自定义CSS添加以下代码
/* logo扫光 */
.navbar-brand{position:relative;overflow:hidden;margin: 0px 0 0 0px;}.navbar-brand:before{content:""; position: absolute; left: -665px; top: -460px; width: 200px; height: 15px; background-color: rgba(255,255,255,.5); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-animation: searchLights 6s ease-in 0s infinite; -o-animation: searchLights 6s ease-in 0s infinite; animation: searchLights 6s ease-in 0s infinite;}@-moz-keyframes searchLights{50%{left: -100px; top: 0;} 65%{left: 120px; top: 100px;}}@keyframes searchLights{40%{left: -100px; top: 0;} 60%{left: 120px; top: 100px;} 80%{left: -100px; top: 0px;}}
左上角网站FPS显示
主题设置 - 开发者设置 - 自定义 JavaScript添加以下代码
<!--fps显示-->
var console={};
console.log=function(){};
$('body').before('<div id="fps" style="z-index:10000;position:fixed;top:3;left:3;font-weight:bold;"></div>');
var showFPS = (function(){
var requestAnimationFrame =
window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function(callback) {
window.setTimeout(callback, 1000/60);
};
var e,pe,pid,fps,last,offset,step,appendFps;
fps = 0;
last = Date.now();
step = function(){
offset = Date.now() - last;
fps += 1;
if( offset >= 1000 ){
last += offset;
appendFps(fps);
fps = 0;
}
requestAnimationFrame( step );
};
appendFps = function(fps){
console.log(fps+'FPS');
$('#fps').html(fps+'FPS');
};
step();
})();
顶部导航栏添加网页动态滚动进度条
顶部导航栏添加网页动态滚动进度条
1.在
handsome/component/header.php文件中最下面添加代码<div class="progress-top" style="position: fixed; top: 0px; height: 5px; background: rgba(31, 159, 199, 0.79); border-radius: 500px; z-index: 5200;"></div>
2.主题设置 - 开发者设置 - 自定义 JavaScript添加以下代码
let pageHeight = document.body.scrollHeight || document.documentElement.scrollHeight;
let windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
let scrollAvail = pageHeight - windowHeight;
window.onscroll = function () {
let scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
document.querySelector('.progress-top').style.width = (scrollTop / scrollAvail) * 100 + '%';
}
博主介绍文字动态化
将以下代码放到主题后台-外观-设置外观-初级设置-博主的介绍内即可
<!--博主介绍的闪字特效--> <span class="text-muted text-xs block"><div id="chakhsu"></div> <script> var chakhsu = function (r) {function t() {return b[Math.floor(Math.random() * b.length)]} function e() {return String.fromCharCode(94 * Math.random() + 33)} function n(r) {for (var n = document.createDocumentFragment(), i = 0; r > i; i++) { var l = document.createElement("span"); l.textContent = e(), l.style.color = t(), n.appendChild(l) } return n}function i() {var t = o[c.skillI]; c.step ? c.step-- : (c.step = g, c.prefixP < l.length ? (c.prefixP >= 0 && (c.text += l[c.prefixP]), c.prefixP++) : "forward" === c.direction ? c.skillP < t.length ? (c.text += t[c.skillP], c.skillP++) : c.delay ? c.delay-- : (c.direction = "backward", c.delay = a) : c.skillP > 0 ? (c.text = c.text.slice(0, -1), c.skillP--) : (c.skillI = (c.skillI + 1) % o.length, c.direction = "forward")), r.textContent = c.text, r.appendChild(n(c.prefixP < l.length ? Math.min(s, s + c.prefixP) : Math.min(s, t.length - c.skillP))), setTimeout(i, d) } /*以下内容自定义修改*/ var l = "", o = ["就是不想想太多,所以摆烂了" ].map(function (r) {return r + ""}), a = 2, g = 1, s = 5, d = 75, b = ["rgb(110,64,170)", "rgb(150,61,179)", "rgb(191,60,175)", "rgb(228,65,157)", "rgb(254,75,131)", "rgb(255,94,99)", "rgb(255,120,71)", "rgb(251,150,51)", "rgb(226,183,47)", "rgb(198,214,60)", "rgb(175,240,91)", "rgb(127,246,88)", "rgb(82,246,103)", "rgb(48,239,130)", "rgb(29,223,163)", "rgb(26,199,194)", "rgb(35,171,216)", "rgb(54,140,225)", "rgb(76,110,219)", "rgb(96,84,200)"], c = {text: "", prefixP: -s, skillI: 0, skillP: 0, direction: "forward", delay: a, step: g}; i() }; chakhsu(document.getElementById('chakhsu')); </script> </span> </span>
防止他人F12抓你代码和调试
主题设置 - 开发者设置 - 自定义 JavaScript添加以下代码
<!--干扰调试-->
var check = (function () {
var callbacks = [], timeLimit = 50, open = false;
setInterval(loop, 1);
return {
addListener: function (fn) {
callbacks.push(fn);
},
cancleListenr: function (fn) {
callbacks = callbacks.filter(function (v) {
return v !== fn;
});
}
}
function loop() {
var startTime = new Date();
debugger;
if (new Date() - startTime > timeLimit) {
if (!open) {
callbacks.forEach(function (fn) {
fn.call(null);
});
}
open = true;
window.stop();
} else {
open = false;
}
}
})();
check.addListener(function () {
window.location.reload();
});
<!--禁止右击与F12-->
document.onkeydown = function(){
if(window.event && window.event.keyCode == 123) {
alert("F12被禁用");
event.keyCode=0;
event.returnValue=false;
}
if(window.event && window.event.keyCode == 13) {
window.event.keyCode = 505;
}
if(window.event && window.event.keyCode == 8) {
alert(str+"\n请使用Del键进行字符的删除操作！");
window.event.returnValue=false;
}
}
添加复制弹窗
主题设置 - 开发者设置 - 自定义 JavaScript添加以下代码
/* 复制成功提示代码开始 */
kaygb_copy();function kaygb_copy(){$(document).ready(function(){$("body").bind('copy',function(e){hellolayer()})});var sitesurl=window.location.href;function hellolayer(){
$.message({
message: "转载请注明出处！<br> 本文作者：lsy<br>原文链接："+sitesurl,
title: "复制成功",
type: "warning",
autoHide: !1,
time: "5000"
})
}}
/* 复制成功提示代码结束 */在博客顶部添加心知天气
在博客顶部添加心知天气
首先去心知天气官网注册账号并申请API
之后在
/usr/themes/handsome/component/headnav.php文件中的动态日历中<?php endif;?>下方添加以下代码注意将API信息改成自己的
<!-- 知心天气-->
<div id="tp-weather-widget" class="navbar-form navbar-form-sm navbar-left shift"></div>
<script>(function(T,h,i,n,k,P,a,g,e){g=function(){P=h.createElement(i);a=h.getElementsByTagName(i)[0];P.src=k;P.charset="utf-8";P.async=1;a.parentNode.insertBefore(P,a)};T["ThinkPageWeatherWidgetObject"]=n;T[n]||(T[n]=function(){(T[n].q=T[n].q||[]).push(arguments)});T[n].l=+new Date();if(T.attachEvent){T.attachEvent("onload",g)}else{T.addEventListener("load",g,false)}}(window,document,"script","tpwidget","//widget.seniverse.com/widget/chameleon.js"))</script>
<script>tpwidget("init", {
"flavor": "slim",
"location": "WX4FBXXFKE4F",
"geolocation": "enabled",
"language": "auto",
"unit": "c",
"theme": "chameleon",
"container": "tp-weather-widget",
"bubble": "enabled",
"alarmType": "badge",
"color": "#C6C6C6",
"uid": "公钥",
"hash": "密钥"
});
tpwidget("show");</script>
<!-- 知心结束-->
左侧图标美化
PJAX回调函数和自定义 JavaScript添加以下代码
<!--左侧图标颜色-->
let leftHeader=document.querySelectorAll("span.nav-icon>svg,span.nav-icon>i");let leftHeaderColorArr=["#FF69B4","#58c7ea","#E066FF","#FF69B4","#FFA54F","#90EE90","#0043ff","#cc00ff","#878787","#A0522D","#FF7256","#FFA500","#8B0000","#7CFC00","#4EEE94","#00FFFF","#EE0000"];leftHeader.forEach(tag=>{tagsColor=leftHeaderColorArr[Math.floor(Math.random()*leftHeaderColorArr.length)];tag.style.color=tagsColor});
底部-个性化网站版权信息/备案信息
文章尾部添加版权信息
主题设置 - 开发者设置 - 自定义CSS添加以下代码
*底部-个性化网站版权信息/备案信息*/
.github-badge {
display: inline-block;
border-radius: 4px;
text-shadow: none;
font-size: 12px;
color: #fff;
line-height: 15px;
background-color: #abbac3;
margin-bottom: 5px
}
.github-badge .badge-subject {
display: inline-block;
background-color: #4d4d4d;
padding: 4px 4px 4px 6px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px
}
.github-badge .badge-value {
display: inline-block;
padding: 4px 6px 4px 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px
}
.github-badge .bg-blue {
background-color: #007ec6
}
.github-badge .bg-orange {
background-color: #ffa500
}
.github-badge .bg-green {
background-color: #3bca6e
}
删除主题版权信息
修改usr/themes/handsome/component/footer.php从117行footer替换到《/footer》
<footer id="footer" class="app-footer" role="footer">
<div class="wrapper bg-light">
<span class="pull-right hidden-xs text-ellipsis">
<?php $this->options->BottomInfo();
// 可以去除主题版权信息，最好保留版权信息或者添加主题信息到友链，谢谢你的理解
?>
</span>
<span class="text-ellipsis">
<?php
$this->options->BottomleftInfo(); ?>
</span>
</div>
</footer>
主题设置 - 开发者设置 - 博客底部左侧信息添加以下代码
<!--左侧底部-->
<div class="github-badge">
<span class="badge-subject">Copyright</span>
<a href="https://lsy22.com" target="_blank">
<span class="badge-value bg-blue">@Lsy</span>
</a>
<span class="badge-subject">渝ICP备</span>
<a href="http://beian.miit.gov.cn/" target="_blank">
<span class="badge-value bg-green">2022009272号</span>
</a>
</div>
主题设置 - 开发者设置 - 博客底部右侧信息添加以下代码
<div class="github-badge">
<a href="http://www.typecho.org" target="_blank" title="由 Typecho 强力驱动" style="cursor: url("/usr/plugins/HoerMouse/static/image/dew/link.cur"), pointer;">
<span class="badge-subject">Powered</span><span class="badge-value bg-blue">Typecho</span>
<a href="https://www.ihewro.com/archives/489/" target="_blank" title="站点使用 handsome 主题，作者：友人C" style="cursor: url("/usr/plugins/HoerMouse/static/image/dew/link.cur"), pointer;">
<span class="badge-subject">Theme</span><span class="badge-value bg-orange">Handsome</span>
</a>
</div>
文章末尾版权声明
版权声明
1.主题设置 - 开发者设置 - 自定义CSS添加以下代码
/*文章底部版权*/
.myfieldset {
border: 1px dashed #dce0e3;
padding: 10px;
border-radius: 5px;
line-height: 2em;
color: #6d6d6d;
}
2.将以下代码加到/usr/themes/handsome/post.php中<!--文章的页脚部件：打赏和其他信息的输出-->上一行
<!--版权声明开始-->
<div<!--网站声明代码start-->
<div>
<fieldset class="myfieldset">
<legend align="center" class="mylegend" style="font-size: 14px">版权声明</legend>
博客名称：<strong> lsy的小站</strong>
<br>
本文链接：<span style="color: #3984f5; font-size: 14px"><strong>
<a href="<?php $this->permalink()?>"title="<?php $this->title()?>"><?php $this->permalink() ?></a></strong></span>
<br>
内容来源： 部分内容可能来源于公共网络，仅供学习交流，如有侵权，请联系博主进行核实删除。
<br>
转载说明： 请勿用于商业用途，转载请注明出处！
<br>
</fieldset>
</div>
<!--网站声明代码end--><br
博客信息美化
添加右侧全站字数、在线人数、响应耗时和访客总数
1.Content.php添加
将以下代码加到/usr/themes/handsome/libs/Content.php中，放在class Content的上面
/*访问总量*/
function theAllViews(){
$db = Typecho_Db::get();
$row = $db->fetchAll('SELECT SUM(VIEWS) FROM `typecho_contents`');
echo number_format($row[0]['SUM(VIEWS)']);
}
/*响应时间*/
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;
}
/*全站字数*/
function allOfCharacters() {
$chars = 0;
$db = Typecho_Db::get();
$select = $db ->select('text')->from('table.contents');
$rows = $db->fetchAll($select);
foreach ($rows as $row) { $chars += mb_strlen(trim($row['text']), 'UTF-8'); }
$unit = '';
if($chars >= 10000) { $chars /= 10000; $unit = '万'; }
else if($chars >= 1000) { $chars /= 1000; $unit = '千'; }
$out = sprintf('%.2lf %s',$chars, $unit);
return $out;
}
/*在线人数*/
function online_users() {
$filename='online.txt'; //数据文件
$cookiename='Nanlon_OnLineCount'; //Cookie名称
$onlinetime=30; //在线有效时间
$online=file($filename);
$nowtime=$_SERVER['REQUEST_TIME'];
$nowonline=array();
foreach($online as $line){
$row=explode('|',$line);
$sesstime=trim($row[1]);
if(($nowtime - $sesstime)<=$onlinetime){
$nowonline[$row[0]]=$sesstime;
}
}
if(isset($_COOKIE[$cookiename])){
$uid=$_COOKIE[$cookiename];
}else{
$vid=0;
do{
$vid++;
$uid='U'.$vid;
}while(array_key_exists($uid,$nowonline));
setcookie($cookiename,$uid);
}
$nowonline[$uid]=$nowtime;
$total_online=count($nowonline);
if($fp=@fopen($filename,'w')){
if(flock($fp,LOCK_EX)){
rewind($fp);
foreach($nowonline as $fuid=>$ftime){
$fline=$fuid.'|'.$ftime."\n";
@fputs($fp,$fline);
}
flock($fp,LOCK_UN);
fclose($fp);
}
}
echo "$total_online";
}
2.sidebar.php添加
找到/usr/themes/handsome/component/sidebar.php文件，找到代码
<!--博客信息-->
<?php if (@!in_array('info', Utils::checkArray($this->options->sidebarSetting))): ?>
<section id="blog_info" class="widget widget_categories wrapper-md clear">
<h5 class="widget-title m-t-none text-md"><?php _me("博客信息") ?></h5>
<ul class="list-group box-shadow-wrap-normal">
<?php Typecho_Widget::widget('Widget_Stat')->to($stat); ?>
<li class="list-group-item text-second"><span class="blog-info-icons"> <i data-feather="award"></i></span> <span
class="badge
pull-right"><?php $stat->publishedPostsNum() ?></span><?php _me("文章数目") ?></li>
<?php if (COMMENT_SYSTEM == 0): ?>
<li class="list-group-item text-second"> <span class="blog-info-icons"> <i data-feather="message-circle"></i></span>
<span class="badge
pull-right"><?php $stat->publishedCommentsNum() ?></span><?php _me("评论数目") ?></li>
<?php endif; ?>
<li class="list-group-item text-second"><span class="blog-info-icons"> <i data-feather="calendar"></i></span>
<span class="badge
pull-right"><?php echo Utils::getOpenDays(); ?></span><?php _me("运行天数") ?></li>
<li class="list-group-item text-second"><span class="blog-info-icons"> <i data-feather="activity"></i></span> <span
class="badge
pull-right"><?php echo Utils::getLatestTime($this); ?></span><?php _me("最后活动") ?></li>
</ul>
</section>
<?php endif; ?>
<?php if ($this->options->adContentSidebar != ""): ?>
替换为如下代码：
<!--博客信息-->
<?php if (@!in_array('info', Utils::checkArray($this->options->sidebarSetting))): ?>
<section id="blog_info" class="widget widget_categories wrapper-md clear">
<h5 class="widget-title m-t-none text-md"><?php _me("博客信息") ?></h5>
<ul class="list-group box-shadow-wrap-normal">
<li class="list-group-item text-second">
<span class="blog-info-icons">
<i data-feather="refresh-ccw">
</i>
</span>
<span class="badge pull-right">
<?php echo timer_stop(); ?>
</span>
<?php _me("响应耗时") ?>
</li>
<li class="list-group-item">
<i class="glyphicon glyphicon-user text-muted text-muted">
</i>
<span class="badge pull-right">
<?php echo online_users() ?>
</span>
<?php _me("在线人数") ?>
</li>
<li class="list-group-item text-second"><span class="blog-info-icons"> <i data-feather="calendar"></i></span>
<span class="badge
pull-right"><?php echo Utils::getOpenDays(); ?></span><?php _me("运行天数") ?></li>
<!--自定义统计-->
<li class="list-group-item text-second">
<span class="blog-info-icons">
<i data-feather="edit-3">
</I>
</span>
<span class="badge pull-right">
<?php echo allOfCharacters(); ?>
</span>
<?php _me("全站字数") ?>
</li>
<li class="list-group-item text-second">
<span class="blog-info-icons">
<i data-feather="users">
</i>
</span>
<span class="badge pull-right">
<?php echo theAllViews(); ?>
</span>
<?php _me("访客总数") ?>
</li>
</ul>
</section>
<?php endif; ?>
<?php if ($this->options->adContentSidebar != ""): ?>
手机不显示标签云和热门
主题设置 - 开发者设置 - 自定义CSS添加以下代码
/*手机不显示*/
@media (max-width:767px) {
#tabs-4,#tag_cloud-2 {
display: none;
}
}
图片API随机动漫文章头图
随机api头图
8.4.1版本以下打开并编辑
/usr/themes/handsome/libs路径下的Content.php文件查找如下代码
$random = STATIC_PATH . 'img/sj/' . @$randomNum[$index] . '.jpg';//如果有文章置顶，这里可能会导致index not undefined
9.0.1版本以上打开并编辑/usr/themes/handsome/libs/content路径下的CommonContent.php文件
查找如下代码
$random = STATIC_PATH . 'img/sj/' . @$randomNum[$index];//如果有文章置顶，这里可能会导致index not undefined
并替换该代码保存
$random = 'https://tc.lsy22.com/api.php?_='.rand(999, 3000);
给网站加上樱花飘落JS效果
主题设置 - 开发者设置 - 自定义输出body 尾部的HTML代码添加以下代码(将url替换为域名)
也可以将代码下载下来放解压放到站点根目录
<script type="text/javascript">//樱花
var system ={};
$.getScript("https://url/yinghua.js");
</script>
添加服务器状态栏
添加服务器状态栏
转自:https://www.ascv.cn/archives/542.html
1.添加状态数据接口文件
文件:https://lsy22.lanzouj.com/iTpBJ1b4z0uh
将文件放在网站根目录
2.Content.php修改
将以下代码加到/usr/themes/handsome/libs/Content.php中，放在
if (@Utils::getExpertValue("show_static",true) !== false): ?>
<ul class="nav navbar-nav hidden-sm">
的下面
<li class="dropdown pos-stc" id="StateDataPos">
<a id="StateData" href="#" data-toggle="dropdown" class="dropdown-toggle feathericons dropdown-toggle">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-activity"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"></polyline></svg>
<span class="caret"></span>
</a>
<div class="dropdown-menu wrapper w-full bg-white">
<div class="row">
<div class="col-sm-4 b-l b-light">
<div class="m-t-xs m-b-xs font-bold">运行状态</div>
<div class="">
<span class="pull-right text-danger" id="cpu">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>CPU占用
<span class="badge badge-sm bg-dark">4核处理器</span>
</span>
</div>
<div class="progress progress-xs m-t-sm bg-default">
<div id="cpu_css" class="progress-bar bg-danger" data-toggle="tooltip" style="width: 100%"></div>
</div>
<div class="">
<span class="pull-right text-danger" id="memory">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>占用内存
<span class="badge badge-sm bg-dark" id="memory_data">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
</span>
</div>
<div class="progress progress-xs m-t-sm bg-default">
<div id="memory_css" class="progress-bar bg-danger" data-toggle="tooltip" style="width: 100%"></div>
</div>
<div class="">
<span class="pull-right text-danger" id="disk">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>磁盘占用
<span class="badge badge-sm bg-dark" id="disk_data">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
</span>
</div>
<div class="progress progress-xs m-t-sm bg-default">
<div id="disk_css" class="progress-bar bg-danger" data-toggle="tooltip" style="width: 100%"></div>
</div>
<div class="">
<span class="pull-right text-danger" id="memCached">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>内存缓存
<span class="badge badge-sm bg-dark" id="memCached_data">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
</span>
</div>
<div class="progress progress-xs m-t-sm bg-default">
<div id="memCached_css" class="progress-bar bg-danger" data-toggle="tooltip" style="width: 100%"></div>
</div>
<div class="">
<span class="pull-right text-danger" id="memBuffers">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>内存缓冲
<span class="badge badge-sm bg-dark" id="memBuffers_data">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
</span>
</div>
<div class="progress progress-xs m-t-sm bg-default">
<div id="memBuffers_css" class="progress-bar bg-danger" data-toggle="tooltip" style="width: 100%"></div>
</div>
<div class="">
<span class="pull-right text-danger" id="state_s">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>系统负载
<span id="state">
<span class="badge badge-sm bg-dark">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
</span>
</span>
</div>
<div class="progress progress-xs m-t-sm bg-default">
<div id="state_css" class="progress-bar bg-danger" data-toggle="tooltip" style="width: 100%"></div>
</div>
</div>
<div class="col-sm-4 b-l b-light visible-lg visible-md">
<div class="m-t-xs m-b-xs font-bold">网络状态</div>
<div class="">
<span class="pull-right text-default" id="io">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>IO</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default" id="io1">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>实时IO</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default" id="eth">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>网络</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default" id="eth1">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>实时网络</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default" id="time">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>服务器时间</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default">
<span class="badge badge-sm bg-dark"><?php echo $_SERVER['SERVER_SOFTWARE']; ?></span></span>
<span>WEB服务器</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default">
<span class="badge badge-sm bg-dark"><?php echo $_SERVER['SERVER_PROTOCOL']; ?></span>
</span>
<span>通信协议</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default">
<span class="badge badge-sm bg-dark"><?php echo PHP_VERSION;?></span>
</span>
<span>PHP版本</span>
</div>
<br/>
</div>
<div class="col-sm-4 b-l b-light visible-lg visible-md">
<div class="m-t-xs m-b-sm font-bold">访客信息</div>
<div class="">
<span class="pull-right text-default" id="u_time">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>持续运行</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default" id="ip">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>您的IP</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default" id="address">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>网络地址</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default" id="b">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>浏览器信息</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default" id="sys">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>您的设备</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default">
<span class="badge badge-sm bg-dark"><?php echo $_SERVER['REQUEST_METHOD'];?></span></span>
<span>请求方法</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default">
<span class="badge badge-sm bg-dark"><?php echo $_SERVER['HTTP_ACCEPT_LANGUAGE'];?></span></span>
<span>服务语言</span>
</div>
<br/>
<div class="">
<span class="pull-right text-default" id="sys_times">
<i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
</span>
<span>您的设备时间</span>
</div>
</div>
</div>
</div>
</li>
3.footer.php修改
将以下代码加到/usr/themes/handsome/component/footer.php最底下，将下面代码中https://lsy22.com/state.php修改为第一步文件存放的地址
<script>
var stateUrl = 'https://lsy22.com/state.php';
var se_rx;
var se_tx;
var si_rx;
var si_tx;
function returnFloat(value){
return value.toFixed(2)+'%';
}
function floats(value){
return value.toFixed(2);
}
function getPercent(curNum, totalNum, isHasPercentStr) {
curNum = parseFloat(curNum);
totalNum = parseFloat(totalNum);
if (isNaN(curNum) || isNaN(totalNum)) {
return 'Error';
}
return isHasPercentStr ?
totalNum <= 0 ? '0%' : (Math.round(curNum / totalNum * 10000) / 100.00 + '%') :
totalNum <= 0 ? 0 : (Math.round(curNum / totalNum * 10000) / 100.00 + '%');
}
function getPercents(curNum, totalNum, isHasPercentStr) {
curNum = parseFloat(curNum);
totalNum = parseFloat(totalNum);
if (isNaN(curNum) || isNaN(totalNum)) {
return 'Error';
}
return isHasPercentStr ?
totalNum <= 0 ? '0%' : (Math.round(curNum / totalNum * 10000) / 100.00) :
totalNum <= 0 ? 0 : (Math.round(curNum / totalNum * 10000) / 100.00);
}
function setSize(value,d){
switch (d) {
case 'bit':
return bit = value*8;
break;
case 'bytes':
return value;
break;
case 'kb':
return value/1024;
break;
case 'mb':
return value/1024/1024;
break;
case 'gb':
return value/1024/1024/1024;
break;
case 'tb':
return value/1024/1024/1024/1024;
break;
}
}
function ForDight(Dight){
if (Dight < 0){
var Last = 0+"B/s";
}else if (Dight < 1024){
var Last = setSize(Dight,'bytes').toFixed(0)+"B/s";
}else if (Dight < 1048576){
var Last = floats(setSize(Dight,'kb'))+"K/s";
}else{
var Last = floats(setSize(Dight,'mb'))+"MB/s";
}
return Last;
}
function state(){
$.ajax({
url: stateUrl,
type: 'get',
dataType: 'json',
data: {
action:'fetch',
},
beforeSend:function(){
},
complete:function(){
},
error: function() {
},
success: function (data) {
var cpu = data.serverStatus.cpuUsage['user']+data.serverStatus.cpuUsage['nice']+data.serverStatus.cpuUsage['sys'];
$("#cpu").html(returnFloat(cpu));
$("#cpu_css").css("width",returnFloat(cpu));
if(cpu<70){
$("#cpu_css").removeClass();
$("#cpu_css").addClass("progress-bar bg-success");
$("#cpu").removeClass();
$("#cpu").addClass("pull-right text-success");
}
if(cpu>=70){
$("#cpu_css").removeClass();
$("#cpu_css").addClass("progress-bar bg-warning");
$("#cpu").removeClass();
$("#cpu").addClass("pull-right text-warning");
}
if(cpu>=90){
$("#cpu_css").removeClass();
$("#cpu_css").addClass("progress-bar bg-danger");
$("#cpu").removeClass();
$("#cpu").addClass("pull-right text-danger");
}
var memory_value = data.serverStatus.memRealUsage['value'];
var memory_max = data.serverStatus.memRealUsage['max'];
$("#memory").html(getPercent(memory_value,memory_max,memory_value));
window.RemData = getPercents(memory_value,memory_max,memory_value);
$("#memory_css").css("width",getPercent(memory_value,memory_max,memory_value));
var me = getPercents(memory_value,memory_max,memory_value);
if(me<70){
$("#memory_css").removeClass();
$("#memory_css").addClass("progress-bar bg-success");
$("#memory").removeClass();
$("#memory").addClass("pull-right text-success");
}
if(me>=70){
$("#memory_css").removeClass();
$("#memory_css").addClass("progress-bar bg-warning");
$("#memory").removeClass();
$("#memory").addClass("pull-right text-warning");
}
if(me>=90){
$("#memory_css").removeClass();
$("#memory_css").addClass("progress-bar bg-danger");
$("#memory").removeClass();
$("#memory").addClass("pull-right text-danger");
}
if(floats(setSize(memory_value,'mb'))>1024){
var memory_data_value = floats(setSize(memory_value,'gb'))+"GB";
} else{
var memory_data_value = floats(setSize(memory_value,'mb'))+"MB";
}
if(floats(setSize(memory_max,'mb'))>1024){
var memory_data_max = floats(setSize(memory_max,'gb'))+"GB";
} else{
var memory_data_max = floats(setSize(memory_max,'mb'))+"MB";
}
$("#memory_data").html(memory_data_value+" / "+memory_data_max);
var disk_value = data.serverInfo.diskUsage['value'];
var disk_max = data.serverInfo.diskUsage['max'];
$("#disk").html(getPercent(disk_value,disk_max,disk_value));
$("#disk_css").css("width",getPercent(disk_value,disk_max,disk_value));
var dk = getPercents(disk_value,disk_max,disk_value);
if(dk<70){
$("#disk_css").removeClass();
$("#disk_css").addClass("progress-bar bg-success");
$("#disk").removeClass();
$("#disk").addClass("pull-right text-success");
}
if(dk>=70){
$("#disk_css").removeClass();
$("#disk_css").addClass("progress-bar bg-warning");
$("#disk").removeClass();
$("#disk").addClass("pull-right text-warning");
}
if(dk>=90){
$("#disk_css").removeClass();
$("#disk_css").addClass("progress-bar bg-danger");
$("#disk").removeClass();
$("#disk").addClass("pull-right text-danger");
}
if(floats(setSize(disk_value,'mb'))>1024){
var disk_data_value = floats(setSize(disk_value,'gb'))+"GB";
} else{
var disk_data_value = floats(setSize(disk_value,'mb'))+"MB";
}
if(floats(setSize(disk_max,'mb'))>1024){
var disk_data_max = floats(setSize(disk_max,'gb'))+"GB";
} else{
var disk_data_max = floats(setSize(disk_max,'mb'))+"MB";
}
$("#disk_data").html(disk_data_value+" / "+disk_data_max);
var memCached_value = data.serverStatus.memCached['value'];
var memCached_max = data.serverStatus.memCached['max'];
$("#memCached").html(getPercent(memCached_value,memCached_max,memCached_value));
$("#memCached_css").css("width",getPercent(memCached_value,memCached_max,memCached_value));
var mem = getPercents(memCached_value,memCached_max,memCached_value);
if(mem<70){
$("#memCached_css").removeClass();
$("#memCached_css").addClass("progress-bar bg-success");
$("#memCached").removeClass();
$("#memCached").addClass("pull-right text-success");
}
if(mem>=70){
$("#memCached_css").removeClass();
$("#memCached_css").addClass("progress-bar bg-warning");
$("#memCached").removeClass();
$("#memCached").addClass("pull-right text-warning");
}
if(mem>=90){
$("#memCached_css").removeClass();
$("#memCached_css").addClass("progress-bar bg-danger");
$("#memCached").removeClass();
$("#memCached").addClass("pull-right text-danger");
}
if(floats(setSize(memCached_value,'mb'))>1024){
var memCached_data_value = floats(setSize(memCached_value,'gb'))+"GB";
} else{
var memCached_data_value = floats(setSize(memCached_value,'mb'))+"MB";
}
if(floats(setSize(memCached_max,'mb'))>1024){
var memCached_data_max = floats(setSize(memCached_max,'gb'))+"GB";
} else{
var memCached_data_max = floats(setSize(memCached_max,'mb'))+"MB";
}
$("#memCached_data").html(memCached_data_value+" / "+memCached_data_max);
var memBuffers_value = data.serverStatus.memBuffers['value'];
var memBuffers_max = data.serverStatus.memBuffers['max'];
$("#memBuffers").html(getPercent(memBuffers_value,memBuffers_max,memBuffers_value));
$("#memBuffers_css").css("width",getPercent(memBuffers_value,memBuffers_max,memBuffers_value));
var memB = getPercents(memCached_value,memCached_max,memCached_value);
if(memB<70){
$("#memBuffers_css").removeClass();
$("#memBuffers_css").addClass("progress-bar bg-success");
$("#memBuffers").removeClass();
$("#memBuffers").addClass("pull-right text-success");
}
if(memB>=70){
$("#memBuffers_css").removeClass();
$("#memBuffers_css").addClass("progress-bar bg-warning");
$("#memBuffers").removeClass();
$("#memBuffers").addClass("pull-right text-warning");
}
if(memB>=90){
$("#memBuffers_css").removeClass();
$("#memBuffers_css").addClass("progress-bar bg-danger");
$("#memBuffers").removeClass();
$("#memBuffers").addClass("pull-right text-danger");
}
if(floats(setSize(memBuffers_value,'mb'))>1024){
var memBuffers_data_value = floats(setSize(memBuffers_value,'gb'))+"GB";
} else{
var memBuffers_data_value = floats(setSize(memBuffers_value,'mb'))+"MB";
}
if(floats(setSize(memBuffers_max,'mb'))>1024){
var memBuffers_data_max = floats(setSize(memBuffers_max,'gb'))+"GB";
} else{
var memBuffers_data_max = floats(setSize(memBuffers_max,'mb'))+"MB";
}
$("#memBuffers_data").html(memBuffers_data_value+" / "+memBuffers_data_max);
var state = "";
for(var i = 0; i < data.serverStatus.sysLoad.length ; i++){
state += '<span class="badge badge-sm bg-dark">'+data.serverStatus.sysLoad[i]+'</span> '
}
$("#state").html(state);
var state_s = getPercent(data.serverStatus.sysLoad[0],2,data.serverStatus.sysLoad[0]);
$("#state_css").css("width",state_s);
$("#state_s").html(state_s);
var sta = getPercents(data.serverStatus.sysLoad[0],2,data.serverStatus.sysLoad[0]);
if(sta<70){
$("#state_css").removeClass();
$("#state_css").addClass("progress-bar bg-success");
$("#state_s").removeClass();
$("#state_s").addClass("pull-right text-success");
}
if(sta>=70){
$("#state_css").removeClass();
$("#state_css").addClass("progress-bar bg-warning");
$("#state_s").removeClass();
$("#state_s").addClass("pull-right text-warning");
}
if(sta>=90){
$("#state_css").removeClass();
$("#state_css").addClass("progress-bar bg-danger");
$("#state_s").removeClass();
$("#state_s").addClass("pull-right text-danger");
}
$("#time").html('<span class="badge badge-sm bg-dark">'+data.serverInfo.serverTime+'</span>');
$("#u_time").html('<span class="badge badge-sm bg-dark">'+data.serverInfo.serverUptime["days"]+' 天'+data.serverInfo.serverUptime["hours"]+' 时 '+data.serverInfo.serverUptime["mins"]+' 分'+data.serverInfo.serverUptime["secs"]+' 秒</span>');
if(floats(setSize(data.networkStats.networks.eth0.tx,'mb'))>1024){
var aaa_tx = floats(setSize(data.networkStats.networks.eth0.tx,'gb'))+"GB";
} else{
var aaa_tx = floats(setSize(data.networkStats.networks.eth0.tx,'mb'))+"MB";
}
if(floats(setSize(data.networkStats.networks.eth0.rx,'mb'))>1024){
var aaa_rx = floats(setSize(data.networkStats.networks.eth0.rx,'gb'))+"GB";
} else{
var aaa_rx = floats(setSize(data.networkStats.networks.eth0.rx,'mb'))+"MB";
}
$("#eth").html('<span class="badge badge-sm bg-dark"><i class="glyphicon glyphicon-upload" aria-hidden="true"></i> '+aaa_tx+'</span> '+
'<span class="badge badge-sm bg-dark"><i class="glyphicon glyphicon-download" aria-hidden="true"></i> '+aaa_rx+'</span>');
$("#eth1").html('<span class="badge badge-sm bg-dark"><i class="glyphicon glyphicon-cloud-upload" aria-hidden="true"></i> '+ForDight(data.networkStats.networks.eth0.tx-se_tx,3)+'</span> '+
'<span class="badge badge-sm bg-dark"><i class="glyphicon glyphicon-cloud-download" aria-hidden="true"></i> '+ForDight(data.networkStats.networks.eth0.rx-se_rx,3)+'</span>');
se_tx = data.networkStats.networks.eth0.tx;
se_rx = data.networkStats.networks.eth0.rx;
if(floats(setSize(data.networkStats.networks.lo.tx,'mb'))>1024){
var lo_tx = floats(setSize(data.networkStats.networks.lo.tx,'gb'))+"GB";
} else{
var lo_tx = floats(setSize(data.networkStats.networks.lo.tx,'mb'))+"MB";
}
if(floats(setSize(data.networkStats.networks.lo.rx,'mb'))>1024){
var lo_rx = floats(setSize(data.networkStats.networks.lo.rx,'gb'))+"GB";
} else{
var lo_rx = floats(setSize(data.networkStats.networks.lo.rx,'mb'))+"MB";
}
$("#io").html('<span class="badge badge-sm bg-dark"><i class="fa fa-upload" aria-hidden="true"></i> '+lo_tx+'</span> '+
'<span class="badge badge-sm bg-dark"><i class="glyphicon glyphicon-cloud-download" aria-hidden="true"></i> '+lo_rx+'</span>');
$("#io1").html('<span class="badge badge-sm bg-dark"><i class="glyphicon glyphicon-cloud-upload" aria-hidden="true"></i> '+ForDight(data.networkStats.networks.lo.tx-si_tx,3)+'</span> '+
'<span class="badge badge-sm bg-dark"><i class="glyphicon glyphicon-cloud-download" aria-hidden="true"></i> '+ForDight(data.networkStats.networks.lo.rx-si_rx,3)+'</span>');
si_tx = data.networkStats.networks.lo.tx;
si_rx = data.networkStats.networks.lo.rx;
}
});
}
function getNowFormatDate(){
var date = new Date();
var seperator1 = "-";
var seperator2 = ":";
var month = date.getMonth() + 1;
var strDate = date.getDate();
if (month >= 1 && month <= 9) {
month = "0" + month;
}
if (strDate >= 0 && strDate <= 9) {
strDate = "0" + strDate;
}
var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate
+ " " + date.getHours() + seperator2 + date.getMinutes()
+ seperator2 + date.getSeconds();
return currentdate;
}
function UserInfo(){
$.ajax({
type : "get",
url : "https://open.gmit.vip/web/api/UserInfo/",
async : true,
beforeSend : function(){
},
complete : function(){
},
error : function(){
UserInfo();
},
success : function(data){
if(data!=null){
if(data.data['location']==null){
UserInfo();
}else{
$("#ip").html('<span class="badge badge-sm bg-dark">'+data.data['ip']+'</span>');
$("#address").html('<span class="badge badge-sm bg-dark">'+data.data['location']+'</span>');
$("#b").html('<span class="badge badge-sm bg-dark">'+data.data['browser']+'</span>');
$("#sys").html('<span class="badge badge-sm bg-dark">'+data.data['os']+'</span>');
}
}
},
});
};
$('#StateData').click(function(){
clearInterval(window.getnet);
clearInterval(window.info);
window.getnet = setInterval(function(){
if($('#StateDataPos').is('.open')){
state();
$("#sys_times").html('<span class="badge badge-sm bg-dark">'+getNowFormatDate()+'</span>');
}
},1000);
UserInfo();
});
</script>
宝塔用户需要加一个代码
在根目录文件.user.ini里面第一段代码后面添加:/proc/这个代码
Typecho下文章cid、分类和标签mid不连续的问题
cid
<?php
/**
* Typecho重新排列分文章cid让他连续
*/
// 设置数据库参数
$hostname_blog = "localhost";
$database_blog = "数据库名";
$username_blog = "数据库用户名";
$password_blog = "数据库密码";
// 连接到数据库
$blog = mysqli_connect($hostname_blog, $username_blog, $password_blog, $database_blog) or die(mysqli_connect_error());
// 设置计数器的初始值
$no = 1;
// 定义一个函数来更新文章cid
function change_id($cid)
{
global $no, $blog;
// 更新文章cid，并更新与类别、标签、自定义字段和评论的关系
mysqli_query($blog, "UPDATE typecho_contents SET cid = $no WHERE cid = $cid");
mysqli_query($blog, "UPDATE typecho_relationships SET cid = $no WHERE cid = $cid");
mysqli_query($blog, "UPDATE typecho_comments SET cid = $no WHERE cid = $cid");
$no = $no + 1;
}
// 从数据库中选择所有文章cid，按其 cid 排序
$query_postRecord = "SELECT cid FROM typecho_contents ORDER BY cid ASC";
$result = mysqli_query($blog, $query_postRecord);
// 循环浏览文章并更新其 cid
while ($row = mysqli_fetch_assoc($result)) {
change_id($row['cid']);
}
// 重置文章 cid 的自动递增值
mysqli_query($blog, "ALTER TABLE typecho_contents AUTO_INCREMENT = $no");
echo 'ok';
?>
mid
<?php
/**
* Typecho重新排列分类和标签（meta）不连续的mid
*/
// 数据库参数
$hostname_blog = "localhost";
$database_blog = "数据库名";
$username_blog = "数据库用户名";
$password_blog = "数据库密码";
$blog = new mysqli($hostname_blog, $username_blog, $password_blog, $database_blog);
// 检查错误
if ($blog->connect_error) {
trigger_error($blog->connect_error, E_USER_ERROR);
}
// 定义全局变量以跟踪“no”值
$no = 1;
// 定义一个函数来更新 mid 及其关系
function change_id($mid)
{
global $no;
global $blog;
// 更新mid
$sql = "UPDATE typecho_metas SET mid = ? WHERE mid = ?";
$stmt = $blog->prepare($sql);
$stmt->bind_param("ii", $no, $mid);
$stmt->execute();
// 更新关系
$sql = "UPDATE typecho_relationships SET mid = ? WHERE mid = ?";
$stmt = $blog->prepare($sql);
$stmt->bind_param("ii", $no, $mid);
$stmt->execute();
// 递增“no”值
$no++;
}
// 从数据库中获取所有mid
$query_postRecord = "SELECT mid FROM typecho_metas ORDER BY mid ASC";
$all_postRecord = $blog->query($query_postRecord);
// 循环遍历结果并调用 change_id（） 函数
while ($row_postRecord = $all_postRecord->fetch_assoc()) {
change_id($row_postRecord['mid']);
}
// 重置typecho_metas表的自动增量值
$blog->query("ALTER TABLE typecho_metas AUTO_INCREMENT = $no");
echo 'ok';
?>
Handsome文件
component/aside.php 左边导航栏
component/comments.php 评论区
component/footer.php 底部版权、音乐播放器之类
component/header.php 页面头，没啥要改的
component/headnav.php 顶部导航
component/say.php 时光机动态
component/sidebar.php 右侧栏目
component/third_party_comments.php 3.3.0新增，第三方评论
css/ 博客CSS，一般不要改
fonts/ 博客字体，一般不要改
img/ 图像，一般不要改
js/ js文件，一般不要改
lang/ 语言文件
libs/Content.php 文章内容
libs/... 一般不要改
usr/ 另一个语言文件？
404.php 404界面
archive.php 整合
booklist.php 书单
cross.php 时光机
files.php 归档
functions.php 配置界面的东西
guestbook.php 留言板
index.php 首页
links.php 友链
page.php 文章页面整合
post.php 文章输出
color： 选填，不填默认为success（绿色），可选值：
light：白色
info：蓝色
dark：深色
success：绿色
black：黑色
warning：黄色
primary：紫色
danger：红色
