代码类
博主介绍闪字效果
博主介绍
在主题外观设置:
初级设置
>博主的介绍
中添加下列代码
<!--博主介绍的闪字特效-->
<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>
主题音乐加载优化
主题视频加载优化
底部GitHub样式
自定义CSS
在主题外观设置:
开发者设置
>自定义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
}
左右侧添加信息
在
博客底部左侧信息
和 博客底部右侧信息
中分别添加如下代码
将下面的信息改成你自己的
<div class="github-badge">
<a href="./" title="© <?php echo date("Y"); ?> Stars_Kim">
<span class="badge-subject">Copyright</span><span class="badge-value bg-blue">© <?php echo date("Y"); ?> Stars_Kim</span>
</a>
</div>
将下面的信息改成你自己的
<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>
|
<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/component/footer.php
删除原有声明代码,以下为删除完后的效果(大概9~17行)
<div class="wrapper bg-light">
<span class="pull-right hidden-xs text-ellipsis">
<?php $this->options->BottomInfo(); ?>
<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>
|
<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>
</span>
<span class="text-ellipsis">
<div class="github-badge">
<a href="./" title="© <?php echo date("Y"); ?> Stars_Kim">
<span class="badge-subject">Copyright</span><span class="badge-value bg-blue">© <?php echo date("Y"); ?> Stars_Kim</span>
</a>
</div>
<?php $this->options->BottomleftInfo(); ?>
</span>
</div>
插件类
名称 | 描述 | 版本 | 作者 |
---|---|---|---|
CodePrettify | 基于 prismjs 的代码语法高亮插件可显示语言类型、行号,有复制功能 (请勿与其它同类插件同时启用,以免互相影响)详细说明:https://www.xcnte.com/archives/523/ | 2.1.5 | Xcnte |
CommentPush | 评论通知推送多服务 | 1.7.1 | 高彬展,奥秘Sir |
CommentToMail | 评论邮件提醒插件,可以通过网址监控运行 | 4.2.8 | Uniartisan |
DPlayer | DPlayer for typecho | 1.1.0 | Volio |
Handsome | handsomePro 唯一配套插件 | 7.3.1 | hewro,hanny |
Integration | Stars Kim'blog 整合功能插件 | 1.6.0 | Stars_Kim |
Login Designer | Login Designer博客登录/注册页面美化插件,提供多种美化样式 | 1.3.0 | 泽泽社长 |
MarkdownParse | 更快、更强的 Markdown 解析插件 | 1.2.3 | mrgeneral |
APlayer for Typecho Meting | 在 Typecho 中使用 APlayer 播放在线音乐吧~ | 2.1.2 | METO |
Pio | 一个简易的 Live2D 插件,在 @Jad 的项目上增加交互功能 | 2.4 | Dreamer-Paul |
ServerStatus | Typecho服务器状态插件 | 2.0.0 | Weifeng |
UserAgent | 显示评论人使用的操作系统和浏览器信息(Handsome主题专用更新时间:2020-3-5 |
1.1.1 | 松鼠大大 |