typecho+handsome折腾笔记02

Author：雁陎
发布时间：November 23, 2019
1424views
3 comments
12049字数
Categories：建站指南
百度收录：百度已收录

没想到居然还能整出第二篇，~~不过这一篇大多都是东抄西抄，博主进行整合而已~~，美化的首要原则仍然是不影响读者阅读体验，更不能有明显的卡顿现象（至少在我的PC环境中浏览我的博客没有出现卡顿）

前台美化插件-AliceStyle

这个插件来自@萌卜兔

自带13个默认效果：

首页文章列表获取焦点放大
首页头像自动旋转
首页文章版式阴影化
首页文章图片获取焦点放大
顶部彩色跑马灯特效
文章内打赏处插入menhera酱求打赏图片
文章内打赏图标跳动
右侧列表导航栏图标颜色
canvas动态背景
页面背景透明
主题盒子优化等效果
评论框打字粒子特效
博客信息标签和标签云彩色特效

于是我就可以卸载掉折腾笔记01中安装的ActivatePowerMode和彩色标签云插件了。

不喜欢某一效果？（比如我不喜欢顶部跑马灯，感觉加了之后有明显的卡顿）

打开/usr/plugins/AliceStyle/static/css/custom.css，注释掉某一特效即可

此外，该插件还带有看板娘、动态背景、鼠标样式功能（不过我都没有启用，具体效果请查看@萌卜兔的博客，个人觉得不加任何背景的透明样式最好看，可参见我的博客）

如果你博客启用了pjax，那就要添加相应的代码。比如彩色标签云要在PJAX中添加以下代码

<!--彩色标签云-->
let tags = document.querySelectorAll("#tag_cloud-2 a");
let colorArr = ["#428BCA", "#AEDCAE", "#ECA9A7", "#DA99FF", "#FFB380", "#D9B999"];
tags.forEach(tag => {
    tagsColor = colorArr[Math.floor(Math.random() * colorArr.length)];
    tag.style.backgroundColor = tagsColor;
});

博主介绍闪字效果

将以下代码加入后台设置->博主介绍中，当然，介绍文字要改成你自己的。

<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>

右边侧栏加入每日pixiv热榜图片

这是github上的一个小部件，理论上适用于任何平台（Wordpress、typecho等等）任何主题。我们仍以handsome为例，完成后的效果参见本博客右侧边栏。

将以下代码加到后台设置->开发者设置->全局右侧广告位

<iframe src="https://cloud.mokeyjay.com/pixiv" frameborder="0"  style="width:240px; height:380px;"></iframe>

然后修改handsome/component/sidebar.php

找到<h3 class="widget-title m-t-none text-md"><?php _me("广告") ?></h3>，将广告修改为p站每日热门

对，我这里是将原本广告位的位置替换为pixiv图片，如果你博客有展示广告的需求，请自行寻找其他可以放该部件的位置。

当然，你也可以自己部署该服务，参见github。

访客信息获取

这是一个插件，原文地址，只适配handsome插件，效果可以去原博查看，或者在本文底部评论查看效果。

使用方法

首先下载插件。

上传插件至plugins目录并解压，修改文件名为UserAgent。

打开Handsome/component/comments.php代码文件，大概第60~80行左右，将代码

<span class="comment-author vcard">
    <b class="fn"><?php echo $author; ?></b><?php echo $Identity; ?>
</span>

改为

<span class="comment-author vcard">
    <b class="fn"><?php echo $author; ?></b><?php echo $Identity; ?><?php UserAgent_Plugin::get_useragent($comments->agent,$comments->ip); ?>
</span>

后台启用插件，进行相关设置。

注意

使用CDN的同学，需要在Typecho博客网站的根目录的config.inc.php插入下面的代码：

//** 防止CDN造成无法获取客户真实IP地址 */
if(isset($_SERVER['HTTP_X_FORWARDED_FOR'])) 
{
    $list = explode(',',$_SERVER['HTTP_X_FORWARDED_FOR']);
    $_SERVER['REMOTE_ADDR'] = $list[0];
}

当然，仅仅是对静态资源做CDN加速（比如上篇博客中我的做法），是不需要这一步的。

一言api古诗词版

假如你是个古诗词爱好者，你可能希望将handsome自带的一言换为换成古诗词版的，刚好已经有人开发出这样的api了，我们直接调用即可。

今日诗词官网地址

我比较喜欢的一点是，它会自动获取访客ip，然后根据ip所在地、访问时间等信息来推荐相关的古诗词（比如如果你在上海的晚上打开网站，它就会推送有关江南、夜雨的古诗词），很妙。具体的推荐方式点我查看。

主题根目录下打开index.php，找到以下代码：

<small class="text-muted letterspacing indexWords"><?php
              if (@!in_array('hitokoto',$this->options->featuresetup)) {
                  $this->options->Indexwords();
              }else{
                  echo '加载中……';
                  echo '<script>
                         $.ajax({
                            type: \'Get\',
                            url: \'https://v1.hitokoto.cn/\',
                            success: function(data) {
                               var hitokoto = data.hitokoto;
                              $(\'.indexWords\').text(hitokoto);
                            }
                         });
</script>';
              }
              ?></small>

更改为以下代码：

<small class="text-muted letterspacing indexWords"><span id="jinrishici-sentence">正在加载今日诗词....</span>
<script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></script></small>

当然，别忘了在主题后台启用主题增强功能->增强功能开关->启用一言接口

标题栏title自动变化

来自@友人C

实现效果为离开网站页面和重新回到网站页面时动态显示不同文字，参见我的博客。

我把代码中的ico注释掉了，感觉没有必要设置多个ico，如果你有需求可以去掉注释。

把下面的代码添加到开发者设置->自定义输出head 头部的HTML代码中即可。

<script>
var OriginTitile = document.title,
titleTime;
document.addEventListener("visibilitychange",
function() {
    if (document.hidden) {
        //$('[rel="shortcut icon"]').attr("href", "//www.dreamwings.cn/queue/wp-content/uploads/2016/05/fail.ico");
        document.title = "页面已崩溃！点击恢复！";
        clearTimeout(titleTime)
    } else {
        //$('[rel="shortcut icon"]').attr("href", "//www.ihewro.com/favicon.ico");
        document.title = "(/≧▽≦/)咦！又好了！ " + OriginTitile;
        titleTime = setTimeout(function() {
            document.title = OriginTitile
        },
        2000)
    }
});
</script>

时间轴

来自@余生's Blog，准确来说，它只是一段随时可调用的html代码，但是我觉得它挺好看的，用在文章或者博客介绍中或许不错。

首先下载timeline.css并放到你自己的服务器中

然后你可以在任何文章或页面内调用以下代码（自行修改css引用地址）

!!!
<meta charset="utf-8" />
<title>
    时光轴
</title>
<link rel="stylesheet" href="https://www.sitstars.com/yanshu/timeline.css" type="text/css" />
<!--
<style type="text/css">
</style>
-->
<ul class="cbp_tmtimeline">
    <li>
        <time class="cbp_tmtime"> <span>2019-11-07</span></time> 
        <div class="cbp_tmlabel">
            <p>
                截止 2019-11-07 号。总更新文章 38 篇
            </p>
        </div>
    </li>
    <li>
        <time class="cbp_tmtime"> <span>2019-10-12</span></time> 
        <div class="cbp_tmlabel">
            <p>
                域名更换为sitstars.com，决定认真做站！
            </p>
        </div>
    </li>
    <li>
        <time class="cbp_tmtime"> <span>2019-10-01</span></time> 
        <div class="cbp_tmlabel">
            <p>
                历经大半年雁陎终于又更新了一次博客！
            </p>
        </div>
    </li>
</ul>
!!!

显示效果

时光轴

2019-11-07

截止 2019-11-07 号。总更新文章 38 篇
2019-10-12

域名更换为sitstars.com，决定认真做站！
2019-10-01

历经大半年雁陎终于又更新了一次博客！

typecho要想直接显示html效果，需要用!!!把html代码包裹住

右侧导航栏添加加载耗时与访客总数

参考资料：https://slske.com/9.html

因为handsome6.0.0版本开启了functions.php加密，所以我们需要通过其他手段修改。

首先打开/var/Widget/Archive.php，添加以下代码

/** 初始化皮肤函数01 */
$functionsFile01 = $this->_themeDir . 'functions01.php';
if ((!$this->_invokeFromOutside || $this->parameter->type == 404) && file_exists($functionsFile01)) {
    require_once $functionsFile01;
    if (function_exists('themeInit')) {
        themeInit($this);
    }
}

接着在主题文件夹下，如我的是/usr/themes/handsome新建一个functions01.php，填入以下代码：

<?php
if (!defined('__TYPECHO_ROOT_DIR__')) exit;
        
//加载耗时
    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 theAllViews(){
    $db = Typecho_Db::get();
    $row = $db->fetchAll('SELECT SUM(VIEWS) FROM `typecho_contents`');
        echo number_format($row[0]['SUM(VIEWS)']);}
?>

最后打开/usr/themes/handsome/component/sidebar.php，大概在86行之后的位置，添加以下代码：

<li class="list-group-item text-second"> <span class="glyphicon glyphicon-user text-muted"></span> <span class="badge
            pull-right"><?php echo theAllViews();?></span>&nbsp;<?php _me("访客总数") ?></li>

<li class="list-group-item text-second"> <span class="glyphicon glyphicon-time text-muted"></span> <span class="badge
           pull-right"><?php echo timer_stop();?></span>&nbsp;<?php _me("加载耗时") ?></li>

添加百度已收录

打开/usr/themes/handsome/functions01.php，添加以下代码：

/*提示文章百度是否收录*/
function baidu_record() {
$url='http://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];

if(checkBaidu($url)==1)
{echo "百度已收录";
}
else
{echo "<a style=\"color:red;\" rel=\"external nofollow\" title=\"点击提交收录！\" target=\"_blank\" 
href=\"http://zhanzhang.baidu.com/sitesubmit/index?sitename=$url\">百度未收录</a>";}
}
function checkBaidu($url) {
$url = 'http://www.baidu.com/s?wd=' . urlencode($url);
$curl = curl_init();
curl_setopt($curl, CURLOPT_URL, $url);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
$rs = curl_exec($curl);
curl_close($curl);
if (!strpos($rs, '没有找到')) { //没有找到说明已被百度收录
return 1;
} else {
return -1;
}
}

打开/usr/themes/handsome/post.php，添加以下代码：

<li class="meta-categories"><i class="glyphicon glyphicon-ok-circle" aria-hidden="true"></i> <span class="sr-only"><?php _me("百度收录") ?>：</span> <span class="meta-value"><?php echo baidu_record() ?></span></li>

版权属于：雁陎
本文链接：https://www.sitstars.com/archives/65/
转载时须注明出处及本声明

Last modification：March 24th, 2020 at 01:32 am

3 comments

文劢
February 4th, 2020 at 02:42 pm

那个右边侧栏加入每日pixiv热榜图片我这里弄了不行请问咋回事图片https://ae01.alicdn.com/kf/U4fbf3c3780a44ac3b900a530f8974cce5.png

Reply
1. 雁陎Author
  February 5th, 2020 at 03:24 pm
  
  @文劢
  更新了，把新代码写进去就行
  
  Reply
2. 雁陎Author
  February 5th, 2020 at 03:23 pm
  
  @文劢
  代码写错了。
  
  Reply

typecho+handsome折腾笔记02

雁陎 • 2019 年 11 月 23 日

前台美化插件-AliceStyle

这个插件来自@萌卜兔

自带13个默认效果：

首页文章列表获取焦点放大
首页头像自动旋转
首页文章版式阴影化
首页文章图片获取焦点放大
顶部彩色跑马灯特效
文章内打赏处插入menhera酱求打赏图片
文章内打赏图标跳动
右侧列表导航栏图标颜色
canvas动态背景
页面背景透明
主题盒子优化等效果
评论框打字粒子特效
博客信息标签和标签云彩色特效

于是我就可以卸载掉折腾笔记01中安装的ActivatePowerMode和彩色标签云插件了。

不喜欢某一效果？（比如我不喜欢顶部跑马灯，感觉加了之后有明显的卡顿）

打开/usr/plugins/AliceStyle/static/css/custom.css，注释掉某一特效即可

如果你博客启用了pjax，那就要添加相应的代码。比如彩色标签云要在PJAX中添加以下代码

<!--彩色标签云-->
let tags = document.querySelectorAll("#tag_cloud-2 a");
let colorArr = ["#428BCA", "#AEDCAE", "#ECA9A7", "#DA99FF", "#FFB380", "#D9B999"];
tags.forEach(tag => {
    tagsColor = colorArr[Math.floor(Math.random() * colorArr.length)];
    tag.style.backgroundColor = tagsColor;
});

博主介绍闪字效果

将以下代码加入后台设置->博主介绍中，当然，介绍文字要改成你自己的。

<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>

右边侧栏加入每日pixiv热榜图片

这是github上的一个小部件，理论上适用于任何平台（Wordpress、typecho等等）任何主题。我们仍以handsome为例，完成后的效果参见本博客右侧边栏。

将以下代码加到后台设置->开发者设置->全局右侧广告位

<iframe src="https://cloud.mokeyjay.com/pixiv" frameborder="0"  style="width:240px; height:380px;"></iframe>

然后修改handsome/component/sidebar.php

找到<h3 class="widget-title m-t-none text-md"><?php _me("广告") ?></h3>，将广告修改为p站每日热门

对，我这里是将原本广告位的位置替换为pixiv图片，如果你博客有展示广告的需求，请自行寻找其他可以放该部件的位置。

当然，你也可以自己部署该服务，参见github。

访客信息获取

这是一个插件，原文地址，只适配handsome插件，效果可以去原博查看，或者在本文底部评论查看效果。

使用方法

首先下载插件。

上传插件至plugins目录并解压，修改文件名为UserAgent。

打开Handsome/component/comments.php代码文件，大概第60~80行左右，将代码

<span class="comment-author vcard">
    <b class="fn"><?php echo $author; ?></b><?php echo $Identity; ?>
</span>

改为

<span class="comment-author vcard">
    <b class="fn"><?php echo $author; ?></b><?php echo $Identity; ?><?php UserAgent_Plugin::get_useragent($comments->agent,$comments->ip); ?>
</span>

后台启用插件，进行相关设置。

注意

使用CDN的同学，需要在Typecho博客网站的根目录的config.inc.php插入下面的代码：

//** 防止CDN造成无法获取客户真实IP地址 */
if(isset($_SERVER['HTTP_X_FORWARDED_FOR'])) 
{
    $list = explode(',',$_SERVER['HTTP_X_FORWARDED_FOR']);
    $_SERVER['REMOTE_ADDR'] = $list[0];
}

当然，仅仅是对静态资源做CDN加速（比如上篇博客中我的做法），是不需要这一步的。

一言api古诗词版

假如你是个古诗词爱好者，你可能希望将handsome自带的一言换为换成古诗词版的，刚好已经有人开发出这样的api了，我们直接调用即可。

今日诗词官网地址

我比较喜欢的一点是，它会自动获取访客ip，然后根据ip所在地、访问时间等信息来推荐相关的古诗词（比如如果你在上海的晚上打开网站，它就会推送有关江南、夜雨的古诗词），很妙。具体的推荐方式点我查看。

主题根目录下打开index.php，找到以下代码：

<small class="text-muted letterspacing indexWords"><?php
              if (@!in_array('hitokoto',$this->options->featuresetup)) {
                  $this->options->Indexwords();
              }else{
                  echo '加载中……';
                  echo '<script>
                         $.ajax({
                            type: \'Get\',
                            url: \'https://v1.hitokoto.cn/\',
                            success: function(data) {
                               var hitokoto = data.hitokoto;
                              $(\'.indexWords\').text(hitokoto);
                            }
                         });
</script>';
              }
              ?></small>

更改为以下代码：

<small class="text-muted letterspacing indexWords"><span id="jinrishici-sentence">正在加载今日诗词....</span>
<script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></script></small>

当然，别忘了在主题后台启用主题增强功能->增强功能开关->启用一言接口

标题栏title自动变化

来自@友人C

实现效果为离开网站页面和重新回到网站页面时动态显示不同文字，参见我的博客。

我把代码中的ico注释掉了，感觉没有必要设置多个ico，如果你有需求可以去掉注释。

把下面的代码添加到开发者设置->自定义输出head 头部的HTML代码中即可。

<script>
var OriginTitile = document.title,
titleTime;
document.addEventListener("visibilitychange",
function() {
    if (document.hidden) {
        //$('[rel="shortcut icon"]').attr("href", "//www.dreamwings.cn/queue/wp-content/uploads/2016/05/fail.ico");
        document.title = "页面已崩溃！点击恢复！";
        clearTimeout(titleTime)
    } else {
        //$('[rel="shortcut icon"]').attr("href", "//www.ihewro.com/favicon.ico");
        document.title = "(/≧▽≦/)咦！又好了！ " + OriginTitile;
        titleTime = setTimeout(function() {
            document.title = OriginTitile
        },
        2000)
    }
});
</script>

时间轴

来自@余生's Blog，准确来说，它只是一段随时可调用的html代码，但是我觉得它挺好看的，用在文章或者博客介绍中或许不错。

首先下载timeline.css并放到你自己的服务器中

然后你可以在任何文章或页面内调用以下代码（自行修改css引用地址）

!!!
<meta charset="utf-8" />
<title>
    时光轴
</title>
<link rel="stylesheet" href="https://www.sitstars.com/yanshu/timeline.css" type="text/css" />
<!--
<style type="text/css">
</style>
-->
<ul class="cbp_tmtimeline">
    <li>
        <time class="cbp_tmtime"> <span>2019-11-07</span></time> 
        <div class="cbp_tmlabel">
            <p>
                截止 2019-11-07 号。总更新文章 38 篇
            </p>
        </div>
    </li>
    <li>
        <time class="cbp_tmtime"> <span>2019-10-12</span></time> 
        <div class="cbp_tmlabel">
            <p>
                域名更换为sitstars.com，决定认真做站！
            </p>
        </div>
    </li>
    <li>
        <time class="cbp_tmtime"> <span>2019-10-01</span></time> 
        <div class="cbp_tmlabel">
            <p>
                历经大半年雁陎终于又更新了一次博客！
            </p>
        </div>
    </li>
</ul>
!!!

显示效果

时光轴

2019-11-07

截止 2019-11-07 号。总更新文章 38 篇
2019-10-12

域名更换为sitstars.com，决定认真做站！
2019-10-01

历经大半年雁陎终于又更新了一次博客！

typecho要想直接显示html效果，需要用!!!把html代码包裹住

右侧导航栏添加加载耗时与访客总数

参考资料：https://slske.com/9.html

因为handsome6.0.0版本开启了functions.php加密，所以我们需要通过其他手段修改。

首先打开/var/Widget/Archive.php，添加以下代码

/** 初始化皮肤函数01 */
$functionsFile01 = $this->_themeDir . 'functions01.php';
if ((!$this->_invokeFromOutside || $this->parameter->type == 404) && file_exists($functionsFile01)) {
    require_once $functionsFile01;
    if (function_exists('themeInit')) {
        themeInit($this);
    }
}

接着在主题文件夹下，如我的是/usr/themes/handsome新建一个functions01.php，填入以下代码：

<?php
if (!defined('__TYPECHO_ROOT_DIR__')) exit;
        
//加载耗时
    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 theAllViews(){
    $db = Typecho_Db::get();
    $row = $db->fetchAll('SELECT SUM(VIEWS) FROM `typecho_contents`');
        echo number_format($row[0]['SUM(VIEWS)']);}
?>

最后打开/usr/themes/handsome/component/sidebar.php，大概在86行之后的位置，添加以下代码：

<li class="list-group-item text-second"> <span class="glyphicon glyphicon-user text-muted"></span> <span class="badge
            pull-right"><?php echo theAllViews();?></span>&nbsp;<?php _me("访客总数") ?></li>

<li class="list-group-item text-second"> <span class="glyphicon glyphicon-time text-muted"></span> <span class="badge
           pull-right"><?php echo timer_stop();?></span>&nbsp;<?php _me("加载耗时") ?></li>

添加百度已收录

打开/usr/themes/handsome/functions01.php，添加以下代码：

/*提示文章百度是否收录*/
function baidu_record() {
$url='http://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];

if(checkBaidu($url)==1)
{echo "百度已收录";
}
else
{echo "<a style=\"color:red;\" rel=\"external nofollow\" title=\"点击提交收录！\" target=\"_blank\" 
href=\"http://zhanzhang.baidu.com/sitesubmit/index?sitename=$url\">百度未收录</a>";}
}
function checkBaidu($url) {
$url = 'http://www.baidu.com/s?wd=' . urlencode($url);
$curl = curl_init();
curl_setopt($curl, CURLOPT_URL, $url);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
$rs = curl_exec($curl);
curl_close($curl);
if (!strpos($rs, '没有找到')) { //没有找到说明已被百度收录
return 1;
} else {
return -1;
}
}

打开/usr/themes/handsome/post.php，添加以下代码：

<li class="meta-categories"><i class="glyphicon glyphicon-ok-circle" aria-hidden="true"></i> <span class="sr-only"><?php _me("百度收录") ?>：</span> <span class="meta-value"><?php echo baidu_record() ?></span></li>

版权属于：雁陎
本文链接：https://www.sitstars.com/archives/65/
转载时须注明出处及本声明

typecho+handsome折腾笔记02

前台美化插件-AliceStyle

博主介绍闪字效果

右边侧栏加入每日pixiv热榜图片

访客信息获取

一言api古诗词版

标题栏title自动变化

时间轴

右侧导航栏添加加载耗时与访客总数

添加百度已收录

3 comments

Leave a Comment Cancel reply

博客免费送微软A1子账号（onedrive5T）

不同网盘资源转存方案汇总

自动生成googledrive指定目录的markdown格式的文件夹结构

微信公众号更新记录

一个支持分发上传、私有云的图床程序-Hidove搭建教程

github与coding双线部署hexo教程

【译】11个新的python web框架

ipfs搭建教程

机器学习相关概念汇总

markdown语法大全

typecho+handsome折腾笔记02

前台美化插件-AliceStyle

博主介绍闪字效果

右边侧栏加入每日pixiv热榜图片

访客信息获取

一言api古诗词版

标题栏title自动变化

时间轴

右侧导航栏添加加载耗时与访客总数

添加百度已收录