typecho设置备忘录

博主： anyfan
发布时间：2020 年 03 月 11 日
2421次浏览
暂无评论
3441字数
分类：学习

右侧全站字数

在 /handsome/component/sidebar.php文件的第 1行追加了以下代码

<?php
   //字数统计
   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;
   }
   ?>

在修改后的文件第 111行追加了以下代码

<li class="list-group-item text-second"><span class="blog-info-icons"><i data-feather="edit-2"></i></span><span class="badge pull-right"><?php echo allOfCharacters(); ?></span><?php _me("全站字数") ?></li>

文字黑色背景加颜色反转

使用实列:

!!!
<span class="heimu" title="这是一段文字">hello!</span>
!!!

hello!

心知天气

将以下代码复制到 handsome/component/headnav.php搜索提示下面，大概在 55行，
uid公钥和 hash私钥自己到心知天气注册获取，一个账号可以注册一个免费的，其余可自己DIY。

<!-- 知心天气-->
<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": "PpllKULMboB_K4-_P",
"hash": "SlpCFwmk62QPKzbvp"
});
tpwidget("show");</script>
<!-- 知心结束-->

解决后台图片过大

目录 /admin/css/style.css追加以下代码

.comment-content img{border: 0;max-height: 240px; max-width: 480px}.comment-content video{border: 0;max-height: 240px; max-width: 480px}

支持emoji表情

注意：utf8mb4编码在 PHP5.5以后才支持
进入 PhpMyadmin，选择对应的数据库，选择 操作——排序规则——选择 utf8mb4_unicode_ci并 执行。
选择SQL-复制下面sql语句代码-点击右下角执行

alter table typecho_comments convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_contents convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_fields convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_metas convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_options convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_relationships convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_users convert to character set utf8mb4 collate utf8mb4_unicode_ci;

网站根目录 config.inc.php配置文件中找到以下代码

'host' => localhost,
'user' => 'youruser',
'password' => 'yourpassword',
'charset' => 'utf8mb4', //将utf8修改为utf8mb4

文章声明

在 /handsome/post.php文件中的 文章页脚的广告位行上方，添加了以下代码

<br>
   <style>
       .cutline {
           border-top: 1px dotted #ccc;
           height: 1px;
           margin: 20px 0;
           text-align: center;
           width: 100%;
       }
       .cutline span {
           background-color: rgb(236, 237, 238);
           border: 1px solid #F17B8F;
           font: 12px Arial, Microsoft JhengHei;
           padding: 2px 4px;
           position: relative;
           top: -10px;
       }
       .cpright {
           padding: 10px;
           background: rgba(190, 190, 190, 0.1);
           margin: 8px 0;
           font-size: 13px;
           border-left: 3px #00bfff9f solid;
           position: relative;
           z-index: 1;
           font-family: "Microsoft Yahei", "Droid Serif", Georgia, "Times New Roman", STHeiti, serif;
           text-align: left;
       }
       .cpright a:hover {
           color: #ff7979e8 !important;
       }
       .cpright a {
           color: #00bfff ;
           margin: 4px;
       }
   </style>
   <div class="cutline">
       <span>
           <a style="color:#00BFFF;">正文到此结束</a>
       </span>
   </div>
   <div class="cpright">
       <span>
           本文作者: <a href="<?php $this->author->permalink(); ?>"><?php $this->author(); ?></a>
       </span>   文章标题：<a href="<?php $this->permalink() ?>"><?php $this->title() ?></a>
       <br>
       <span>
           本文地址：<a style="color: #ff7979e8;" href="<?php $this->permalink() ?>"><?php $this->permalink() ?></a>
       </span>   
       <br>
       <span>
           版权说明：若无注明，本文皆为“<a href="<?php $this->options->siteUrl(); ?>"
               target="_blank"><?php $this->options->title() ?></a>”原创，转载请保留文章出处。
       </span>
   </div>

typecho开启Gzip压缩

在根目录下的 index.php文件里面加上下面这一句就可以了：

/*添加Gzip*/
ob_start('ob_gzhandler');

建议加在最上面。

UserAgent插件

在 /handsome/component/comments.php文件的 73 行修改了代码

修改前

<b class="fn"><?php echo $author; ?></b>

修改后

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

在根目录的 config.inc.php文件中的末尾添加了以下代码

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

左侧栏友链添加头像

在 /handsome/component/aside.php文件中修改以下代码

修改前
修改后

<!--友情链接-->
<li>
    <a class="auto">
        <span class="pull-right text-muted">
            <i class="fontello icon-fw fontello-angle-right text"></i>
            <i class="fontello icon-fw fontello-angle-down text-active"></i>
        </span>
        <span class="nav-icon"><i data-feather="user"></i></span>
        <span><?php _me("友链") ?></span>
    </a>
    <ul class="nav nav-sub dk">
        <li class="nav-sub-header">
           <a data-no-instant>
                <span><?php _me("友链") ?></span>
            </a>
        </li>
        <!--使用links插件，输出全站友链-->
        <?php $mypattern1 = "<li data-original-title=\"{title}\" data-toggle=\"tooltip\" 
data-placement=\"top\"><a href=\"{url}\" target=\"_blank\"><span>{name}</span></a></li>";
                  Handsome_Plugin::output($mypattern1, 0, "ten");?>
    </ul>
</li>

<!--友情链接-->
<style>
    #user_img{
        width: 24px;
        border-radius: 50%;
    }
</style>
<li>
    <a class="auto">
        <span class="pull-right text-muted">
            <i class="fontello icon-fw fontello-angle-right text"></i>
            <i class="fontello icon-fw fontello-angle-down text-active"></i>
        </span>
        <span class="nav-icon"><i data-feather="user"></i></span>
        <span><?php _me("友链") ?></span>
    </a>
    <ul class="nav nav-sub dk">
        <li class="nav-sub-header">
           <a data-no-instant>
                <span><?php _me("友链") ?></span>
            </a>
        </li>
        <!--使用links插件，输出全站友链-->
        <?php $mypattern1 = "<li data-original-title=\"{title}\" data-toggle=\"tooltip\" 
data-placement=\"top\"><a href=\"{url}\" target=\"_blank\"><img src=\"{image}\" id=\"user_img\" \><span>{name}</span></a></li>";
                  Handsome_Plugin::output($mypattern1, 0, "ten");?>
    </ul>
</li>

部分设置在handsomeh后台的代码

博主介绍（需要自己取压缩代码）

这一种用到了js,文字是写入进去的，所以标题常常鬼畜。当然可以给它增加样式，固定它的位置宽度来解决。

<!--博主介绍的闪字特效-->
<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>

这一种则是纯css,对比上一款，个人现在比较喜欢这个，等看腻了在改别的吧。

<style type="text/css">.js_splitting .js_char {  display: inline-block;}.js_splitting .js_char {  position: relative;}.js_splitting .js_char::before,.js_splitting .js_char::after {  content: attr(data-js_char);  position: absolute;  top: 0;  left: 0;  visibility: hidden;  transition: inherit;  user-select: none;}.js_splitting {  --word-center: calc((var(--word-total) - 1) / 2);  --js_char-center: calc((var(--js_char-total) - 1) / 2);  --line-center: calc((var(--line-total) - 1) / 2);}.js_splitting {  --word-percent: calc(var(--word-index) / var(--word-total));  --line-percent: calc(var(--line-index) / var(--line-total));}.js_splitting .js_char {  --js_char-percent: calc(var(--js_char-index) / var(--js_char-total));  --js_char-offset: calc(var(--js_char-index) - var(--js_char-center));  --distance: calc(     (var(--js_char-offset) * var(--js_char-offset)) / var(--js_char-center)  );  --distance-sine: calc(var(--js_char-offset) / var(--js_char-center));  --distance-percent: calc((var(--distance) / var(--js_char-center)));}.js_loading .js_char {  overflow: hidden;  color: transparent;}.js_loading .js_char:before, .js_loading .js_char:after {  visibility: visible;  color: #000;}.js_loading .js_char:before {  animation: _before 1.8s cubic-bezier(0.9, 0, 0.2, 1) infinite;  animation-delay: calc( 0.9s + ( 0.1s * ( var(--js_char-index)) ) );  transform: translateY(0);  opacity: 1;}.js_loading .js_char:after {  animation: _after 1.8s cubic-bezier(0.9, 0, 0.2, 1) infinite;  animation-delay: calc( 0.9s + ( 0.1s * ( var(--js_char-index)) ) );  transform: translateY(100%);  opacity: 0;}@keyframes _before {  to {    transform: translateY(-100%);    opacity: 0;  }}@keyframes _after {  to {    transform: translate(0);    opacity: 1;  }}</style><span class="js_loading js_splitting">        <span class="js_char" data-js_char="中" style="--js_char-index:0;">中</span>        <span class="js_char" data-js_char="国" style="--js_char-index:1;">国</span>        <span class="js_char" data-js_char="当" style="--js_char-index:2;">当</span>        <span class="js_char" data-js_char="代" style="--js_char-index:3;">代</span>        <span class="js_char" data-js_char="粪" style="--js_char-index:4;">粪</span>        <span class="js_char" data-js_char="青" style="--js_char-index:5;">青</span></span>

自定义 CSS

/*头像呼吸光环和鼠标悬停旋转放大*/
.img-full {
width: 100px;
border-radius: 50%;
animation: light 4s ease-in-out infinite;
transition: 0.5s;
}
.img-full:hover {
transform: scale(1.15) rotate(720deg);
}
@keyframes light {
0% {
box-shadow: 0 0 4px #f00;
}

25% {
box-shadow: 0 0 16px #0f0;
}
50% {
box-shadow: 0 0 4px #00f;
}

75% {
box-shadow: 0 0 16px #0f0;
}

100% {
box-shadow: 0 0 4px #f00;
}
}

/*章图标和评论头像鼠标悬停旋转*/
.img-square {
transition: all 0.3s;
}
.img-square:hover {
transform: rotate(360deg);
}

/*文章内打赏动态图标*/
.btn-pay {
animation: star 0.5s ease-in-out infinite alternate;
}
@keyframes star {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}

/*表情自定义大小*/
.emotion-zcs_22/**(zcs_22为表情文件夹名称)**/ {
width: 45px;/*宽度，高度不用写，自适应*/
}
.comment-content-true img.emotion-zcs_22/*(zcs_22为表情文件夹名称)*/ {
max-width: 100%!important;
}

自定义 JavaScript

//禁用F12
document.onkeydown = function(){
if(window.event && window.event.keyCode == 123) {
    $.message({
    message: "这里真的没什么秘密。",
    title: "F12已禁用",
    type: "error",
    autoHide: !1,
    time: "2000"
    });
event.keyCode=0;
event.returnValue=false;
}
}

// 复制弹窗
kaygb_copy();
function kaygb_copy(){$(document).ready(function(){$("body").bind('copy',function(e){hellolayer()})});
function hellolayer(){
$.message({
    message: "尊重原创，转载请注明出处！",
    title: "复制成功",
    type: "warning",
    autoHide: !1,
    time: "3000"
    })
}}

自定义输出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 = "(/≧▽≦/)你又回来了！ " ;
        titleTime = setTimeout(function() {
            document.title = OriginTitile
        },
        2000)
    }
});
</script>

自定义输出body 尾部的HTML代码

<!-- 自定义右键-->
<style type="text/css">
    a {
        text-decoration: none;
    }

    div.usercm {
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        background-color: #fff;
        font-size: 13px !important;
        width: 130px;
        -moz-box-shadow: 1px 1px 3px rgba (0, 0, 0, .3);
        box-shadow: 0px 0px 15px #333;
        position: absolute;
        display: none;
        z-index: 10000;
        opacity: 0.9;
        border-radius: 8px;
    }

    div.usercm ul {
        list-style-type: none;
        list-style-position: outside;
        margin: 0px;
        padding: 0px;
        display: block
    }

    div.usercm ul li {
        margin: 0px;
        padding: 0px;
        line-height: 35px;
    }

    div.usercm ul li a {
        color: #666;
        padding: 0 15px;
        display: block
    }

    div.usercm ul li a:hover {
        color: #fff;
        background: rgba(4, 250, 250, 0.726)
    }

    div.usercm ul li a i {
        margin-right: 10px
    }

    a.disabled {
        color: #c8c8c8 !important;
        cursor: not-allowed
    }

    a.disabled:hover {
        background-color: rgba(255, 11, 11, 0) !important
    }

    div.usercm {
        background: #fff !important;
    }
</style>
<div class="usercm" style="left: 199px; top: 5px; display: none;">
    <ul>
        <li><a href="https://www.anyfan.top/"><i class="fa fa-home fa-fw"></i><span>首页</span></a></li>
        <li><a href="javascript:void(0);" onclick="getSelect();"><i class="fa fa-copy fa-fw"></i><span>复制</span></a>
        </li>
        <li><a href="javascript:history.go(1);"><i class="fa fa-arrow-right fa-fw"></i><span>前进</span></a></li>
        <li><a href="javascript:history.go(-1);"><i class="fa fa-arrow-left fa-fw"></i><span>后退</span></a></li>
        <li style="border-bottom:1px solid gray"><a href="javascript:window.location.reload();"><i
                    class="fa fa-refresh fa-fw"></i><span>重载网页</span></a></li>
        <li><a href="https://anyfan.top/links.html"><i class="fa fa-meh-o fa-fw"></i><span>和我当邻居</span></a></li>
        <li><a href="https://anyfan.top/reply.html"><i class="fa fa-pencil-square-o fa-fw"></i><span>给我留言吧</span></a>
        </li>
    </ul>
</div>
<script type="text/javascript">
    (function (a) {
        a.extend({
            mouseMoveShow: function (b) {
                var d = 0,
                    c = 0,
                    h = 0,
                    k = 0,
                    e = 0,
                    f = 0;
                a(window).mousemove(function (g) {
                    d = a(window).width();
                    c = a(window).height();
                    h = g.clientX;
                    k = g.clientY;
                    e = g.pageX;
                    f = g.pageY;
                    h + a(b).width() >= d && (e = e - a(b).width() - 5);
                    k + a(b).height() >= c && (f = f - a(b).height() - 5);
                    a("html").on({
                        contextmenu: function (c) {
                            3 == c.which && a(b).css({
                                left: e,
                                top: f
                            }).show()
                        },
                        click: function () {
                            a(b).hide()
                        }
                    })
                })
            },
            disabledContextMenu: function () {
                window.oncontextmenu = function () {
                    return !1
                }
            }
        })
    })(jQuery);

    function getSelect() {
        "" == (window.getSelection ? window.getSelection() : document.selection.createRange().text) ? $.message({
        message: "你想让我复制空气吗？",
        title: "你还没有选择文本",
        type: "warning",
        autoHide: !1,
        time: "2000"
        }) : document.execCommand("Copy")
    }
    $(function () {
        for (var a = navigator.userAgent, b = "Android;iPhone;SymbianOS;Windows Phone;iPad;iPod".split(";"), d = !0, c = 0; c < b.length; c++) if (0 < a.indexOf(b[c])) {
            d = !1;
            break
        }
        d && ($.mouseMoveShow(".usercm"), $.disabledContextMenu())
    });
</script>

最后修改：2021 年 09 月 24 日 04 : 33 PM

赏口饭吃，行行好吧，客官！

发表评论取消回复

评论 *

私密评论

名称 *

🎲

邮箱 *

地址

搭建mindustry“像素工厂”服务器
浏览次数: 11120
使用Cloudflare Workers反代Pixiv图片
浏览次数: 9593
网站开启cdn加速
浏览次数: 6407
hello world
浏览次数: 5874
血小板
浏览次数: 4887

tdscfqegvz
《晶灵的秘密》剧情片高清在线免费观看：https://www....
losidsoqbr
《开国领袖毛泽东》国产剧高清在线免费观看：https://ww...
oorpntyqhk
《我是大医生》大陆综艺高清在线免费观看：https://www...
ksfyqzrqgm
《貂蝉1958国语》爱情片高清在线免费观看：https://w...
tckjaeqpej
《逃离“自由”电影院》剧情片高清在线免费观看：https://...

C 编程守则
浏览次数: 690
个人网站存在的意义
浏览次数: 2652
纱雾最可爱了
浏览次数: 2317
搭建mindustry“像素工厂”服务器
浏览次数: 11120
首页静态化
浏览次数: 1564

32文章数目
125评论数目
5年151天运行天数
28.79 万全站字数
4 个月前最后活动

typecho设置备忘录

anyfan • 2020 年 03 月 11 日

右侧全站字数

在 /handsome/component/sidebar.php文件的第 1行追加了以下代码

<?php
   //字数统计
   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;
   }
   ?>

在修改后的文件第 111行追加了以下代码

<li class="list-group-item text-second"><span class="blog-info-icons"><i data-feather="edit-2"></i></span><span class="badge pull-right"><?php echo allOfCharacters(); ?></span><?php _me("全站字数") ?></li>

文字黑色背景加颜色反转

使用实列:

!!!
<span class="heimu" title="这是一段文字">hello!</span>
!!!

hello!

心知天气

<!-- 知心天气-->
<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": "PpllKULMboB_K4-_P",
"hash": "SlpCFwmk62QPKzbvp"
});
tpwidget("show");</script>
<!-- 知心结束-->

解决后台图片过大

目录 /admin/css/style.css追加以下代码

.comment-content img{border: 0;max-height: 240px; max-width: 480px}.comment-content video{border: 0;max-height: 240px; max-width: 480px}

支持emoji表情

alter table typecho_comments convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_contents convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_fields convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_metas convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_options convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_relationships convert to character set utf8mb4 collate utf8mb4_unicode_ci;
alter table typecho_users convert to character set utf8mb4 collate utf8mb4_unicode_ci;

网站根目录 config.inc.php配置文件中找到以下代码

'host' => localhost,
'user' => 'youruser',
'password' => 'yourpassword',
'charset' => 'utf8mb4', //将utf8修改为utf8mb4

文章声明

在 /handsome/post.php文件中的 文章页脚的广告位行上方，添加了以下代码

<br>
   <style>
       .cutline {
           border-top: 1px dotted #ccc;
           height: 1px;
           margin: 20px 0;
           text-align: center;
           width: 100%;
       }
       .cutline span {
           background-color: rgb(236, 237, 238);
           border: 1px solid #F17B8F;
           font: 12px Arial, Microsoft JhengHei;
           padding: 2px 4px;
           position: relative;
           top: -10px;
       }
       .cpright {
           padding: 10px;
           background: rgba(190, 190, 190, 0.1);
           margin: 8px 0;
           font-size: 13px;
           border-left: 3px #00bfff9f solid;
           position: relative;
           z-index: 1;
           font-family: "Microsoft Yahei", "Droid Serif", Georgia, "Times New Roman", STHeiti, serif;
           text-align: left;
       }
       .cpright a:hover {
           color: #ff7979e8 !important;
       }
       .cpright a {
           color: #00bfff ;
           margin: 4px;
       }
   </style>
   <div class="cutline">
       <span>
           <a style="color:#00BFFF;">正文到此结束</a>
       </span>
   </div>
   <div class="cpright">
       <span>
           本文作者: <a href="<?php $this->author->permalink(); ?>"><?php $this->author(); ?></a>
       </span>   文章标题：<a href="<?php $this->permalink() ?>"><?php $this->title() ?></a>
       <br>
       <span>
           本文地址：<a style="color: #ff7979e8;" href="<?php $this->permalink() ?>"><?php $this->permalink() ?></a>
       </span>   
       <br>
       <span>
           版权说明：若无注明，本文皆为“<a href="<?php $this->options->siteUrl(); ?>"
               target="_blank"><?php $this->options->title() ?></a>”原创，转载请保留文章出处。
       </span>
   </div>

typecho开启Gzip压缩

在根目录下的 index.php文件里面加上下面这一句就可以了：

/*添加Gzip*/
ob_start('ob_gzhandler');

建议加在最上面。

UserAgent插件

在 /handsome/component/comments.php文件的 73 行修改了代码

修改前

<b class="fn"><?php echo $author; ?></b>

修改后

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

在根目录的 config.inc.php文件中的末尾添加了以下代码

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

左侧栏友链添加头像

在 /handsome/component/aside.php文件中修改以下代码

修改前
修改后

<!--友情链接-->
<li>
    <a class="auto">
        <span class="pull-right text-muted">
            <i class="fontello icon-fw fontello-angle-right text"></i>
            <i class="fontello icon-fw fontello-angle-down text-active"></i>
        </span>
        <span class="nav-icon"><i data-feather="user"></i></span>
        <span><?php _me("友链") ?></span>
    </a>
    <ul class="nav nav-sub dk">
        <li class="nav-sub-header">
           <a data-no-instant>
                <span><?php _me("友链") ?></span>
            </a>
        </li>
        <!--使用links插件，输出全站友链-->
        <?php $mypattern1 = "<li data-original-title=\"{title}\" data-toggle=\"tooltip\" 
data-placement=\"top\"><a href=\"{url}\" target=\"_blank\"><span>{name}</span></a></li>";
                  Handsome_Plugin::output($mypattern1, 0, "ten");?>
    </ul>
</li>

<!--友情链接-->
<style>
    #user_img{
        width: 24px;
        border-radius: 50%;
    }
</style>
<li>
    <a class="auto">
        <span class="pull-right text-muted">
            <i class="fontello icon-fw fontello-angle-right text"></i>
            <i class="fontello icon-fw fontello-angle-down text-active"></i>
        </span>
        <span class="nav-icon"><i data-feather="user"></i></span>
        <span><?php _me("友链") ?></span>
    </a>
    <ul class="nav nav-sub dk">
        <li class="nav-sub-header">
           <a data-no-instant>
                <span><?php _me("友链") ?></span>
            </a>
        </li>
        <!--使用links插件，输出全站友链-->
        <?php $mypattern1 = "<li data-original-title=\"{title}\" data-toggle=\"tooltip\" 
data-placement=\"top\"><a href=\"{url}\" target=\"_blank\"><img src=\"{image}\" id=\"user_img\" \><span>{name}</span></a></li>";
                  Handsome_Plugin::output($mypattern1, 0, "ten");?>
    </ul>
</li>

部分设置在handsomeh后台的代码

博主介绍（需要自己取压缩代码）

这一种用到了js,文字是写入进去的，所以标题常常鬼畜。当然可以给它增加样式，固定它的位置宽度来解决。

<!--博主介绍的闪字特效-->
<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>

这一种则是纯css,对比上一款，个人现在比较喜欢这个，等看腻了在改别的吧。

<style type="text/css">.js_splitting .js_char {  display: inline-block;}.js_splitting .js_char {  position: relative;}.js_splitting .js_char::before,.js_splitting .js_char::after {  content: attr(data-js_char);  position: absolute;  top: 0;  left: 0;  visibility: hidden;  transition: inherit;  user-select: none;}.js_splitting {  --word-center: calc((var(--word-total) - 1) / 2);  --js_char-center: calc((var(--js_char-total) - 1) / 2);  --line-center: calc((var(--line-total) - 1) / 2);}.js_splitting {  --word-percent: calc(var(--word-index) / var(--word-total));  --line-percent: calc(var(--line-index) / var(--line-total));}.js_splitting .js_char {  --js_char-percent: calc(var(--js_char-index) / var(--js_char-total));  --js_char-offset: calc(var(--js_char-index) - var(--js_char-center));  --distance: calc(     (var(--js_char-offset) * var(--js_char-offset)) / var(--js_char-center)  );  --distance-sine: calc(var(--js_char-offset) / var(--js_char-center));  --distance-percent: calc((var(--distance) / var(--js_char-center)));}.js_loading .js_char {  overflow: hidden;  color: transparent;}.js_loading .js_char:before, .js_loading .js_char:after {  visibility: visible;  color: #000;}.js_loading .js_char:before {  animation: _before 1.8s cubic-bezier(0.9, 0, 0.2, 1) infinite;  animation-delay: calc( 0.9s + ( 0.1s * ( var(--js_char-index)) ) );  transform: translateY(0);  opacity: 1;}.js_loading .js_char:after {  animation: _after 1.8s cubic-bezier(0.9, 0, 0.2, 1) infinite;  animation-delay: calc( 0.9s + ( 0.1s * ( var(--js_char-index)) ) );  transform: translateY(100%);  opacity: 0;}@keyframes _before {  to {    transform: translateY(-100%);    opacity: 0;  }}@keyframes _after {  to {    transform: translate(0);    opacity: 1;  }}</style><span class="js_loading js_splitting">        <span class="js_char" data-js_char="中" style="--js_char-index:0;">中</span>        <span class="js_char" data-js_char="国" style="--js_char-index:1;">国</span>        <span class="js_char" data-js_char="当" style="--js_char-index:2;">当</span>        <span class="js_char" data-js_char="代" style="--js_char-index:3;">代</span>        <span class="js_char" data-js_char="粪" style="--js_char-index:4;">粪</span>        <span class="js_char" data-js_char="青" style="--js_char-index:5;">青</span></span>

自定义 CSS

/*头像呼吸光环和鼠标悬停旋转放大*/
.img-full {
width: 100px;
border-radius: 50%;
animation: light 4s ease-in-out infinite;
transition: 0.5s;
}
.img-full:hover {
transform: scale(1.15) rotate(720deg);
}
@keyframes light {
0% {
box-shadow: 0 0 4px #f00;
}

25% {
box-shadow: 0 0 16px #0f0;
}
50% {
box-shadow: 0 0 4px #00f;
}

75% {
box-shadow: 0 0 16px #0f0;
}

100% {
box-shadow: 0 0 4px #f00;
}
}

/*章图标和评论头像鼠标悬停旋转*/
.img-square {
transition: all 0.3s;
}
.img-square:hover {
transform: rotate(360deg);
}

/*文章内打赏动态图标*/
.btn-pay {
animation: star 0.5s ease-in-out infinite alternate;
}
@keyframes star {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}

/*表情自定义大小*/
.emotion-zcs_22/**(zcs_22为表情文件夹名称)**/ {
width: 45px;/*宽度，高度不用写，自适应*/
}
.comment-content-true img.emotion-zcs_22/*(zcs_22为表情文件夹名称)*/ {
max-width: 100%!important;
}

自定义 JavaScript

//禁用F12
document.onkeydown = function(){
if(window.event && window.event.keyCode == 123) {
    $.message({
    message: "这里真的没什么秘密。",
    title: "F12已禁用",
    type: "error",
    autoHide: !1,
    time: "2000"
    });
event.keyCode=0;
event.returnValue=false;
}
}

// 复制弹窗
kaygb_copy();
function kaygb_copy(){$(document).ready(function(){$("body").bind('copy',function(e){hellolayer()})});
function hellolayer(){
$.message({
    message: "尊重原创，转载请注明出处！",
    title: "复制成功",
    type: "warning",
    autoHide: !1,
    time: "3000"
    })
}}

自定义输出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 = "(/≧▽≦/)你又回来了！ " ;
        titleTime = setTimeout(function() {
            document.title = OriginTitile
        },
        2000)
    }
});
</script>

自定义输出body 尾部的HTML代码

<!-- 自定义右键-->
<style type="text/css">
    a {
        text-decoration: none;
    }

    div.usercm {
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        background-color: #fff;
        font-size: 13px !important;
        width: 130px;
        -moz-box-shadow: 1px 1px 3px rgba (0, 0, 0, .3);
        box-shadow: 0px 0px 15px #333;
        position: absolute;
        display: none;
        z-index: 10000;
        opacity: 0.9;
        border-radius: 8px;
    }

    div.usercm ul {
        list-style-type: none;
        list-style-position: outside;
        margin: 0px;
        padding: 0px;
        display: block
    }

    div.usercm ul li {
        margin: 0px;
        padding: 0px;
        line-height: 35px;
    }

    div.usercm ul li a {
        color: #666;
        padding: 0 15px;
        display: block
    }

    div.usercm ul li a:hover {
        color: #fff;
        background: rgba(4, 250, 250, 0.726)
    }

    div.usercm ul li a i {
        margin-right: 10px
    }

    a.disabled {
        color: #c8c8c8 !important;
        cursor: not-allowed
    }

    a.disabled:hover {
        background-color: rgba(255, 11, 11, 0) !important
    }

    div.usercm {
        background: #fff !important;
    }
</style>
<div class="usercm" style="left: 199px; top: 5px; display: none;">
    <ul>
        <li><a href="https://www.anyfan.top/"><i class="fa fa-home fa-fw"></i><span>首页</span></a></li>
        <li><a href="javascript:void(0);" onclick="getSelect();"><i class="fa fa-copy fa-fw"></i><span>复制</span></a>
        </li>
        <li><a href="javascript:history.go(1);"><i class="fa fa-arrow-right fa-fw"></i><span>前进</span></a></li>
        <li><a href="javascript:history.go(-1);"><i class="fa fa-arrow-left fa-fw"></i><span>后退</span></a></li>
        <li style="border-bottom:1px solid gray"><a href="javascript:window.location.reload();"><i
                    class="fa fa-refresh fa-fw"></i><span>重载网页</span></a></li>
        <li><a href="https://anyfan.top/links.html"><i class="fa fa-meh-o fa-fw"></i><span>和我当邻居</span></a></li>
        <li><a href="https://anyfan.top/reply.html"><i class="fa fa-pencil-square-o fa-fw"></i><span>给我留言吧</span></a>
        </li>
    </ul>
</div>
<script type="text/javascript">
    (function (a) {
        a.extend({
            mouseMoveShow: function (b) {
                var d = 0,
                    c = 0,
                    h = 0,
                    k = 0,
                    e = 0,
                    f = 0;
                a(window).mousemove(function (g) {
                    d = a(window).width();
                    c = a(window).height();
                    h = g.clientX;
                    k = g.clientY;
                    e = g.pageX;
                    f = g.pageY;
                    h + a(b).width() >= d && (e = e - a(b).width() - 5);
                    k + a(b).height() >= c && (f = f - a(b).height() - 5);
                    a("html").on({
                        contextmenu: function (c) {
                            3 == c.which && a(b).css({
                                left: e,
                                top: f
                            }).show()
                        },
                        click: function () {
                            a(b).hide()
                        }
                    })
                })
            },
            disabledContextMenu: function () {
                window.oncontextmenu = function () {
                    return !1
                }
            }
        })
    })(jQuery);

    function getSelect() {
        "" == (window.getSelection ? window.getSelection() : document.selection.createRange().text) ? $.message({
        message: "你想让我复制空气吗？",
        title: "你还没有选择文本",
        type: "warning",
        autoHide: !1,
        time: "2000"
        }) : document.execCommand("Copy")
    }
    $(function () {
        for (var a = navigator.userAgent, b = "Android;iPhone;SymbianOS;Windows Phone;iPad;iPod".split(";"), d = !0, c = 0; c < b.length; c++) if (0 < a.indexOf(b[c])) {
            d = !1;
            break
        }
        d && ($.mouseMoveShow(".usercm"), $.disabledContextMenu())
    });
</script>

右侧全站字数

文字黑色背景加颜色反转

心知天气

解决后台图片过大

支持emoji表情

文章声明

typecho开启Gzip压缩

UserAgent插件

左侧栏友链添加头像

部分设置在handsomeh后台的代码

博主介绍（需要自己取压缩代码）

自定义 CSS

自定义 JavaScript

自定义输出head 头部的HTML代码

自定义输出body 尾部的HTML代码

发表评论 取消回复

typecho设置备忘录

右侧全站字数

文字黑色背景加颜色反转

心知天气

解决后台图片过大

支持emoji表情

文章声明

typecho开启Gzip压缩

UserAgent插件

左侧栏友链添加头像

部分设置在handsomeh后台的代码

博主介绍（需要自己取压缩代码）

自定义 CSS

自定义 JavaScript

自定义输出head 头部的HTML代码

自定义输出body 尾部的HTML代码

发表评论取消回复