魔改记录,备忘总结

彩色标签云

彩色标签云

将以下代码复制添加至自定义JavaScript(控制台-外观-设置外观-开发者设置-自定义JavaScript)。

<!--彩色标签云-->
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;
});

网站加载耗时

网站加载耗时

右侧博客信息中增加加载耗时信息。
将以下代码添加至Typecho根目录/usr/themes/handsome/functions.php末尾。

//加载耗时
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;
}

将以下代码添加至Typecho根目录/usr/themes/handsome/component/sidebar.php合适位置。

  <li class="list-group-item text-second"><span class="blog-info-icons"> <i data-feather="clock"></i></span>
               <span class="badge
           pull-right"><?php echo timer_stop();?></span><?php _me("加载耗时") ?></li>

访客总数统计

访客总数统计

右侧博客信息中增加访客总数信息。
将以下代码添加至Typecho根目录/usr/themes/handsome/functions.php末尾。

//总访问量
function theAllViews()
    {
        $db = Typecho_Db::get();
        $row = $db->fetchAll('SELECT SUM(VIEWS) FROM `typecho_contents`');
            echo number_format($row[0]['SUM(VIEWS)']);
    }

将以下代码添加至Typecho根目录/usr/themes/handsome/component/sidebar.php合适位置。

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

开启gzip压缩

开启gzip压缩

找到Typecho的网站根目录中的index.php,在<?php 的下方添加如下代码:

//开启gzip压缩
ob_start('ob_gzhandler');

完成后可在gzip压缩检测检查效果。

左上角透明logo制作

左上角透明logo制作

yeelogologo制作网站,免费进行制作。傻瓜式操作,就不做详细描述了。

复制提醒

复制提醒

Handsome后台设置→开发者设置→自定义输出body 尾部的HTML插入以下是代码:

<!--layer.js-->
<script src="https://lib.baomitu.com/layer/3.1.1/layer.js"></script>

方法:将以下代码添加至后台-开发者设置-自定义JavaScript。

document.body.oncopy=function(){layer.msg('复制成功,若要转载请务必保留原文链接!');};

地址栏变化

地址栏变化

方法:将以下代码添加至后台-开发者设置-自定义JavaScript。

jQuery(document).ready(function(){function d(){document.title=document[b]?"(๐•̆ ·̭ •̆๐)  爱我别走!":a}var b,c,a=document.title;"undefined"!=typeof document.hidden?(b="hidden",c="visibilitychange"):"undefined"!=typeof document.mozHidden?(b="mozHidden",c="mozvisibilitychange"):"undefined"!=typeof document.webkitHidden&&(b="webkitHidden",c="webkitvisibilitychange"),("undefined"!=typeof document.addEventListener||"undefined"!=typeof document[b])&&document.addEventListener(c,d,!1)});

文章代码高亮

文章代码高亮


文章打赏图标跳动

文章打赏图标跳动

方法:添加到后台自定义CSS中

.btn-pay {
    animation: star 0.5s ease-in-out infinite alternate;
}

@keyframes star {
    from {
        transform: scale(1);
    }

    to {
        transform: scale(1.1);
    }
}

底部标签样式修改

底部标签样式修改

方法:添加到后台自定义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-red {
  background-color: #f00
}
.github-badge .bg-green {
  background-color: #3bca6e
}
.github-badge .bg-purple {
  background-color: #ab34e9
}

在handsome后台开发者设置->博客底部左侧信息填入下面代码,修改成自己的信息

<div class="github-badge">
<a href="./" title="©2019&nbsp;xiaoyang">
<span class="badge-subject">Copyright</span><span class="badge-value bg-blue">©2019&nbsp;xiaoyang</span>
</a>
</div>
&nbsp;|&nbsp;
<div class="github-badge">
<a href="http://www.miitbeian.gov.cn/" target="_blank" title="粤ICP备 123456号">
<span class="badge-subject">粤ICP备</span><span class="badge-value bg-green">123456号</span>
</a>
</div>

在handsome后台开发者设置->博客底部右侧信息填入下面代码,修改成自己的信息:

<div class="github-badge">
<a href="http://www.typecho.org" target="_blank" title="由 Typecho 强力驱动">
<span class="badge-subject">Powered</span><span class="badge-value bg-blue">Typecho</span>
</a>
</div>
&nbsp;|&nbsp; 
<div class="github-badge">
<a href="https://www.ihewro.com/archives/489/" target="_blank" title="站点使用 handsome 主题,作者:友人C">
<span class="badge-subject">Theme</span><span class="badge-value bg-orange">Handsome</span>
</a>
</div>

添加完以后,去handsome主题所在的文件夹目录handsome/component/footer.php中删除原来的版权声明代码,大约在1~12行,以下为修改完以后的样子:

<?php if (!defined('__TYPECHO_ROOT_DIR__')) exit; ?>
<?php Content::outputCommentJS($this, $this->security); ?>
</div><!-- /content -->
  <footer id="footer" class="app-footer" role="footer">
    <div class="wrapper b-t 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>
      <!--可以去除主题版权信息,最好保留版权信息或者添加主题信息到友链,谢谢你的理解-->

举国哀悼-定时设置网站全黑白

举国哀悼-定时设置网站全黑白


将以下代码直接复制到自定义JS中即可,理论所有网站都适用:

  ncov_gray();

    function ncov_gray() {
        var date = new Date();
        this.year = date.getFullYear();
        this.month = date.getMonth() + 1;
        this.date = date.getDate();

        var currentTime = this.year + "." + this.month + "." + this.date;
        if (currentTime == "2020.4.4") {
            $("html").css("filter", "grayscale(1)");
        }
    }

Last modification:August 7th, 2020 at 10:24 am
如果觉得我的文章对你有用,请随意赞赏