文字黑色背景加颜色反转

handsome/component/footer.php的最底下</html>上加这么一段代码

<!--文字黑色背景加颜色反转,开始-->
<style type="text/css">
   
span.heimu a.external,span.heimu a.external:visited,span.heimu a.extiw,span.heimu a.extiw:visited {
    color: #252525
}
.heimu,.heimu a,a .heimu,.heimu a.new {
    background-color: #252525;
    color: #252525;
    text-shadow: none
}
body:not(.heimu_toggle_on) .heimu:hover,body:not(.heimu_toggle_on) .heimu:active,body:not(.heimu_toggle_on) .heimu.off {
    transition: color .13s linear;
    color: #fff
}
body:not(.heimu_toggle_on) .heimu:hover a,body:not(.heimu_toggle_on) a:hover .heimu,body:not(.heimu_toggle_on) .heimu.off a,body:not(.heimu_toggle_on) a:hover .heimu.off {
    transition: color .13s linear;
    color: #add8e6
}
body:not(.heimu_toggle_on) .heimu.off .new,body:not(.heimu_toggle_on) .heimu.off .new:hover,body:not(.heimu_toggle_on) .new:hover .heimu.off,body:not(.heimu_toggle_on) .heimu.off .new,body:not(.heimu_toggle_on) .heimu.off .new:hover,body:not(.heimu_toggle_on) .new:hover .heimu.off {
    transition: color .13s linear;
    color: #ba0000
}
</style>
<!--文字黑色背景加颜色反转,结束-->

使用实列(为了防止解析,此处使用了中文!,引用时应为!):

!!!
<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/normalize.css追加以下代码

 .comment-content img{max-width:100%;}

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

typecho开启Gzip压缩

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

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

建议加在最上面。

血小板

handsome/component/footer.php的最底下</html>上加这么一段代码

<!--血小板开始-->
<script src="https://www.anyfan.top/xxb/js/live2d.js"></script>
<script src="https://www.anyfan.top/xxb/js/platelet.js"></script>
<script src="https://www.anyfan.top/xxb/js/renderer.js"></script>
<script type="text/javascript">
  loadlive2d("live2d", "https://www.anyfan.top/xxb//kesshouban_v2/model.json");
</script>
<!--血小板结束-->

</body>上加这么一段代码

<!--血小板开始-->
  <div class="platelet">
    <div class="platelet-tips"></div>
    <div style="width: 250px;overflow: hidden;">
      <canvas id="live2d" width="650" height="600" class="live2d" style="width: 325px;height: 300px;"></canvas>
    </div>
    <div class="platelet-tool">
      <i class="fa fa-home home"></i>
      <i class="fa fa-comment comment"></i>
      <i class="fa fa-info info"></i>
      <i class="fa fa-times xxbclose"></i>
    </div>
  </div>
  <div id="main" class="container"></div>
  <!--血小板结束-->

handsome/component/header.php<!--主题组件css文件加载-->上加这么一段代码

<!-- 血小板样式引用开始 -->
<link rel="stylesheet" href="https://www.anyfan.top/font-awesome/css/font-awesome.min.css">
<link href="https://www.anyfan.top/xxb/css/platelet.css" rel="stylesheet" type="text/css" />
<!-- 血小板样式引用结束-->

部分设置在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> </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>

博客底部左侧信息

<a href="//www.upyun.com/index.html" target="_blank"><img src="https://www.anyfan.top/usr/uploads/2020/05/2334571668.jpg" img width="60px" height="15px"></a>

博客底部右侧信息

<a  target="_blank"  href="http://www.beian.miit.gov.cn/">苏ICP备19060972号</a> |

自定义 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://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>
最后修改:2020 年 07 月 01 日 09 : 43 AM
赏口饭吃,行行好吧,客官!