√
的即为本人博客所采用样式
本站基本环境:
- Typecho:1.1(17.10.30)
- handsome:8.4.0 Pro
1、头像
1.1 头像呼吸光环
设置外观 → 开发者设置 → 自定义 CSS
/* 头像呼吸光环——begin */
@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; }
}
/* 头像呼吸光环——over */
1.2 头像栏右侧羽毛
设置外观 → 开发者设置 → 自定义 CSS
/* 头像栏右侧羽毛——begin */
.dropdown.wrapper {
background:url(https://blog-images-1309598269.cos.ap-beijing.myqcloud.com/attire%2F%E7%BE%BD%E6%AF%9B.webp) right bottom no-repeat;
}
/* 头像栏右侧羽毛——over */
1.3 头像旁打字介绍效果
设置外观 → 初级设置 → 博主的介绍
<!-- 头像旁打字介绍效果——begin -->
<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>
<!-- 头像旁打字介绍效果——over -->
1.4 头像鼠标悬停旋转放大
设置外观 → 开发者设置 → 自定义 CSS
/* 头像鼠标悬停旋转放大——begin */
.img-full {
width: 100px;
border-radius: 50%;
animation: light 4s ease-in-out infinite;
transition: 0.5s;
}
.vertical-avatar img:hover {
transform: scale(1.15) rotate(720deg);
}
/* 头像鼠标悬停旋转放大——over */
2、标签云
2.1 等距标签云
设置外观 → 开发者设置 → 自定义 CSS
/* 标签云等距美化——begin */
#tag_cloud-2 a {
border-radius: 5px;
width: 32%;
}
/* 标签云等距美化——over */
2.2 彩色标签云及左侧图标颜色
设置外观 → 开发者设置 → 自定义 JavaScript
如果主题中启用了 pjax,还需要将下述代码添加到设置外观 → PJAX → PJAX 回调函数
/* 彩色标签云及彩色图标——begin */
let tags = document.querySelectorAll("#tag_cloud-2 a");
let infos = document.querySelectorAll(".badge");
let colorArr = ["#428BCA", "#AEDCAE", "#ECA9A7", "#DA99FF", "#FFB380", "#D9B999"];
tags.forEach(tag => {
tagsColor = colorArr[Math.floor(Math.random() * colorArr.length)];
tag.style.backgroundColor = tagsColor;
});
infos.forEach(info => {
infosColor = colorArr[Math.floor(Math.random() * colorArr.length)];
info.style.backgroundColor = infosColor;
});
function addNumber(a) {
var length = document.getElementById("comment").value.length;
if(length> 0){
document.getElementById("comment").focus()
document.getElementById("comment").value += '\n' + a + new Date
}else{
document.getElementById("comment").focus()
document.getElementById("comment").value += a + new Date
}
}
let leftHeader = document.querySelectorAll("span.nav-icon>svg,span.nav-icon>i");
let leftHeaderColorArr = ["#FF69B4", "#58c7ea", "#E066FF", "#FF69B4", "#FFA54F", "#90EE90", "#0043ff", "#cc00ff", "#8e7cc3", "#A0522D", "#FF7256", "#FFA500", "#8B0000", "#7CFC00", "#4EEE94", "#00FFFF", "#EE0000"];
leftHeader.forEach(tag => {
tagsColor = leftHeaderColorArr[Math.floor(Math.random() * leftHeaderColorArr.length)];
tag.style.color = tagsColor
});
/* 彩色标签云及彩色图标——over */
本站只有标签云颜色随机,其余左侧的图标和右侧的统计信息等颜色已固定
/* 彩色标签云——begin */
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;
});
function addNumber(a) {
var length = document.getElementById("comment").value.length;
if(length> 0){
document.getElementById("comment").focus()
document.getElementById("comment").value += '\n' + a + new Date
}else{
document.getElementById("comment").focus()
document.getElementById("comment").value += a + new Date
}
}
/* 彩色标签云——over */
3、文章
3.1 首页文章版式阴影化
设置外观 → 开发者设置 → 自定义 CSS
/* 首页文章版式阴影化——begin */
.panel{
box-shadow: 1px 1px 5px 5px rgba(232, 212, 220, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255,112,173,0.35);
}
.panel:hover{
box-shadow: 1px 1px 5px 5px rgba(232, 212, 220, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255,112,173,0.35);
}
.panel-small{
box-shadow: 1px 1px 5px 5px rgba(232, 212, 220, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255,112,173,0.35);
}
.panel-small:hover{
box-shadow: 1px 1px 5px 5px rgba(232, 212, 220, 0.35);
-moz-box-shadow: 1px 1px 5px 5px rgba(255,112,173,0.35);
}
.app.container {
box-shadow: 0 0 30px rgba(255, 112, 173, 0.35);
}
/* 首页文章版式阴影化——over */
3.2 首页文章版式圆角化
设置外观 → 开发者设置 → 自定义 CSS
/* 首页文章版式圆角化——begin */
.panel{
border: none;
border-radius: 15px;
}
.panel-small{
border: none;
border-radius: 15px;
}
.item-thumb{
border-radius: 15px;
}
/* 首页文章版式圆角化——over */
3.3 文章列表悬停上浮
设置外观 → 开发者设置 → 自定义 CSS
/* 文章列表悬停上浮——begin */
.blog-post .panel-small:not(article),
.blog-post .panel:not(article) {
transition: all 0.3s;
}
.blog-post .panel-small:not(article):hover,
.blog-post .panel:not(article):hover {
transform: translateY(-10px);
box-shadow: 0 8px 10px rgba(73, 90, 47, 0.47);
}
/* 文章列表悬停上浮——over */
3.4 文章列表头图悬停放大并隐藏超出范围部分
设置外观 → 开发者设置 → 自定义 CSS
/* 文章列表头图悬停放大并隐藏超出范围部分——begin */
.index-post-img {
overflow: hidden;
}
.item-thumb,
.item-thumb-small {
transition: all 0.3s;
}
.item-thumb:hover,
.item-thumb-small:hover {
transform: scale(1.05)
}
/* 文章列表头图悬停放大并隐藏超出范围部分——over */
3.5 文章内头图和图片悬停放大并隐藏超出范围部分
设置外观 → 开发者设置 → 自定义 CSS
/* 文章内头图和图片悬停放大并隐藏超出范围部分——begin */
.entry-thumbnail {
overflow: hidden;
}
#post-content img {
border-radius: 10px;
transition: 0.5s;
}
#post-content img:hover {
transform: scale(1.05);
}
/* 文章内头图和图片悬停放大并隐藏超出范围部分——over */
本站中,针对文章,只有文章最上面的头图配置了悬停放大,其内容部分图片不设置
/* 文章内头图和图片悬停放大并隐藏超出范围部分——begin */
.entry-thumbnail {
overflow: hidden;
}
#post-content img {
border-radius: 10px;
}
/* 文章内头图和图片悬停放大并隐藏超出范围部分——over */
3.6 左侧文章图标和评论头像圆角化且鼠标悬停旋转图标
设置外观 → 开发者设置 → 自定义 CSS
/* 左侧文章图标和评论头像圆角化且鼠标悬停旋转图标——begin */
.img-square {
transition: all 0.3s;
border-radius: 50%;
}
.img-square:hover {
transform: rotate(360deg);
}
/* 左侧文章图标和评论头像圆角化且鼠标悬停旋转图标——over */
/* 文章内头图和文章图片悬停放大并将超出范围隐藏——begin */
.entry-thumbnail {
overflow: hidden;
}
/* 文章内头图和文章图片悬停放大并将超出范围隐藏——over */
3.7 文章内段落与列表间隙缩小
设置外观 → 开发者设置 → 自定义 CSS
/* 文章内段落与列表间隙缩小——begin */
#post-content ul, #post-content pre, #post-content ul p, #post-content ol, #post-content ol p {
margin: 0;
}
#post-content blockquote {
margin: 1.5em 0;
}
#post-content p {
margin:10px 0 10px 0;
}
/* 文章内段落与列表间隙缩小——over */
3.8 自定义文章顺序
找到 var/Widget/Archive.php
文件中此行代码,将 created
更改为 order
,发不完文章后可以去数据库中自定义顺序
3.9 文章内容标题字体调整
设置外观 → 开发者设置 → 自定义 CSS
/* 文章内容标题字体调整——begin */
#post-content h2 {
font-size: 28px;
}
#post-content h3 {
font-size: 24px;
}
#post-content h4 {
font-size: 20px;
}
/* 文章内容标题字体调整——over */
4、背景
4.1 气泡背景
设置外观 → 开发者设置 → 自定义输出 body 尾部的 HTML 代码
<!-- 气泡背景——begin -->
<div id="bubble"></div>
<script>class BGBubble {
constructor(i) {
this.defaultOpts = {
id: '', // 容器ID
num: 100, // 个数
start_probability: 0.1, // 如果数量小于num,有这些几率添加一个新的
radius_min: 1, // 初始半径最小值
radius_max: 2, // 初始半径最大值
radius_add_min: .3, // 半径增加最小值
radius_add_max: .5, // 半径增加最大值
opacity_min: 0.3, // 初始透明度最小值
opacity_max: 0.5, // 初始透明度最大值
opacity_prev_min: .003, // 透明度递减值最小值
opacity_prev_max: .005, // 透明度递减值最大值
light_min: 40, // 颜色亮度最小值
light_max: 70, // 颜色亮度最大值
is_same_color: false, // 泡泡颜色是否相同
background:"#f1f3f4" // 背景颜色
}, "[object Object]" == Object.prototype.toString.call(i) ? this.userOpts = {...this.defaultOpts, ...i} : this.userOpts = {
...this.defaultOpts,
id: i
}, this.color = this.random(0, 360), this.bubbleNum = [], this.requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame, this.cancelAnimationFrame = window.cancelAnimationFrame || window.mozCancelAnimationFrame
}
random(i, t) {
return Math.random() * (t - i) + i
}
initBubble(i, t) {
const a = window.innerWidth, s = window.innerHeight, n = this.userOpts,
e = this.random(n.light_min, n.light_max);
this.bubble = {
x: this.random(0, a),
y: this.random(0, s),
radius: this.random(n.radius_min, n.radius_max),
radiusChange: this.random(n.radius_add_min, n.radius_add_max),
opacity: this.random(n.opacity_min, n.opacity_max),
opacityChange: this.random(n.opacity_prev_min, n.opacity_prev_max),
light: e,
color: `hsl(${t ? i : this.random(0, 360)},100%,${e}%)`
}
}
bubbling(i, t, a) {
!this.bubble && this.initBubble(t, a);
const s = this.bubble;
i.fillStyle = s.color, i.globalAlpha = s.opacity, i.beginPath(), i.arc(s.x, s.y, s.radius, 0, 2 * Math.PI, !0), i.closePath(), i.fill(), i.globalAlpha = 1, s.opacity -= s.opacityChange, s.radius += s.radiusChange, s.opacity <= 0 && this.initBubble(t, a)
}
createCanvas() {
this.canvas = document.createElement("canvas"), this.ctx = this.canvas.getContext("2d"), this.canvas.style.display = "block", this.canvas.width = window.innerWidth, this.canvas.height = window.innerHeight, this.canvas.style.position = "fixed", this.canvas.style.top = "0", this.canvas.style.left = "0", this.canvas.style.zIndex = "-1", document.getElementById(this.userOpts.id).appendChild(this.canvas), window.onresize = (() => {
this.canvas.width = window.innerWidth, this.canvas.height = window.innerHeight
})
}
start() {
const i = window.innerWidth, t = window.innerHeight;
this.color += .1, this.ctx.fillStyle = this.defaultOpts.background, this.ctx.fillRect(0, 0, i, t), this.bubbleNum.length < this.userOpts.num && Math.random() < this.userOpts.start_probability && this.bubbleNum.push(new BGBubble), this.bubbleNum.forEach(i => i.bubbling(this.ctx, this.color, this.userOpts.is_same_color));
const a = this.requestAnimationFrame;
this.myReq = a(() => this.start())
}
destory() {
(0, this.cancelAnimationFrame)(this.myReq), window.onresize = null
}
}
const bubbleDemo = new BGBubble("bubble");
bubbleDemo.createCanvas(), bubbleDemo.start();
</script>
<!-- 气泡背景——over -->
4.2 动态粒子几何背景
设置外观 → 开发者设置 → 自定义输出 body 尾部的 HTML 代码
<!-- 动态粒子几何背景——begin -->
<script type="text/javascript">
!function () {
//封装方法,压缩之后减少文件大小
function get_attribute(node, attr, default_value) {
return node.getAttribute(attr) || default_value;
}
//封装方法,压缩之后减少文件大小
function get_by_tagname(name) {
return document.getElementsByTagName(name);
}
//获取配置参数
function get_config_option() {
var scripts = get_by_tagname("script"),
script_len = scripts.length,
script = scripts[script_len - 1]; //当前加载的script
return {
l: script_len, //长度,用于生成id用
z: get_attribute(script, "zIndex", -1), //z-index
o: get_attribute(script, "opacity", 0.8), //opacity
c: get_attribute(script, "color", "255,255,255"), //color
n: get_attribute(script, "count", 350) //count
};
}
//设置canvas的高宽
function set_canvas_size() {
canvas_width = the_canvas.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth,
canvas_height = the_canvas.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
}
//绘制过程
function draw_canvas() {
context.clearRect(0, 0, canvas_width, canvas_height);
//随机的线条和当前位置联合数组
var e, i, d, x_dist, y_dist, dist; //临时节点
//遍历处理每一个点
random_points.forEach(function (r, idx) {
r.x += r.xa,
r.y += r.ya, //移动
r.xa *= r.x > canvas_width || r.x < 0 ? -1 : 1,
r.ya *= r.y > canvas_height || r.y < 0 ? -1 : 1, //碰到边界,反向反弹
context.fillRect(r.x - 0.5, r.y - 0.5, 1, 1); //绘制一个宽高为1的点
//从下一个点开始
for (i = idx + 1; i < all_array.length; i++) {
e = all_array[i];
// 当前点存在
if (null !== e.x && null !== e.y) {
x_dist = r.x - e.x; //x轴距离 l
y_dist = r.y - e.y; //y轴距离 n
dist = x_dist * x_dist + y_dist * y_dist; //总距离, m
dist < e.max && (e === current_point && dist >= e.max / 2 && (r.x -= 0.03 * x_dist, r.y -= 0.03 * y_dist), //靠近的时候加速
d = (e.max - dist) / e.max,
context.beginPath(),
context.lineWidth = d / 2,
context.strokeStyle = "#0000FF",//这里是线条的颜色
context.moveTo(r.x, r.y),
context.lineTo(e.x, e.y),
context.stroke());
}
}
}), frame_func(draw_canvas);
}
//创建画布,并添加到body中
var the_canvas = document.createElement("canvas"), //画布
config = get_config_option(), //配置
canvas_id = "c_n" + config.l, //canvas id
context = the_canvas.getContext("2d"), canvas_width, canvas_height,
frame_func = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function (func) {
window.setTimeout(func, 1000 / 40);
}, random = Math.random,
current_point = {
x: null, //当前鼠标x
y: null, //当前鼠标y
max: 20000 // 圈半径的平方
},
all_array;
the_canvas.id = canvas_id;
the_canvas.style.cssText = "position:fixed;top:0;left:0;z-index:" + config.z + ";opacity:" + config.o;
get_by_tagname("body")[0].appendChild(the_canvas);
//初始化画布大小
set_canvas_size();
window.onresize = set_canvas_size;
//当时鼠标位置存储,离开的时候,释放当前位置信息
window.onmousemove = function (e) {
e = e || window.event;
current_point.x = e.clientX;
current_point.y = e.clientY;
}, window.onmouseout = function () {
current_point.x = null;
current_point.y = null;
};
//随机生成config.n条线位置信息
for (var random_points = [], i = 0; config.n > i; i++) {
var x = random() * canvas_width, //随机位置
y = random() * canvas_height,
xa = 2 * random() - 1, //随机运动方向
ya = 2 * random() - 1;
// 随机点
random_points.push({
x: x,
y: y,
xa: xa,
ya: ya,
max: 6000 //沾附距离
});
}
all_array = random_points.concat([current_point]);
//0.1秒后绘制
setTimeout(function () {
draw_canvas();
}, 100);
}();
</script>
<!-- 动态粒子几何背景——over -->
5、评论打赏
5.1 评论边框
设置外观 → 开发者设置 → 自定义 CSS
/* 评论边框——begin */
.comment-parent {
margin: 5px 10px 10px 5px;
padding: 20px;
border-radius: 25px;
border: 1px solid rgb(192, 229, 240);
}
/* 评论边框——over */
5.2 添加表情包
将以下代码内容添加到 /usr/themes/handsome/usr/OwO.json
文件中
并下载对应的表情包文件夹放到到 /usr/themes/handsome/assets/img/emotion
目录内
阿鲁表情包主题内原本就有,以下在原有阿鲁表情包的基础上进行扩充,直接覆盖阿鲁部分的源代码即可
"阿鲁": {
"name": "aru",
"type": "image",
"container": [
{
"icon": "0000",
"text": "**"
},
{
"icon": "0010",
"text": "**"
},
{
"icon": "0020",
"text": "**"
},
{
"icon": "0030",
"text": "**"
},
{
"icon": "0040",
"text": "**"
},
{
"icon": "0050",
"text": "**"
},
{
"icon": "0060",
"text": "**"
},
{
"icon": "0070",
"text": "**"
},
{
"icon": "0080",
"text": "**"
},
{
"icon": "0090",
"text": "**"
},
{
"icon": "0100",
"text": "**"
},
{
"icon": "0110",
"text": "**"
},
{
"icon": "0120",
"text": "**"
},
{
"icon": "0130",
"text": "**"
},
{
"icon": "0140",
"text": "**"
},
{
"icon": "0150",
"text": "**"
},
{
"icon": "0160",
"text": "**"
},
{
"icon": "0171",
"text": "**"
},
{
"icon": "0180",
"text": "**"
},
{
"icon": "0181",
"text": "**"
},
{
"icon": "0190",
"text": "**"
},
{
"icon": "0200",
"text": "**"
},
{
"icon": "0210",
"text": "**"
},
{
"icon": "0220",
"text": "**"
},
{
"icon": "0230",
"text": "**"
},
{
"icon": "0240",
"text": "**"
},
{
"icon": "0241",
"text": "**"
},
{
"icon": "0250",
"text": "**"
},
{
"icon": "0260",
"text": "**"
},
{
"icon": "0270",
"text": "**"
},
{
"icon": "0280",
"text": "**"
},
{
"icon": "0290",
"text": "**"
},
{
"icon": "0300",
"text": "**"
},
{
"icon": "0310",
"text": "**"
},
{
"icon": "0320",
"text": "**"
},
{
"icon": "0330",
"text": "**"
},
{
"icon": "0331",
"text": "**"
},
{
"icon": "0340",
"text": "**"
},
{
"icon": "0350",
"text": "**"
},
{
"icon": "0360",
"text": "**"
},
{
"icon": "0370",
"text": "**"
},
{
"icon": "0380",
"text": "**"
},
{
"icon": "0390",
"text": "**"
},
{
"icon": "0391",
"text": "**"
},
{
"icon": "0400",
"text": "**"
},
{
"icon": "0410",
"text": "**"
},
{
"icon": "0420",
"text": "**"
},
{
"icon": "0430",
"text": "**"
},
{
"icon": "0431",
"text": "**"
},
{
"icon": "0440",
"text": "**"
},
{
"icon": "0450",
"text": "**"
},
{
"icon": "0451",
"text": "**"
},
{
"icon": "0460",
"text": "**"
},
{
"icon": "0461",
"text": "**"
},
{
"icon": "0462",
"text": "**"
},
{
"icon": "0470",
"text": "**"
},
{
"icon": "0480",
"text": "**"
},
{
"icon": "0490",
"text": "**"
},
{
"icon": "0500",
"text": "**"
},
{
"icon": "0510",
"text": "**"
},
{
"icon": "0520",
"text": "**"
},
{
"icon": "0530",
"text": "**"
},
{
"icon": "0540",
"text": "**"
},
{
"icon": "0550",
"text": "**"
},
{
"icon": "0560",
"text": "**"
},
{
"icon": "0570",
"text": "**"
},
{
"icon": "0580",
"text": "**"
},
{
"icon": "0590",
"text": "**"
},
{
"icon": "0600",
"text": "**"
},
{
"icon": "0610",
"text": "**"
},
{
"icon": "0620",
"text": "**"
},
{
"icon": "despise",
"text": "鄙视"
},
{
"icon": "knife",
"text": "插刀"
},
{
"icon": "pouting",
"text": "亲嘴"
},
{
"icon": "shutup",
"text": "闭嘴"
},
{
"icon": "unhappy",
"text": "不开心"
},
{
"icon": "discovertruth",
"text": "发现真相"
},
{
"icon": "shit",
"text": "便便"
},
{
"icon": "distressed",
"text": "烦恼"
},
{
"icon": "shy",
"text": "捂脸"
},
{
"icon": "speechless",
"text": "无语"
},
{
"icon": "confuse",
"text": "迷惑"
},
{
"icon": "frown",
"text": "皱眉"
},
{
"icon": "proud",
"text": "得意"
},
{
"icon": "cheer",
"text": "欢呼"
},
{
"icon": "meditation",
"text": "沉思"
},
{
"icon": "diving",
"text": "潜水"
},
{
"icon": "cryingface",
"text": "掩面哭泣"
},
{
"icon": "lurking",
"text": "潜伏"
},
{
"icon": "thumb",
"text": "大拇指"
},
{
"icon": "smile",
"text": "微笑"
},
{
"icon": "clap",
"text": "拍掌"
},
{
"icon": "envious",
"text": "眼馋"
},
{
"icon": "surrender",
"text": "投降"
},
{
"icon": "bigeye",
"text": "大眼睛"
},
{
"icon": "nose",
"text": "抠鼻"
},
{
"icon": "sweat",
"text": "流汗"
},
{
"icon": "flower",
"text": "小花花"
},
{
"icon": "crying",
"text": "流泪"
},
{
"icon": "spit",
"text": "吐"
},
{
"icon": "surprised",
"text": "吃惊"
},
{
"icon": "blood",
"text": "一滩血"
},
{
"icon": "blood2",
"text": "吐血"
},
{
"icon": "shy2",
"text": "脸红"
},
{
"icon": "angry",
"text": "生气"
},
{
"icon": "nomatter",
"text": "无所谓"
},
{
"icon": "dead",
"text": "死翘翘"
},
{
"icon": "insidious",
"text": "阴险"
},
{
"icon": "1010",
"text": "**"
},
{
"icon": "1020",
"text": "**"
},
{
"icon": "1030",
"text": "**"
},
{
"icon": "1040",
"text": "**"
},
{
"icon": "1050",
"text": "**"
},
{
"icon": "1060",
"text": "**"
},
{
"icon": "1070",
"text": "**"
},
{
"icon": "1080",
"text": "**"
},
{
"icon": "2010",
"text": "**"
},
{
"icon": "2020",
"text": "**"
},
{
"icon": "2030",
"text": "**"
},
{
"icon": "2040",
"text": "**"
},
{
"icon": "2050",
"text": "**"
},
{
"icon": "2060",
"text": "**"
},
{
"icon": "2070",
"text": "**"
},
{
"icon": "2080",
"text": "**"
},
{
"icon": "2090",
"text": "**"
},
{
"icon": "2100",
"text": "**"
},
{
"icon": "2101",
"text": "**"
},
{
"icon": "2110",
"text": "**"
},
{
"icon": "2120",
"text": "**"
},
{
"icon": "2130",
"text": "**"
},
{
"icon": "2140",
"text": "**"
},
{
"icon": "2141",
"text": "**"
},
{
"icon": "2145",
"text": "**"
},
{
"icon": "2150",
"text": "**"
},
{
"icon": "2151",
"text": "**"
},
{
"icon": "2152",
"text": "**"
},
{
"icon": "2160",
"text": "**"
},
{
"icon": "2161",
"text": "**"
},
{
"icon": "2165",
"text": "**"
},
{
"icon": "2170",
"text": "**"
},
{
"icon": "2171",
"text": "**"
},
{
"icon": "3010",
"text": "**"
},
{
"icon": "3011",
"text": "**"
},
{
"icon": "3020",
"text": "**"
},
{
"icon": "3030",
"text": "**"
},
{
"icon": "3040",
"text": "**"
},
{
"icon": "3050",
"text": "**"
},
{
"icon": "3060",
"text": "**"
},
{
"icon": "3061",
"text": "**"
},
{
"icon": "4010",
"text": "**"
},
{
"icon": "4020",
"text": "**"
},
{
"icon": "4021",
"text": "**"
},
{
"icon": "4022",
"text": "**"
},
{
"icon": "4023",
"text": "**"
},
{
"icon": "4024",
"text": "**"
},
{
"icon": "4025",
"text": "**"
},
{
"icon": "4030",
"text": "**"
},
{
"icon": "4031",
"text": "**"
},
{
"icon": "4040",
"text": "**"
},
{
"icon": "4041",
"text": "**"
},
{
"icon": "4042",
"text": "**"
},
{
"icon": "4100",
"text": "**"
},
{
"icon": "4110",
"text": "**"
},
{
"icon": "4111",
"text": "**"
},
{
"icon": "4112",
"text": "**"
},
{
"icon": "4113",
"text": "**"
},
{
"icon": "4114",
"text": "**"
},
{
"icon": "4115",
"text": "**"
},
{
"icon": "4120",
"text": "**"
},
{
"icon": "4121",
"text": "**"
},
{
"icon": "4130",
"text": "**"
},
{
"icon": "4140",
"text": "**"
},
{
"icon": "4200",
"text": "**"
},
{
"icon": "4201",
"text": "**"
},
{
"icon": "4210",
"text": "**"
},
{
"icon": "4211",
"text": "**"
},
{
"icon": "4212",
"text": "**"
},
{
"icon": "4213",
"text": "**"
},
{
"icon": "4220",
"text": "**"
},
{
"icon": "4300",
"text": "**"
},
{
"icon": "4301",
"text": "**"
},
{
"icon": "4302",
"text": "**"
},
{
"icon": "4303",
"text": "**"
},
{
"icon": "4304",
"text": "**"
},
{
"icon": "tongue",
"text": "吐舌"
},
{
"icon": "4310",
"text": "#"
},
{
"icon": "5000",
"text": "#"
},
{
"icon": "5001",
"text": "#"
},
{
"icon": "5002",
"text": "#"
},
{
"icon": "5003",
"text": "#"
},
{
"icon": "5010",
"text": "#"
},
{
"icon": "5020",
"text": "#"
},
{
"icon": "5030",
"text": "#"
},
{
"icon": "5040",
"text": "#"
},
{
"icon": "5050",
"text": "#"
},
{
"icon": "5060",
"text": "#"
},
{
"icon": "5069",
"text": "#"
},
{
"icon": "5070",
"text": "#"
},
{
"icon": "5080",
"text": "#"
},
{
"icon": "5090",
"text": "#"
},
{
"icon": "5091",
"text": "#"
},
{
"icon": "5100",
"text": "#"
},
{
"icon": "5110",
"text": "#"
},
{
"icon": "5120",
"text": "#"
},
{
"icon": "5130",
"text": "#"
},
{
"icon": "5131",
"text": "#"
},
{
"icon": "5140",
"text": "#"
},
{
"icon": "5141",
"text": "#"
},
{
"icon": "5150",
"text": "#"
},
{
"icon": "5151",
"text": "#"
},
{
"icon": "5160",
"text": "#"
},
{
"icon": "5161",
"text": "#"
},
{
"icon": "5170",
"text": "#"
},
{
"icon": "5180",
"text": "#"
},
{
"icon": "5190",
"text": "#"
},
{
"icon": "5200",
"text": "#"
},
{
"icon": "5210",
"text": "#"
},
{
"icon": "5220",
"text": "#"
},
{
"icon": "5230",
"text": "#"
},
{
"icon": "6000",
"text": "#"
},
{
"icon": "6001",
"text": "#"
},
{
"icon": "6010",
"text": "#"
},
{
"icon": "6020",
"text": "#"
},
{
"icon": "6030",
"text": "#"
},
{
"icon": "6040",
"text": "#"
},
{
"icon": "6050",
"text": "#"
},
{
"icon": "6051",
"text": "#"
},
{
"icon": "6060",
"text": "#"
},
{
"icon": "6061",
"text": "#"
},
{
"icon": "6070",
"text": "#"
},
{
"icon": "6080",
"text": "#"
},
{
"icon": "6090",
"text": "#"
},
{
"icon": "6091",
"text": "#"
},
{
"icon": "6092",
"text": "#"
},
{
"icon": "6100",
"text": "#"
},
{
"icon": "6110",
"text": "#"
},
{
"icon": "6120",
"text": "#"
},
{
"icon": "6121",
"text": "#"
},
{
"icon": "6130",
"text": "#"
},
{
"icon": "6131",
"text": "#"
},
{
"icon": "6132",
"text": "#"
},
{
"icon": "6140",
"text": "#"
},
{
"icon": "6150",
"text": "#"
},
{
"icon": "6151",
"text": "#"
},
{
"icon": "6160",
"text": "#"
},
{
"icon": "6500",
"text": "#"
},
{
"icon": "6510",
"text": "#"
},
{
"icon": "6520",
"text": "#"
},
{
"icon": "6530",
"text": "#"
},
{
"icon": "7000",
"text": "#"
},
{
"icon": "7010",
"text": "#"
},
{
"icon": "7011",
"text": "#"
},
{
"icon": "7012",
"text": "#"
},
{
"icon": "7020",
"text": "#"
},
{
"icon": "7021",
"text": "#"
},
{
"icon": "7030",
"text": "#"
},
{
"icon": "7040",
"text": "#"
},
{
"icon": "7045",
"text": "#"
},
{
"icon": "7046",
"text": "#"
},
{
"icon": "7050",
"text": "#"
},
{
"icon": "7051",
"text": "#"
},
{
"icon": "7052",
"text": "#"
},
{
"icon": "7053",
"text": "#"
},
{
"icon": "7054",
"text": "#"
},
{
"icon": "7060",
"text": "#"
},
{
"icon": "7061",
"text": "#"
},
{
"icon": "7062",
"text": "#"
},
{
"icon": "7070",
"text": "#"
},
{
"icon": "7071",
"text": "#"
},
{
"icon": "7080",
"text": "#"
},
{
"icon": "7081",
"text": "#"
},
{
"icon": "7090",
"text": "#"
},
{
"icon": "7100",
"text": "#"
},
{
"icon": "7110",
"text": "#"
},
{
"icon": "7111",
"text": "#"
},
{
"icon": "7112",
"text": "#"
},
{
"icon": "7113",
"text": "#"
},
{
"icon": "7200",
"text": "#"
},
{
"icon": "7201",
"text": "#"
},
{
"icon": "7210",
"text": "#"
},
{
"icon": "7220",
"text": "#"
},
{
"icon": "7230",
"text": "#"
},
{
"icon": "8000",
"text": "#"
},
{
"icon": "8001",
"text": "#"
},
{
"icon": "8010",
"text": "#"
},
{
"icon": "8020",
"text": "#"
},
{
"icon": "8021",
"text": "#"
},
{
"icon": "8030",
"text": "#"
},
{
"icon": "8040",
"text": "#"
},
{
"icon": "8041",
"text": "#"
},
{
"icon": "8042",
"text": "#"
},
{
"icon": "8050",
"text": "#"
},
{
"icon": "8051",
"text": "#"
},
{
"icon": "8060",
"text": "#"
},
{
"icon": "8062",
"text": "#"
},
{
"icon": "8070",
"text": "#"
},
{
"icon": "8071",
"text": "#"
},
{
"icon": "8072",
"text": "#"
},
{
"icon": "8080",
"text": "#"
},
{
"icon": "8081",
"text": "#"
},
{
"icon": "8082",
"text": "#"
},
{
"icon": "8083",
"text": "#"
},
{
"icon": "8084",
"text": "#"
},
{
"icon": "8085",
"text": "#"
},
{
"icon": "8090",
"text": "#"
},
{
"icon": "8091",
"text": "#"
},
{
"icon": "8092",
"text": "#"
},
{
"icon": "8100",
"text": "#"
},
{
"icon": "8101",
"text": "#"
},
{
"icon": "8102",
"text": "#"
},
{
"icon": "8103",
"text": "#"
},
{
"icon": "8110",
"text": "#"
},
{
"icon": "x010",
"text": "#"
},
{
"icon": "x011",
"text": "#"
},
{
"icon": "x012",
"text": "#"
},
{
"icon": "x013",
"text": "#"
},
{
"icon": "x014",
"text": "#"
},
{
"icon": "x021",
"text": "#"
},
{
"icon": "x022",
"text": "#"
},
{
"icon": "x031",
"text": "#"
},
{
"icon": "x032",
"text": "#"
},
{
"icon": "x041",
"text": "#"
},
{
"icon": "x042",
"text": "#"
},
{
"icon": "x050",
"text": "#"
},
{
"icon": "x060",
"text": "#"
},
{
"icon": "x061",
"text": "#"
},
{
"icon": "x062",
"text": "#"
},
{
"icon": "x063",
"text": "#"
},
{
"icon": "x069",
"text": "#"
},
{
"icon": "x070",
"text": "#"
},
{
"icon": "x071",
"text": "#"
},
{
"icon": "x080",
"text": "#"
},
{
"icon": "x081",
"text": "#"
},
{
"icon": "x082",
"text": "#"
},
{
"icon": "x083",
"text": "#"
},
{
"icon": "x090",
"text": "#"
},
{
"icon": "x091",
"text": "#"
},
{
"icon": "x092",
"text": "#"
},
{
"icon": "x093",
"text": "#"
},
{
"icon": "x094",
"text": "#"
},
{
"icon": "x099",
"text": "#"
}
]
}
"贴吧":{
"type": "image",
"name": "tieba",
"container":[
{
"icon": "Y.tb1",
"text": "贴吧"
},
{
"icon": "Y.tb2",
"text": "贴吧"
},
{
"icon": "Y.tb3",
"text": "贴吧"
},
{
"icon": "Y.tb4",
"text": "贴吧"
},
{
"icon": "Y.tb5",
"text": "贴吧"
},
{
"icon": "Y.tb6",
"text": "贴吧"
},
{
"icon": "Y.tb7",
"text": "贴吧"
},
{
"icon": "Y.tb8",
"text": "贴吧"
},
{
"icon": "Y.tb9",
"text": "贴吧"
},
{
"icon": "Y.tb10",
"text": "贴吧"
},
{
"icon": "Y.tb11",
"text": "贴吧"
},
{
"icon": "Y.tb12",
"text": "贴吧"
},
{
"icon": "Y.tb13",
"text": "贴吧"
},
{
"icon": "Y.tb14",
"text": "贴吧"
},
{
"icon": "Y.tb15",
"text": "贴吧"
},
{
"icon": "Y.tb17",
"text": "贴吧"
},
{
"icon": "Y.tb18",
"text": "贴吧"
},
{
"icon": "Y.tb19",
"text": "贴吧"
},
{
"icon": "Y.tb20",
"text": "贴吧"
},
{
"icon": "Y.tb23",
"text": "贴吧"
},
{
"icon": "Y.tb24",
"text": "贴吧"
},
{
"icon": "Y.tb25",
"text": "贴吧"
},
{
"icon": "Y.tb26",
"text": "贴吧"
},
{
"icon": "Y.tb27",
"text": "贴吧"
},
{
"icon": "Y.tb28",
"text": "贴吧"
},
{
"icon": "Y.tb29",
"text": "贴吧"
},
{
"icon": "Y.tb30",
"text": "贴吧"
},
{
"icon": "Y.tb31",
"text": "贴吧"
},
{
"icon": "Y.tb32",
"text": "贴吧"
},
{
"icon": "Y.tb33",
"text": "贴吧"
},
{
"icon": "Y.tb34",
"text": "贴吧"
},
{
"icon": "Y.tb35",
"text": "贴吧"
},
{
"icon": "Y.tb36",
"text": "贴吧"
},
{
"icon": "Y.tb37",
"text": "贴吧"
},
{
"icon": "Y.tb38",
"text": "贴吧"
},
{
"icon": "Y.tb39",
"text": "贴吧"
},
{
"icon": "Y.tb40",
"text": "贴吧"
},
{
"icon": "Y.tb41",
"text": "贴吧"
},
{
"icon": "Y.tb42",
"text": "贴吧"
},
{
"icon": "Y.tb43",
"text": "贴吧"
},
{
"icon": "Y.tb44",
"text": "贴吧"
},
{
"icon": "Y.tb45",
"text": "贴吧"
},
{
"icon": "Y.tb46",
"text": "贴吧"
},
{
"icon": "Y.tb47",
"text": "贴吧"
},
{
"icon": "Y.tb48",
"text": "贴吧"
},
{
"icon": "Y.tb49",
"text": "贴吧"
},
{
"icon": "Y.tb50",
"text": "贴吧"
},
{
"icon": "Y.tb51",
"text": "贴吧"
},
{
"icon": "Y.tb52",
"text": "贴吧"
},
{
"icon": "Y.tb53",
"text": "贴吧"
},
{
"icon": "Y.tb54",
"text": "贴吧"
},
{
"icon": "Y.tb55",
"text": "贴吧"
},
{
"icon": "Y.tb56",
"text": "贴吧"
},
{
"icon": "Y.tb57",
"text": "贴吧"
},
{
"icon": "Y.tb58",
"text": "贴吧"
},
{
"icon": "Y.tb59",
"text": "贴吧"
},
{
"icon": "Y.tb60",
"text": "贴吧"
},
{
"icon": "Y.tb61",
"text": "贴吧"
},
{
"icon": "Y.tb62",
"text": "贴吧"
},
{
"icon": "Y.tb63",
"text": "贴吧"
},
{
"icon": "Y.tb64",
"text": "贴吧"
},
{
"icon": "Y.tb65",
"text": "贴吧"
},
{
"icon": "Y.tb66",
"text": "贴吧"
},
{
"icon": "Y.tb67",
"text": "贴吧"
},
{
"icon": "Y.tb68",
"text": "贴吧"
},
{
"icon": "Y.tb69",
"text": "贴吧"
},
{
"icon": "Y.tb70",
"text": "贴吧"
},
{
"icon": "Y.tb71",
"text": "贴吧"
},
{
"icon": "Y.tb72",
"text": "贴吧"
},
{
"icon": "Y.tb73",
"text": "贴吧"
},
{
"icon": "Y.tb74",
"text": "贴吧"
},
{
"icon": "Y.tb75",
"text": "贴吧"
},
{
"icon": "Y.tb76",
"text": "贴吧"
},
{
"icon": "Y.tb77",
"text": "贴吧"
},
{
"icon": "Y.tb78",
"text": "贴吧"
},
{
"icon": "Y.tb79",
"text": "贴吧"
},
{
"icon": "Y.tb80",
"text": "贴吧"
},
{
"icon": "Y.tb81",
"text": "贴吧"
},
{
"icon": "Y.tb82",
"text": "贴吧"
},
{
"icon": "Y.tb83",
"text": "贴吧"
},
{
"icon": "Y.tb84",
"text": "贴吧"
},
{
"icon": "Y.tb85",
"text": "贴吧"
},
{
"icon": "Y.tb86",
"text": "贴吧"
},
{
"icon": "Y.tb87",
"text": "贴吧"
},
{
"icon": "Y.tb88",
"text": "贴吧"
},
{
"icon": "Y.tb89",
"text": "贴吧"
},
{
"icon": "Y.tb90",
"text": "贴吧"
},
{
"icon": "Y.tb91",
"text": "贴吧"
},
{
"icon": "Y.tb92",
"text": "贴吧"
},
{
"icon": "Y.tb93",
"text": "贴吧"
},
{
"icon": "Y.tb94",
"text": "贴吧"
},
{
"icon": "Y.tb95",
"text": "贴吧"
},
{
"icon": "Y.tb96",
"text": "贴吧"
},
{
"icon": "Y.tb97",
"text": "贴吧"
},
{
"icon": "Y.tb98",
"text": "贴吧"
},
{
"icon": "Y.tb99",
"text": "贴吧"
}
]
}
"微博":{
"type": "image",
"name": "weibo",
"container":[
{
"icon": "Y.wb1",
"text": "微博"
},
{
"icon": "Y.wb2",
"text": "微博"
},
{
"icon": "Y.wb3",
"text": "微博"
},
{
"icon": "Y.wb4",
"text": "微博"
},
{
"icon": "Y.wb5",
"text": "微博"
},
{
"icon": "Y.wb6",
"text": "微博"
},
{
"icon": "Y.wb7",
"text": "微博"
},
{
"icon": "Y.wb8",
"text": "微博"
},
{
"icon": "Y.wb9",
"text": "微博"
},
{
"icon": "Y.wb10",
"text": "微博"
},
{
"icon": "Y.wb11",
"text": "微博"
},
{
"icon": "Y.wb12",
"text": "微博"
},
{
"icon": "Y.wb13",
"text": "微博"
},
{
"icon": "Y.wb14",
"text": "微博"
},
{
"icon": "Y.wb15",
"text": "微博"
},
{
"icon": "Y.wb16",
"text": "微博"
},
{
"icon": "Y.wb17",
"text": "微博"
},
{
"icon": "Y.wb18",
"text": "微博"
},
{
"icon": "Y.wb19",
"text": "微博"
},
{
"icon": "Y.wb20",
"text": "微博"
},
{
"icon": "Y.wb21",
"text": "微博"
},
{
"icon": "Y.wb22",
"text": "微博"
},
{
"icon": "Y.wb23",
"text": "微博"
},
{
"icon": "Y.wb24",
"text": "微博"
},
{
"icon": "Y.wb25",
"text": "微博"
},
{
"icon": "Y.wb26",
"text": "微博"
},
{
"icon": "Y.wb27",
"text": "微博"
},
{
"icon": "Y.wb28",
"text": "微博"
},
{
"icon": "Y.wb29",
"text": "微博"
},
{
"icon": "Y.wb30",
"text": "微博"
},
{
"icon": "Y.wb31",
"text": "微博"
},
{
"icon": "Y.wb32",
"text": "微博"
},
{
"icon": "Y.wb33",
"text": "微博"
},
{
"icon": "Y.wb34",
"text": "微博"
},
{
"icon": "Y.wb35",
"text": "微博"
},
{
"icon": "Y.wb36",
"text": "微博"
},
{
"icon": "Y.wb37",
"text": "微博"
},
{
"icon": "Y.wb38",
"text": "微博"
},
{
"icon": "Y.wb39",
"text": "微博"
},
{
"icon": "Y.wb40",
"text": "微博"
},
{
"icon": "Y.wb41",
"text": "微博"
},
{
"icon": "Y.wb42",
"text": "微博"
},
{
"icon": "Y.wb43",
"text": "微博"
},
{
"icon": "Y.wb44",
"text": "微博"
},
{
"icon": "Y.wb45",
"text": "微博"
},
{
"icon": "Y.wb46",
"text": "微博"
},
{
"icon": "Y.wb47",
"text": "微博"
},
{
"icon": "Y.wb48",
"text": "微博"
},
{
"icon": "Y.wb49",
"text": "微博"
},
{
"icon": "Y.wb50",
"text": "微博"
},
{
"icon": "Y.wb51",
"text": "微博"
},
{
"icon": "Y.wb52",
"text": "微博"
},
{
"icon": "Y.wb53",
"text": "微博"
},
{
"icon": "Y.wb54",
"text": "微博"
},
{
"icon": "Y.wb55",
"text": "微博"
},
{
"icon": "Y.wb56",
"text": "微博"
},
{
"icon": "Y.wb57",
"text": "微博"
},
{
"icon": "Y.wb58",
"text": "微博"
},
{
"icon": "Y.wb59",
"text": "微博"
},
{
"icon": "Y.wb60",
"text": "微博"
},
{
"icon": "Y.wb61",
"text": "微博"
},
{
"icon": "Y.wb62",
"text": "微博"
},
{
"icon": "Y.wb63",
"text": "微博"
},
{
"icon": "Y.wb64",
"text": "微博"
},
{
"icon": "Y.wb65",
"text": "微博"
},
{
"icon": "Y.wb66",
"text": "微博"
},
{
"icon": "Y.wb67",
"text": "微博"
},
{
"icon": "Y.wb68",
"text": "微博"
},
{
"icon": "Y.wb69",
"text": "微博"
},
{
"icon": "Y.wb70",
"text": "微博"
},
{
"icon": "Y.wb71",
"text": "微博"
},
{
"icon": "Y.wb72",
"text": "微博"
},
{
"icon": "Y.wb73",
"text": "微博"
},
{
"icon": "Y.wb74",
"text": "微博"
},
{
"icon": "Y.wb75",
"text": "微博"
},
{
"icon": "Y.wb76",
"text": "微博"
},
{
"icon": "Y.wb77",
"text": "微博"
},
{
"icon": "Y.wb78",
"text": "微博"
},
{
"icon": "Y.wb79",
"text": "微博"
},
{
"icon": "Y.wb80",
"text": "微博"
},
{
"icon": "Y.wb81",
"text": "微博"
},
{
"icon": "Y.wb82",
"text": "微博"
},
{
"icon": "Y.wb83",
"text": "微博"
},
{
"icon": "Y.wb84",
"text": "微博"
},
{
"icon": "Y.wb85",
"text": "微博"
},
{
"icon": "Y.wb86",
"text": "微博"
},
{
"icon": "Y.wb87",
"text": "微博"
},
{
"icon": "Y.wb88",
"text": "微博"
},
{
"icon": "Y.wb89",
"text": "微博"
},
{
"icon": "Y.wb90",
"text": "微博"
},
{
"icon": "Y.wb91",
"text": "微博"
},
{
"icon": "Y.wb92",
"text": "微博"
},
{
"icon": "Y.wb93",
"text": "微博"
},
{
"icon": "Y.wb94",
"text": "微博"
},
{
"icon": "Y.wb95",
"text": "微博"
},
{
"icon": "Y.wb96",
"text": "微博"
},
{
"icon": "Y.wb97",
"text": "微博"
},
{
"icon": "Y.wb98",
"text": "微博"
},
{
"icon": "Y.wb99",
"text": "微博"
},
{
"icon": "Y.wb100",
"text": "微博"
},
{
"icon": "Y.wb101",
"text": "微博"
},
{
"icon": "Y.wb102",
"text": "微博"
},
{
"icon": "Y.wb103",
"text": "微博"
},
{
"icon": "Y.wb104",
"text": "微博"
},
{
"icon": "Y.wb105",
"text": "微博"
},
{
"icon": "Y.wb106",
"text": "微博"
},
{
"icon": "Y.wb107",
"text": "微博"
},
{
"icon": "Y.wb108",
"text": "微博"
},
{
"icon": "Y.wb109",
"text": "微博"
},
{
"icon": "Y.wb110",
"text": "微博"
},
{
"icon": "Y.wb111",
"text": "微博"
},
{
"icon": "Y.wb112",
"text": "微博"
}
]
}
"QQ":{
"type": "image",
"name": "QQ",
"container":[
{
"icon": "Y.qq1",
"text": "QQ"
},
{
"icon": "Y.qq2",
"text": "QQ"
},
{
"icon": "Y.qq3",
"text": "QQ"
},
{
"icon": "Y.qq4",
"text": "QQ"
},
{
"icon": "Y.qq5",
"text": "QQ"
},
{
"icon": "Y.qq6",
"text": "QQ"
},
{
"icon": "Y.qq7",
"text": "QQ"
},
{
"icon": "Y.qq8",
"text": "QQ"
},
{
"icon": "Y.qq9",
"text": "QQ"
},
{
"icon": "Y.qq10",
"text": "QQ"
},
{
"icon": "Y.qq11",
"text": "QQ"
},
{
"icon": "Y.qq12",
"text": "QQ"
},
{
"icon": "Y.qq13",
"text": "QQ"
},
{
"icon": "Y.qq14",
"text": "QQ"
},
{
"icon": "Y.qq15",
"text": "QQ"
},
{
"icon": "Y.qq17",
"text": "QQ"
},
{
"icon": "Y.qq18",
"text": "QQ"
},
{
"icon": "Y.qq19",
"text": "QQ"
},
{
"icon": "Y.qq20",
"text": "QQ"
},
{
"icon": "Y.qq23",
"text": "QQ"
},
{
"icon": "Y.qq24",
"text": "QQ"
},
{
"icon": "Y.qq25",
"text": "QQ"
},
{
"icon": "Y.qq26",
"text": "QQ"
},
{
"icon": "Y.qq27",
"text": "QQ"
},
{
"icon": "Y.qq28",
"text": "QQ"
},
{
"icon": "Y.qq29",
"text": "QQ"
},
{
"icon": "Y.qq30",
"text": "QQ"
},
{
"icon": "Y.qq31",
"text": "QQ"
},
{
"icon": "Y.qq32",
"text": "QQ"
},
{
"icon": "Y.qq33",
"text": "QQ"
},
{
"icon": "Y.qq34",
"text": "QQ"
},
{
"icon": "Y.qq35",
"text": "QQ"
},
{
"icon": "Y.qq36",
"text": "QQ"
},
{
"icon": "Y.qq37",
"text": "QQ"
},
{
"icon": "Y.qq38",
"text": "QQ"
},
{
"icon": "Y.qq39",
"text": "QQ"
},
{
"icon": "Y.qq40",
"text": "QQ"
},
{
"icon": "Y.qq41",
"text": "QQ"
},
{
"icon": "Y.qq42",
"text": "QQ"
},
{
"icon": "Y.qq43",
"text": "QQ"
},
{
"icon": "Y.qq44",
"text": "QQ"
},
{
"icon": "Y.qq45",
"text": "QQ"
},
{
"icon": "Y.qq46",
"text": "QQ"
},
{
"icon": "Y.qq47",
"text": "QQ"
},
{
"icon": "Y.qq48",
"text": "QQ"
},
{
"icon": "Y.qq49",
"text": "QQ"
},
{
"icon": "Y.qq50",
"text": "QQ"
},
{
"icon": "Y.qq51",
"text": "QQ"
},
{
"icon": "Y.qq52",
"text": "QQ"
},
{
"icon": "Y.qq53",
"text": "QQ"
},
{
"icon": "Y.qq54",
"text": "QQ"
},
{
"icon": "Y.qq55",
"text": "QQ"
},
{
"icon": "Y.qq56",
"text": "QQ"
},
{
"icon": "Y.qq57",
"text": "QQ"
},
{
"icon": "Y.qq58",
"text": "QQ"
},
{
"icon": "Y.qq59",
"text": "QQ"
},
{
"icon": "Y.qq60",
"text": "QQ"
},
{
"icon": "Y.qq61",
"text": "QQ"
},
{
"icon": "Y.qq62",
"text": "QQ"
},
{
"icon": "Y.qq63",
"text": "QQ"
},
{
"icon": "Y.qq64",
"text": "QQ"
},
{
"icon": "Y.qq65",
"text": "QQ"
},
{
"icon": "Y.qq66",
"text": "QQ"
},
{
"icon": "Y.qq67",
"text": "QQ"
},
{
"icon": "Y.qq68",
"text": "QQ"
},
{
"icon": "Y.qq69",
"text": "QQ"
},
{
"icon": "Y.qq70",
"text": "QQ"
},
{
"icon": "Y.qq71",
"text": "QQ"
},
{
"icon": "Y.qq72",
"text": "QQ"
},
{
"icon": "Y.qq73",
"text": "QQ"
},
{
"icon": "Y.qq74",
"text": "QQ"
},
{
"icon": "Y.qq75",
"text": "QQ"
},
{
"icon": "Y.qq76",
"text": "QQ"
},
{
"icon": "Y.qq77",
"text": "QQ"
},
{
"icon": "Y.qq78",
"text": "QQ"
},
{
"icon": "Y.qq79",
"text": "QQ"
},
{
"icon": "Y.qq80",
"text": "QQ"
}
]
}
"emoji":{
"type": "image",
"name": "emoji",
"container":[
{
"icon": "Y.emoji1",
"text": "emoji"
},
{
"icon": "Y.emoji2",
"text": "emoji"
},
{
"icon": "Y.emoji3",
"text": "emoji"
},
{
"icon": "Y.emoji4",
"text": "emoji"
},
{
"icon": "Y.emoji5",
"text": "emoji"
},
{
"icon": "Y.emoji6",
"text": "emoji"
},
{
"icon": "Y.emoji7",
"text": "emoji"
},
{
"icon": "Y.emoji8",
"text": "emoji"
},
{
"icon": "Y.emoji9",
"text": "emoji"
},
{
"icon": "Y.emoji10",
"text": "emoji"
},
{
"icon": "Y.emoji11",
"text": "emoji"
},
{
"icon": "Y.emoji12",
"text": "emoji"
},
{
"icon": "Y.emoji13",
"text": "emoji"
},
{
"icon": "Y.emoji14",
"text": "emoji"
},
{
"icon": "Y.emoji15",
"text": "emoji"
},
{
"icon": "Y.emoji17",
"text": "emoji"
},
{
"icon": "Y.emoji18",
"text": "emoji"
},
{
"icon": "Y.emoji19",
"text": "emoji"
},
{
"icon": "Y.emoji20",
"text": "emoji"
},
{
"icon": "Y.emoji23",
"text": "emoji"
},
{
"icon": "Y.emoji24",
"text": "emoji"
},
{
"icon": "Y.emoji25",
"text": "emoji"
},
{
"icon": "Y.emoji26",
"text": "emoji"
},
{
"icon": "Y.emoji27",
"text": "emoji"
},
{
"icon": "Y.emoji28",
"text": "emoji"
},
{
"icon": "Y.emoji29",
"text": "emoji"
},
{
"icon": "Y.emoji30",
"text": "emoji"
},
{
"icon": "Y.emoji31",
"text": "emoji"
},
{
"icon": "Y.emoji32",
"text": "emoji"
},
{
"icon": "Y.emoji33",
"text": "emoji"
},
{
"icon": "Y.emoji34",
"text": "emoji"
},
{
"icon": "Y.emoji35",
"text": "emoji"
},
{
"icon": "Y.emoji36",
"text": "emoji"
},
{
"icon": "Y.emoji37",
"text": "emoji"
},
{
"icon": "Y.emoji38",
"text": "emoji"
},
{
"icon": "Y.emoji39",
"text": "emoji"
},
{
"icon": "Y.emoji40",
"text": "emoji"
},
{
"icon": "Y.emoji41",
"text": "emoji"
},
{
"icon": "Y.emoji42",
"text": "emoji"
},
{
"icon": "Y.emoji43",
"text": "emoji"
},
{
"icon": "Y.emoji44",
"text": "emoji"
},
{
"icon": "Y.emoji45",
"text": "emoji"
},
{
"icon": "Y.emoji46",
"text": "emoji"
},
{
"icon": "Y.emoji47",
"text": "emoji"
},
{
"icon": "Y.emoji48",
"text": "emoji"
},
{
"icon": "Y.emoji49",
"text": "emoji"
},
{
"icon": "Y.emoji50",
"text": "emoji"
},
{
"icon": "Y.emoji51",
"text": "emoji"
},
{
"icon": "Y.emoji52",
"text": "emoji"
},
{
"icon": "Y.emoji53",
"text": "emoji"
},
{
"icon": "Y.emoji54",
"text": "emoji"
},
{
"icon": "Y.emoji55",
"text": "emoji"
},
{
"icon": "Y.emoji56",
"text": "emoji"
},
{
"icon": "Y.emoji57",
"text": "emoji"
},
{
"icon": "Y.emoji58",
"text": "emoji"
},
{
"icon": "Y.emoji59",
"text": "emoji"
},
{
"icon": "Y.emoji60",
"text": "emoji"
},
{
"icon": "Y.emoji61",
"text": "emoji"
},
{
"icon": "Y.emoji62",
"text": "emoji"
},
{
"icon": "Y.emoji63",
"text": "emoji"
},
{
"icon": "Y.emoji64",
"text": "emoji"
},
{
"icon": "Y.emoji65",
"text": "emoji"
},
{
"icon": "Y.emoji66",
"text": "emoji"
},
{
"icon": "Y.emoji67",
"text": "emoji"
},
{
"icon": "Y.emoji68",
"text": "emoji"
},
{
"icon": "Y.emoji69",
"text": "emoji"
},
{
"icon": "Y.emoji70",
"text": "emoji"
},
{
"icon": "Y.emoji71",
"text": "emoji"
},
{
"icon": "Y.emoji72",
"text": "emoji"
},
{
"icon": "Y.emoji73",
"text": "emoji"
},
{
"icon": "Y.emoji74",
"text": "emoji"
},
{
"icon": "Y.emoji75",
"text": "emoji"
}
]
}
"蛆音娘": {
"name": "quyin",
"type": "image",
"container": [
{
"icon": "hematemesis",
"text": "吐血"
},
{
"icon": "1huaji",
"text": "滑稽"
},
{
"icon": "amazing",
"text": "吃惊"
},
{
"icon": "angry",
"text": "生气"
},
{
"icon": "cry",
"text": "哭泣"
},
{
"icon": "die",
"text": "die"
},
{
"icon": "doubt",
"text": "疑问"
},
{
"icon": "feizao",
"text": "肥皂"
},
{
"icon": "fue",
"text": "扶额"
},
{
"icon": "heng",
"text": "哼"
},
{
"icon": "laughing",
"text": "大笑"
},
{
"icon": "look",
"text": "偷看"
},
{
"icon": "maimeng",
"text": "卖萌"
},
{
"icon": "OK",
"text": "OK!"
},
{
"icon": "scare",
"text": "吓死宝宝惹"
},
{
"icon": "shakinghead",
"text": "摇头"
},
{
"icon": "sleep",
"text": "睡觉"
},
{
"icon": "speechless",
"text": "无语"
},
{
"icon": "watermaleon",
"text": "吃瓜"
},
{
"icon": "witty",
"text": "机智"
}
]
}
"哔哩哔哩":{
"type": "image",
"name": "bilibili",
"container":[
{
"icon": "baiyan",
"text": "白眼"
},
{
"icon": "bishi",
"text": "鄙视"
},
{
"icon": "bizui",
"text": "闭嘴"
},
{
"icon": "chan",
"text": "馋"
},
{
"icon": "daku",
"text": "大哭"
},
{
"icon": "dalao",
"text": "大佬"
},
{
"icon": "dalian",
"text": "打脸"
},{
"icon": "dianzan",
"text": "点赞"
},{
"icon": "doge",
"text": "doge"
},
{
"icon": "facai",
"text": "发财"
},{
"icon": "fadai",
"text": "发呆"
},{
"icon": "fanu",
"text": "发怒"
},{
"icon": "ganga",
"text": "尴尬"
},{
"icon": "guzhang",
"text": "鼓掌"
},{
"icon": "haixiu",
"text": "害羞"
},{
"icon": "heirenwenhao",
"text": "黑人问号"
},{
"icon": "huaixiao",
"text": "坏笑"
},{
"icon": "jingxia",
"text": "惊吓"
},{
"icon": "keai",
"text": "可爱"
},{
"icon": "koubi",
"text": "抠鼻"
},{
"icon": "kun",
"text": "困"
},{
"icon": "liubixie",
"text": "流鼻血"
},{
"icon": "liuhan",
"text": "流汗"
},
{
"icon": "miantian",
"text": "腼腆"
},{
"icon": "nanguo",
"text": "难过"
},{
"icon": "outu",
"text": "呕吐"
},{
"icon": "qinqin",
"text": "亲亲"
},{
"icon": "se",
"text": "色"
},{
"icon": "shengbing",
"text": "生病"
},{
"icon": "shengqi",
"text": "生气"
},{
"icon": "shuizhao",
"text": "睡着"
},{
"icon": "sikao",
"text": "思考"
},{
"icon": "tiaopi",
"text": "调皮"
},{
"icon": "touxiao",
"text": "偷笑"
},{
"icon": "tuxie",
"text": "吐血"
},{
"icon": "weiqu",
"text": "委屈"
},{
"icon": "weixiao",
"text": "微笑"
},{
"icon": "wunai",
"text": "无奈"
},{
"icon": "xiaoku",
"text": "笑哭"
},{
"icon": "xieyanxiao",
"text": "斜眼笑"
},{
"icon": "yiwen",
"text": "疑问"
},{
"icon": "yun",
"text": "晕"
},{
"icon": "zaijian",
"text": "再见"
},{
"icon": "zhuakuang",
"text": "抓狂"
}
]
}
设置外观 → 开发者设置 → 自定义 CSS
注意emotion-后面即为表情名字,即OwO.json文件里的name,每个表情包都要写一个css添加进去才可以
/* 表情包大小调整——begin */
.emotion-QQ {width:35px;}
.emotion-aru {width:35px;}
.emotion-bilibili {width:35px;}
.emotion-weibo {width:35px;}
.emotion-quyin {width:35px;}
.emotion-tieba {width:35px;}
/* 表情包大小调整——over */
5.3 赞赏按钮跳动
设置外观 → 开发者设置 → 自定义 CSS
/* 赞赏按钮跳动——begin */
.btn-pay {
animation: star 0.5s ease-in-out infinite alternate;
}
@keyframes star {
from {
transform: scale(1);
}
to {
transform: scale(1.1);
}
}
/* 赞赏按钮跳动——over */
5.4 文本框打字机特效
设置外观 → 开发者设置 → 自定义 JavaScript
/* 文本框打字机特效——begin */
(function webpackUniversalModuleDefinition(a,b){if(typeof exports==="object"&&typeof module==="object"){module.exports=b()}else{if(typeof define==="function"&&define.amd){define([],b)}else{if(typeof exports==="object"){exports["POWERMODE"]=b()}else{a["POWERMODE"]=b()}}}})(this,function(){return(function(a){var b={};function c(e){if(b[e]){return b[e].exports}var d=b[e]={exports:{},id:e,loaded:false};a[e].call(d.exports,d,d.exports,c);d.loaded=true;return d.exports}c.m=a;c.c=b;c.p="";return c(0)})([function(c,g,b){var d=document.createElement("canvas");d.width=window.innerWidth;d.height=window.innerHeight;d.style.cssText="position:fixed;top:0;left:0;pointer-events:none;z-index:999999";window.addEventListener("resize",function(){d.width=window.innerWidth;d.height=window.innerHeight});document.body.appendChild(d);var a=d.getContext("2d");var n=[];var j=0;var k=120;var f=k;var p=false;o.shake=true;function l(r,q){return Math.random()*(q-r)+r}function m(r){if(o.colorful){var q=l(0,360);return"hsla("+l(q-10,q+10)+", 100%, "+l(50,80)+"%, "+1+")"}else{return window.getComputedStyle(r).color}}function e(){var t=document.activeElement;var v;if(t.tagName==="TEXTAREA"||(t.tagName==="INPUT"&&t.getAttribute("type")==="text")){var u=b(1)(t,t.selectionStart);v=t.getBoundingClientRect();return{x:u.left+v.left,y:u.top+v.top,color:m(t)}}var s=window.getSelection();if(s.rangeCount){var q=s.getRangeAt(0);var r=q.startContainer;if(r.nodeType===document.TEXT_NODE){r=r.parentNode}v=q.getBoundingClientRect();return{x:v.left,y:v.top,color:m(r)}}return{x:0,y:0,color:"transparent"}}function h(q,s,r){return{x:q,y:s,alpha:1,color:r,velocity:{x:-1+Math.random()*2,y:-3.5+Math.random()*2}}}function o(){var t=e();var s=5+Math.round(Math.random()*10);while(s--){n[j]=h(t.x,t.y,t.color);j=(j+1)%500}f=k;if(!p){requestAnimationFrame(i)}if(o.shake){var r=1+2*Math.random();var q=r*(Math.random()>0.5?-1:1);var u=r*(Math.random()>0.5?-1:1);document.body.style.marginLeft=q+"px";document.body.style.marginTop=u+"px";setTimeout(function(){document.body.style.marginLeft="";document.body.style.marginTop=""},75)}}o.colorful=false;function i(){if(f>0){requestAnimationFrame(i);f--;p=true}else{p=false}a.clearRect(0,0,d.width,d.height);for(var q=0;q<n.length;++q){var r=n[q];if(r.alpha<=0.1){continue}r.velocity.y+=0.075;r.x+=r.velocity.x;r.y+=r.velocity.y;r.alpha*=0.96;a.globalAlpha=r.alpha;a.fillStyle=r.color;a.fillRect(Math.round(r.x-1.5),Math.round(r.y-1.5),3,3)}}requestAnimationFrame(i);c.exports=o},function(b,a){(function(){var d=["direction","boxSizing","width","height","overflowX","overflowY","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderStyle","paddingTop","paddingRight","paddingBottom","paddingLeft","fontStyle","fontVariant","fontWeight","fontStretch","fontSize","fontSizeAdjust","lineHeight","fontFamily","textAlign","textTransform","textIndent","textDecoration","letterSpacing","wordSpacing","tabSize","MozTabSize"];var e=window.mozInnerScreenX!=null;function c(k,l,o){var h=o&&o.debug||false;if(h){var i=document.querySelector("#input-textarea-caret-position-mirror-div");if(i){i.parentNode.removeChild(i)}}var f=document.createElement("div");f.id="input-textarea-caret-position-mirror-div";document.body.appendChild(f);var g=f.style;var j=window.getComputedStyle?getComputedStyle(k):k.currentStyle;g.whiteSpace="pre-wrap";if(k.nodeName!=="INPUT"){g.wordWrap="break-word"}g.position="absolute";if(!h){g.visibility="hidden"}d.forEach(function(p){g[p]=j[p]});if(e){if(k.scrollHeight>parseInt(j.height)){g.overflowY="scroll"}}else{g.overflow="hidden"}f.textContent=k.value.substring(0,l);if(k.nodeName==="INPUT"){f.textContent=f.textContent.replace(/\s/g,"\u00a0")}var n=document.createElement("span");n.textContent=k.value.substring(l)||".";f.appendChild(n);var m={top:n.offsetTop+parseInt(j["borderTopWidth"]),left:n.offsetLeft+parseInt(j["borderLeftWidth"])};if(h){n.style.backgroundColor="#aaa"}else{document.body.removeChild(f)}return m}if(typeof b!="undefined"&&typeof b.exports!="undefined"){b.exports=c}else{window.getCaretCoordinates=c}}())}])});
POWERMODE.colorful=true;POWERMODE.shake=false;document.body.addEventListener("input",POWERMODE);
/* 文本框打字机特效——over */
5.5 评论一键打卡赞踩
设置外观 → 开发者设置 → 自定义 JavaScript
/* 评论一键打卡赞踩——begin */
function a(a, b, c) {
if (document.selection) a.focus(), sel = document.selection.createRange(), c ? sel.text = b + sel.text + c : sel.text = b, a.focus();
else if (a.selectionStart || "0" == a.selectionStart) {
var l = a.selectionStart,
m = a.selectionEnd,
n = m;
c ? a.value = a.value.substring(0, l) + b + a.value.substring(l, m) + c + a.value.substring(m, a.value.length) : a.value = a.value.substring(0, l) + b + a.value.substring(m, a.value.length);
c ? n += b.length + c.length : n += b.length - m + l;
l == m && c && (n -= c.length);
a.focus();
a.selectionStart = n;
a.selectionEnd = n
} else a.value += b + c, a.focus()
}
var b = (new Date).toLocaleTimeString(),
c = document.getElementById("comment") || 0;
window.SIMPALED = {};
window.SIMPALED.Editor = {
daka: function() {
a(c, "滴!学生卡!打卡时间:" + b, ",请上车的乘客系好安全带~")
},
zan: function() {
a(c, " 文章写得不错,给你点个赞,继续加油哈!")
},
cai: function() {
a(c, "骚年,我怀疑你写了一篇假的文章!")
}
};
/* 评论一键打卡赞踩——over */
设置外观 → 开发者设置 → 自定义 CSS
/* 评论一键打卡赞踩——begin */
.secret_comment {
top: 5px;
}
.OwO.OwO-open .OwO-body {
display:table
}
/* 评论一键打卡赞踩——over */
首先找到 /usr/themes/handsome/component/comments.php
文件
直接将画框中代码块替换为如下代码:
<!-- 评论一键打卡赞踩——begin -->
<div class="comment-form-comment form-group">
<label for="comment"><?php _me("评论") ?>
<span class="required text-danger">*</span></label>
<span class="required text-danger">(请使用真实邮箱地址,方便及时接收评论回复!)</span>
<textarea id="comment" class="textarea form-control OwO-textarea" name="text" rows="5" placeholder="<?php _me("说点什么吧……") ?>" οnkeydοwn="if(event.ctrlKey&&event.keyCode==13){document.getElementById('submit').click();return false};"><?php $this->remember('text'); ?></textarea>
<div class="OwO" style="display: inline;"></div>
<div class="OwO" title="打卡" style="display: inline;" onclick="javascript:SIMPALED.Editor.daka();this.style.display='none'"><div class="OwO-logo"><i class="fontello-pencil"></i><span class="OwOlogotext">打卡</span></div></div>
<div class="OwO" title="赞" style="display: inline;" onclick="javascript:SIMPALED.Editor.zan();this.style.display='none'"><div class="OwO-logo"><i class="glyphicon glyphicon-thumbs-up"></i><span class="OwOlogotext"></span></div></div>
<div class="OwO" title="踩" style="display: inline;" onclick="javascript:SIMPALED.Editor.cai();this.style.display='none'"><div class="OwO-logo"><i class="glyphicon glyphicon-thumbs-down"></i><span class="OwOlogotext"></span></div></div>
<div class="secret_comment" id="secret_comment" data-toggle="tooltip" data-original-title="<?php _me("开启该功能,您的评论仅作者和评论双方可见") ?>">
<label class="secret_comment_label control-label"><?php _me("私密评论") ?></label>
<div class="secret_comment_check">
<label class="i-switch i-switch-sm bg-dark m-b-ss m-r">
<input type="checkbox" id="secret_comment_checkbox">
<i></i>
</label>
</div>
</div>
</div>
<!-- 评论一键打卡赞踩——over -->
6、版权
6.1 禁止 F12
设置外观 → 开发者设置 → 自定义 JavaScript
如果主题中启用了pjax,还需要将下述代码添加到设置外观 → PJAX → PJAX 回调函数。
/* 禁止F12——begin */
$(document).ready(function() {
document.oncontextmenu = function() {
return false;
}
document.onkeydown = function() {
//f12
if (window.event && window.event.keyCode == 123) {
event.keyCode = 0;
event.returnValue = false;
return false;
}
//ctrl+u
if (event.ctrlKey && window.event.keyCode == 85) {
return false;
}
//ctrl+shift+i
if ((event.ctrlKey) && (event.shiftKey) && (event.keyCode == 73)) {
return false;
}
// Ctrl+S
else if ((event.ctrlKey) && (event.keyCode == 83)) {
return false;
}
};
});
/* 禁止F12——begin */
6.2 自定义右键
设置外观 → 开发者设置 → 自定义输出 body 头部的 HTML 代码
<!-- 自定义右键——begin -->
<link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<!-- 自定义右键——over -->
设置外观 → 开发者设置 → 自定义输出 body 尾部的 HTML 代码
<!-- 自定义右键——begin -->
<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(170,222,18,0.88)}
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.pendulumye.com/"><i class="fa fa-home"></i><span>首页</span></a></li>
<li><a href="javascript:void(0);" onclick="getSelect();"><i class="fa fa-copy"></i><span>复制</span></a></li>
<li><a href="javascript:void(0);" onclick="baiduSearch();"><i class="fa fa-search"></i><span>搜索</span></a></li>
<li><a href="javascript:history.go(1);"><i class="fa fa-arrow-right"></i><span>前进</span></a></li>
<li><a href="javascript:history.go(-1);"><i class="fa fa-arrow-left"></i><span>后退</span></a></li>
<li style="border-bottom:1px solid gray"><a href="javascript:window.location.reload();"><i class="fa fa-refresh"></i><span>重载网页</span></a></li>
<li><a href="放你网站的对应网址"><i class="fa fa-meh-o"></i><span>和我当邻居</span></a></li>
<li><a href="放你网站的对应网址"><i class="fa fa-pencil-square-o"></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) ? layer.msg("啊噢...你没还没选择文字呢!") : document.execCommand("Copy")
}
function baiduSearch() {
var a = window.getSelection ? window.getSelection() : document.selection.createRange().text;
"" == a ? layer.msg("啊噢...你没还没选择文字呢!") : window.open("https://www.baidu.com/s?wd=" + a)
}
$(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>
<!-- 自定义右键——over -->
6.3 底部版权美化
左侧底部放在设置外观 → 开发者设置 → 博客底部左侧信息
<!-- 左侧底部版权美化——begin -->
<div class="github-badge">
<span class="badge-subject">Copyright</span>
<a href="https://www.pendulumye.com/" target="_blank"><span class="badge-value bg-blue">PendulumYe</span></a>
</div> |
<div class="github-badge">
<span class="badge-subject">津ICP备</span>
<a href="http://www.beian.gov.cn/" target="_blank"><span class="badge-value bg-green">2022001988号-1</span></a>
</div>
<!-- 左侧底部版权美化——over -->
右侧底部放在设置外观 → 开发者设置 → 博客底部右侧信息
<!-- 右侧底部版权美化——begin -->
<div class="github-badge">
<span class="badge-subject">站点地图</span>
<a href="https://www.pendulumye.com/index.php/sitemap.xml" target="_blank">
<span class="badge-value bg-blue">sitemap</span>
</a>
</div> |
<div class="github-badge">
<span class="badge-subject">Theme by</span>
<a href="https://auth.ihewro.com/user/docs#/preference/" target="_blank">
<span class="badge-value bg-orange">Handsome</span></a>
</div>
<!-- 右侧底部版权美化——over -->
设置外观 → 开发者设置 → 自定义 CSS
/* 底部版权美化——begin */
.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-green {
background-color: #3bca6e
}
/* 底部版权美化——over */
把下面代码放在主题目录 usr/themes/handsome/component/footer.php
内,覆盖源代码
<!-- 右侧底部版权美化——begin-->
<footer id="footer" class="app-footer" role="footer">
<div class="wrapper 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>
</footer>
<!-- 右侧底部版权美化——over -->
6.4 文章末尾版权声明
进入 usr/themes/handsome/post.php
文件内
在 83 行代码下方加入以下代码:
<!-- 文章末尾版权声明——begin -->
<br><div class="entry-content l-h-2x">
<div style="border-top: 2px dotted #8e8e8e96;height: 0px;margin: 20px 0px;text-align: center;width: 100%;">
<span style="background-color: #23b7e5;color: #fff;padding: 6px 10px;position: relative;top: -14px;border-radius: 14px;">END</span>
</div><br>
<div class="entry-content l-h-2x">
<div style="padding: 10px;background: rgba(220, 220, 220, 0.22);font-size: 13px;border-left: 3px solid;text-align: left;">
<span class="tt-license-icon"><i data-feather="award"></i></span>
<span>本文作者:<a href="<?php $this->author->permalink(); ?>" rel="author"><?php $this->author(); ?></a><br></span>
<span class="tt-license-icon"><i data-feather="link"></i></span>
<span>文章标题:<a href="<?php $this->permalink() ?>"><?php $this->title() ?></a><br></span>
<span class="tt-license-icon"><i data-feather="shield"></i></span>
<span>本文地址:<a href="<?php $this->permalink() ?>"><?php $this->permalink() ?></a><br></span>
<span class="tt-license-icon"><i data-feather="alert-circle"></i></span>
<span>版权说明:若无注明,本文皆<a href="<?php $this->options->siteUrl(); ?>" target="_blank" data-original-title="<?php $this->options->title() ?>"><?php $this->options->title() ?></a>原创,转载请保留文章出处。</span>
</div>
</div>
<!-- 文章末尾版权声明——over -->
设置外观 → 开发者设置 → 自定义 CSS
<!-- 文章末尾版权声明——begin -->
.tt-license {
font-size: 12px;
font-weight: 600;
padding: 1rem;
background: repeating-linear-gradient(135deg, #f6f6f6, #f6f6f6 12px, #fff 0, #fff 24px);
background-color: #f3f5f7;
border-left: 3px solid #dde6e9;
margin-bottom: 20px;
}
.tt-license-icon {
align-items: center;
position: relative;
float: left;
margin: -5px -10px -10px 0;
margin-right: 10px;
overflow: hidden;
text-align: center;
display: flex;
height: 40px;
color: #ff5722;
}
.tt-license a {
color: #337ab7;
text-decoration: underline;
margin: 0 5px;
}
/*深色模式下的知识共享许可协议*/
html.theme-dark .tt-license {
background: repeating-linear-gradient(135deg, #191919, #191919 12px, #222 0, #222 24px);
border-left: 3px solid #494949;
}
.tt-license p {
line-height: 1.5em;
margin: 5px 0 !important;
}
<!-- 文章末尾版权声明——over -->
6.5 复制版权居中提示
设置外观 → 开发者设置 → 自定义输出 body 尾部的 HTML代码
<!-- 复制版权居中提示——begin -->
<script src="https://lib.baomitu.com/layer/3.1.1/layer.js"></script>
<!-- 复制版权居中提示——over -->
设置外观 → 开发者设置 → 自定义 JavaScript
/* 复制版权居中提示——begin */
document.body.oncopy=function(){layer.msg('复制成功,若要转载请务必保留原文链接!');};
/* 复制版权居中提示——over */
6.6 复制版权右侧提示
设置外观 → 开发者设置 → 自定义 JavaScript
/* 复制成功提示代码——begin */
kaygb_copy();
function kaygb_copy() {
$(document).ready(function () {
$("body").bind('copy', function (e) {
hellolayer()
})
});
var sitesurl = window.location.href;
function hellolayer() {
$.message({
message: "尊重原创,转载请注明出处!<br> 本文作者:PendulumYe.<br>原文链接:" + sitesurl,
title: "复制成功",
type: "warning",
autoHide: !1,
time: "3000"
})
}
}
/* 复制成功提示代码结束——over */
7、加载与统计
7.1 网站加载效果
找到 /usr/themes/handsome/component/header.php
将代码添加至此处:
<!-- 网站加载效果——begin -->
<style>
#PageLoading{background-color:#fff;height:100%;width:100%;position:fixed;z-index:1;margin-top:0px;top:0px;}
#PageLoading-center{width:100%;height:100%;position:relative;}
#PageLoading-center-absolute{
position:absolute;left:50%;top:50%;
height:200px;width:200px;
margin-top:-100px;
margin-left:-100px;
}
.object2{
-moz-border-radius:50% 50% 50% 50%;
-webkit-border-radius:50% 50% 50% 50%;
border-radius:50% 50% 50% 50%;
position:absolute;
border-left:5px solid #FFB6C1;
border-right:5px solid #b6def7;
border-top:5px solid transparent;
border-bottom:5px solid transparent;
-webkit-animation:animate 2s infinite;
animation:animate 2s infinite;
}
#object_one{left:75px;top:75px;width:50px;height:50px;}
#object_two{left:65px;top:65px;width:70px;height:70px;-webkit-animation-delay:0.1s;animation-delay:0.1s;}
#object_three{left:55px;top:55px;width:90px;height:90px;-webkit-animation-delay:0.2s;animation-delay:0.2s;}
#object_four{left:45px;top:45px;width:110px;height:110px;-webkit-animation-delay:0.3s;animation-delay:0.3s;}
@-webkit-keyframes animate{50%{-ms-transform:rotate(180deg);-webkit-transform:rotate(180deg);transform:rotate(180deg);}
100%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}}
@keyframes animate{50%{-ms-transform:rotate(180deg);-webkit-transform:rotate(180deg);transform:rotate(180deg);}
100%{-ms-transform:rotate(0deg);-webkit-transform:rotate(0deg);transform:rotate(0deg);}}
</style>
<body id="body" class="fix-padding" style="overflow:hidden">
<div id="PageLoading" style="z-index:99999999;">
<div id="PageLoading-center">
<div id="PageLoading-center-absolute">
<div class="object2" id="object_four"></div>
<div class="object2" id="object_three"></div>
<div class="object2" id="object_two"></div>
<div class="object2" id="object_one"></div>
</div>
</div>
</div>
</body>
<!-- 网站加载效果——over -->
7.2 动态网站标题
设置外观 → 开发者设置 → 自定义 JavaScript
/* 动态网站标题——begin */
var OriginTitle = document.title;
var titleTime;
document.addEventListener('visibilitychange', function () {
if (document.hidden) {
//$('[rel="icon"]').attr('href', "https://cdn.jsdelivr.net/gh/Catalpablog/handsome/img/warning.webp");
document.title = '网页崩溃了!!!';
clearTimeout(titleTime);
}
else {
//$('[rel="icon"]').attr('href', "https://blog-images-1309598269.cos.ap-beijing.myqcloud.com/attire/favicon.ico");
document.title = '咦,又好啦(✿◡‿◡)' ;
titleTime = setTimeout(function () {
document.title = OriginTitle;
}, 2000);
}
});
/* 动态网站标题——over */
7.3 右侧边栏添加时间统计
首先在主题 usr/themes/handsome/component/sidebar.php
将以下代码加到 usr/themes/handsome/component/sidebar.php
<!-- 右侧边栏添加时间统计——begin -->
<section id="blog_info" class="widget widget_categories wrapper-md clear">
<h5 class="widget-title m-t-none text-md"><?php _me("岁月不待人") ?></h5>
<div class="sidebar sidebar-count">
<div class="content">
<div class="item" id="dayProgress">
<div class="title">今日已经过去<span></span>小时</div>
<div class="progress">
<div class="progress-bar">
<div class="progress-inner progress-inner-1"></div>
</div>
<div class="progress-percentage"></div>
</div>
</div>
<div class="item" id="weekProgress">
<div class="title">这周已经过去<span></span>天</div>
<div class="progress">
<div class="progress-bar">
<div class="progress-inner progress-inner-2"></div>
</div>
<div class="progress-percentage"></div>
</div>
</div>
<div class="item" id="monthProgress">
<div class="title">本月已经过去<span></span>天</div>
<div class="progress">
<div class="progress-bar">
<div class="progress-inner progress-inner-3"></div>
</div>
<div class="progress-percentage"></div>
</div>
</div>
<div class="item" id="yearProgress">
<div class="title">今年已经过去<span></span>个月</div>
<div class="progress">
<div class="progress-bar">
<div class="progress-inner progress-inner-4"></div>
</div>
<div class="progress-percentage"></div>
</div>
</div>
</div>
</div>
</section>
<!-- 右侧边栏添加时间统计——over -->
将以下代码放入外观设置 → 开发者设置 → 自定义 css
/* 右侧边栏添加时间统计——begin */
.sidebar-count .content {
padding: 15px
}
.sidebar-count .content .item {
margin-bottom: 15px
}
.sidebar-count .content .item:last-child {
margin-bottom: 0
}
.sidebar-count .content .item .title {
font-size: 12px;
color: var(--minor);
margin-bottom: 5px;
display: flex;
align-items: center
}
.sidebar-count .content .item .title span {
color: var(--theme);
font-weight: 500;
font-size: 14px;
margin: 0 5px
}
.sidebar-count .content .item .progress {
display: flex;
align-items: center
}
.sidebar-count .content .item .progress .progress-bar {
height: 10px;
border-radius: 5px;
overflow: hidden;
background: var(--classC);
width: 0;
min-width: 0;
flex: 1;
margin-right: 5px
}
@keyframes progress {
0% {
background-position: 0 0
}
100% {
background-position: 30px 0
}
}
.sidebar-count .content .item .progress .progress-bar .progress-inner {
width: 0;
height: 100%;
border-radius: 5px;
transition: width 0.35s;
-webkit-animation: progress 750ms linear infinite;
animation: progress 750ms linear infinite
}
.sidebar-count .content .item .progress .progress-bar .progress-inner-1 {
background: #bde6ff;
background-image: linear-gradient(135deg, #50bfff 25%, transparent 25%, transparent 50%, #50bfff 50%, #50bfff 75%, transparent 75%, transparent 100%);
background-size: 30px 30px
}
.sidebar-count .content .item .progress .progress-bar .progress-inner-2 {
background: #ffd980;
background-image: linear-gradient(135deg, #f7ba2a 25%, transparent 25%, transparent 50%, #f7ba2a 50%, #f7ba2a 75%, transparent 75%, transparent 100%);
background-size: 30px 30px
}
.sidebar-count .content .item .progress .progress-bar .progress-inner-3 {
background: #ffa9a9;
background-image: linear-gradient(135deg, #ff4949 25%, transparent 25%, transparent 50%, #ff4949 50%, #ff4949 75%, transparent 75%, transparent 100%);
background-size: 30px 30px
}
.sidebar-count .content .item .progress .progress-bar .progress-inner-4 {
background: #67c23a;
background-image: linear-gradient(135deg, #4f9e28 25%, transparent 25%, transparent 50%, #4f9e28 50%, #4f9e28 75%, transparent 75%, transparent 100%);
background-size: 30px 30px
}
.sidebar-count .content .item .progress .progress-percentage {
color: var(--info)
}
/* 右侧边栏添加时间统计——over */
添加完成后,在到 usr/themes/handsome/assets/js
里面创建名为 timeinfo.js
后把下面代码复制进去保存
添加完成,将以下代码放入外观设置 → 开发者设置 → 自定义输出 body 尾部
/* 右侧边栏添加时间统计——begin */
function init_life_time() {
function getAsideLifeTime() {
/* 当前时间戳 */
let nowDate = +new Date();
/* 今天开始时间戳 */
let todayStartDate = new Date(new Date().toLocaleDateString()).getTime();
/* 今天已经过去的时间 */
let todayPassHours = (nowDate - todayStartDate) / 1000 / 60 / 60;
/* 今天已经过去的时间比 */
let todayPassHoursPercent = (todayPassHours / 24) * 100;
$('#dayProgress .title span').html(parseInt(todayPassHours));
$('#dayProgress .progress .progress-inner').css('width', parseInt(todayPassHoursPercent) + '%');
$('#dayProgress .progress .progress-percentage').html(parseInt(todayPassHoursPercent) + '%');
/* 当前周几 */
let weeks = {
0: 7,
1: 1,
2: 2,
3: 3,
4: 4,
5: 5,
6: 6
};
let weekDay = weeks[new Date().getDay()];
let weekDayPassPercent = (weekDay / 7) * 100;
$('#weekProgress .title span').html(weekDay);
$('#weekProgress .progress .progress-inner').css('width', parseInt(weekDayPassPercent) + '%');
$('#weekProgress .progress .progress-percentage').html(parseInt(weekDayPassPercent) + '%');
let year = new Date().getFullYear();
let date = new Date().getDate();
let month = new Date().getMonth() + 1;
let monthAll = new Date(year, month, 0).getDate();
let monthPassPercent = (date / monthAll) * 100;
$('#monthProgress .title span').html(date);
$('#monthProgress .progress .progress-inner').css('width', parseInt(monthPassPercent) + '%');
$('#monthProgress .progress .progress-percentage').html(parseInt(monthPassPercent) + '%');
let yearPass = (month / 12) * 100;
$('#yearProgress .title span').html(month);
$('#yearProgress .progress .progress-inner').css('width', parseInt(yearPass) + '%');
$('#yearProgress .progress .progress-percentage').html(parseInt(yearPass) + '%');
}
getAsideLifeTime();
setInterval(() => {
getAsideLifeTime();
}, 1000);
}
init_life_time();
/* 右侧边栏添加时间统计——over */
再将以下代码放入设置外观 → 开发者设置 → 自定义 JavaScript
/* 右侧边栏添加时间统计——begin */
$(function(){
$("#PageLoading").fadeOut(400);
$("#body").css('overflow','');
});
/* 右侧边栏添加时间统计——over */
7.4 小版图片模式列表斜切
打开 usr/themes/handsome/libs/Content.php
将以下代码替换:
<!-- 小版图片模式列表斜切——begin -->
<div class="panel-small single-post box-shadow-wrap-normal tt-small-blur">
<div class="index-post-img-small post-feature index-img-small tt-left-box">
<a href="{$parameterArray['linkUrl']}">
<div class="item-thumb-small lazy tt-left-img" {$backgroundImageHtml}></div>
</a>
</div>
<div class="tt-blur-img" {$backgroundImageHtml}></div>
<!-- 小版图片模式列表斜切——over-->
设置外观 → 开发者设置 → 自定义 css
/* 小版图片模式列表斜切——begin */
.tt-small-blur{position:relative;z-index:1;display:flex;overflow:hidden;background-color:#333;color:#fff;}
.tt-small-blur .tt-left-box{z-index:1;-webkit-clip-path:polygon(0 0,94% 0,100% 100%,0 100%);clip-path:polygon(0 0,94% 0,100% 100%,0 100%);}
.tt-small-blur .tt-left-img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;}
.tt-small-blur .tt-blur-img{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;width:100%;height:100%;background-position:center;background-size:cover;transform:scale(1.4);-o-object-fit:cover;object-fit:cover;-webkit-filter:blur(1.275rem) brightness(.83);filter:blur(1.275rem) brightness(.83);}
.tt-small-blur .post-meta{z-index:1;display:flex;color:inherit;flex-direction:column;justify-content:space-between;}
.tt-small-blur .text-title{color:inherit;}
.tt-small-blur .post-meta h2,.tt-small-blur .post-meta p{text-shadow:.1875rem .1875rem .3125rem #333;letter-spacing:.09rem;}
.tt-small-blur .text-muted{color:inherit;}
.tt-small-blur .post-meta {padding: 30px 30px 15px 30px;}
@media (max-width:500px){.tt-small-blur .index-post-title{display:-webkit-box;display:-moz-box;overflow:hidden;margin-bottom:2px;height:48px;text-overflow:ellipsis;white-space:normal;word-wrap:break-word;line-height:1.4;-webkit-line-clamp:2;-webkit-box-orient:vertical;-moz-line-clamp:2;-moz-box-orient:vertical;word-break:break-all;}}
@media (max-width:500px){.tt-small-blur .summary{display:none;}}
@media (max-width:380px){.tt-small-blur .post-meta{padding:10px 15px;}}
@media (min-width:768px) and (max-width: 1199px){.tt-small-blur .summary {height: 55px;}.tt-small-blur .line-lg {margin-top: 1px;margin-bottom: 1px;}}
/* 小版图片模式列表斜切——over */
7.5 网站初始化加载完成提示代码
设置外观 → 开发者设置 → 自定义 JavaScript
/* 网站初始化加载完成提示代码——begin */
function kaygb_referrer(){
var kaygb_referrer = document.referrer;
if (kaygb_referrer != ""){
return "感谢您的访问! 您来自:<br>" + document.referrer;
}else{
return "";
}}
$.message({
message: kaygb_referrer() + "怀才就像怀孕,时间久了才能看出来<br>知识就像内裤,看不见但却重要",
title: "网站加载完成",
type: "success",
autoHide: !1,
time: "3000"/*弹框显示的时长(ms)*/
})
/* 网站初始化加载完成提示代码——over */
7.6 右侧边栏添加访客总数、响应耗时、全站字数
进入 usr/themes/handsome/libs/Content.php
文件
在该位置里加入以下统计代码:
/* 总访问量——begin */
function theAllViews() {
$db = Typecho_Db::get();
$row = $db->fetchAll('SELECT SUM(VIEWS) FROM `typecho_contents`');
echo number_format($row[0]['SUM(VIEWS)']);
}
/* 总访问量——over */
/* 加载时间——begin */
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;
}
/* 加载时间——over */
/* 统计字数——begin*/
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;
}
/* 统计字数——over*/
在 usr/themes/handsome/component/sidebar.php
添加显示代码,
在 105 行代码下方插入以下代码:
<!-- 访客总数代码——begin -->
<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>
<!-- 访客总数代码——over -->
<!-- 响应耗时代码——begin -->
<li class="list-group-item text-second">
<span class="blog-info-icons"><i data-feather="refresh-ccw"></i></span>
<span class="badge pull-right"><?php echo timer_stop();?></span>
<?php _me("响应耗时") ?>
</li>
<!-- 响应耗时代码——over -->
<!-- 全站字数代码——begin -->
<li class="list-group-item text-second">
<span class="blog-info-icons"><i data-feather="edit-3"></i></span>
<span class="badge pull-right"><?php echo allOfCharacters(); ?></span>
<?php _me("全站字数") ?>
</li>
<!-- 全站字数代码——over -->
7.7 统计信息彩色图标和文字
去 usr/themes/handsome/component/sidebar.php
文件中
将以下代码替换如图所示标签中的所有内容:
<ul class="list-group box-shadow-wrap-normal">
<?php Typecho_Widget::widget('Widget_Stat')->to($stat); ?>
<li class="list-group-item text-second">
<span class="blog-info-icons" style="color:#DA99FF;"><i data-feather="award"></i></span>
<span class="badge pull-right" style="background-color:#ECA9A7;"><?php $stat->publishedPostsNum() ?></span>
<?php _me("文章数目") ?>
</li>
<?php if (COMMENT_SYSTEM == 0): ?>
<li class="list-group-item text-second">
<span class="blog-info-icons" style="color:#D9B999;"><i data-feather="message-circle"></i></span>
<span class="badge pull-right" style="background-color:#428BCA;"><?php $stat->publishedCommentsNum() ?></span>
<?php _me("评论数目") ?>
</li>
<?php endif; ?>
<li class="list-group-item text-second">
<span class="blog-info-icons" style="color:#FF69B4;"> <i data-feather="calendar"></i></span>
<span class="badge pull-right" style="background-color:#AEDCAE;"><?php echo Utils::getOpenDays(); ?></span>
<?php _me("运行天数") ?>
</li>
<li class="list-group-item text-second">
<span class="blog-info-icons"><i data-feather="activity"></i></span>
<span class="badge pull-right" style="background-color:#FFB380;"><?php echo Utils::getLatestTime($this); ?></span>
<?php _me("最后活动") ?>
</li>
<!-- 访客总数代码——begin -->
<li class="list-group-item text-second">
<span class="blog-info-icons" style="color:#AEDCAE;"> <i data-feather="users"></i></span>
<span class="badge pull-right" style="background-color:#FF69B4;"><?php echo theAllViews();?></span>
<?php _me("访客总数") ?>
</li>
<!-- 访客总数代码——over -->
<!-- 响应耗时代码——begin -->
<li class="list-group-item text-second">
<span class="blog-info-icons" style="color:#428BCA;"><i data-feather="refresh-ccw"></i></span>
<span class="badge pull-right" style="background-color:#D9B999;"><?php echo timer_stop();?></span>
<?php _me("响应耗时") ?>
</li>
<!-- 响应耗时代码——over -->
<!-- 全站字数代码——begin -->
<li class="list-group-item text-second">
<span class="blog-info-icons" style="color:#ECA9A7;"><i data-feather="edit-3"></i></span>
<span class="badge pull-right" style="background-color:#DA99FF;"><?php echo allOfCharacters(); ?></span>
<?php _me("全站字数") ?>
</li>
<!-- 全站字数代码——over -->
</ul>
7.8 右侧边栏文章图标
进入 usr/themes/handsome/assets/img/sj2
目录下,替换原有的文件即可
8、其他美化
8.1 主题标题居中
设置外观 → 开发者设置 → 自定义 CSS
/* 主题标题居中——begin */
header.bg-light.lter.wrapper-md {
text-align: center;
}
/* 主题标题居中——over */
8.2 最右侧滚动条
设置外观 → 开发者设置 → 自定义 CSS
/* 滚动条——begin */
/*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar {
width: 8px;
height: 6px
}
/*定义滚动条轨道*/
::-webkit-scrollbar-track {
background-color: transparent;
-webkit-border-radius: 2em;
-moz-border-radius: 2em;
border-radius: 2em
}
/*定义滑块 内阴影+圆角*/
::-webkit-scrollbar-thumb {
background-color: #BFBFBF;
background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.4) 100%,transparent 100%,transparent 50%,rgba(255,255,255,.4) 50%,rgba(255,255,255,.4) 75%,transparent 75%,transparent);
-webkit-border-radius: 2em;
-moz-border-radius: 2em;
border-radius: 2em
}
/* 滚动条——over */
8.3 左上角 logo 扫光
设置外观 → 开发者设置 → 自定义 CSS
/* 左上角 logo 扫光——begin */
.navbar-brand {
position: relative;
overflow: hidden;
margin: 0px 0 0 0px;
}
.navbar-brand:before {
content: "";
position: absolute;
left: -665px;
top: -460px;
width: 200px;
height: 15px;
background-color: rgba(255, 255, 255, .5);
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-animation: searchLights 6s ease-in 0s infinite;
-o-animation: searchLights 6s ease-in 0s infinite;
animation: searchLights 6s ease-in 0s infinite;
}
@-moz-keyframes searchLights {
50% {
left: -100px;
top: 0;
}
65% {
left: 120px;
top: 100px;
}
}
@keyframes searchLights {
40% {
left: -100px;
top: 0;
}
60% {
left: 120px;
top: 100px;
}
80% {
left: -100px;
top: 0px;
}
}
/* 左上角 logo 扫光——over */
8.4 文章百度收录查询
首先去 usr/themes/handsome/post.php
,添加以下代码:
<!-- 文章百度收录查询——begin -->
<li class="meta-baidu">
<span class="post-icons">
<i class="glyphicon glyphicon-refresh" id="baidu_icon"></i>
</span><span class="meta-value" id="baidu_result">加载中</span>
</li>
<!-- 文章百度收录查询——over -->
在该文件最底部添加:
/* 文章百度收录查询——begin */
<script>
function baidu_check(){
$.getJSON("https://xiaochamao.com/api/baidu.php?domain="+window.location.href,function(result){
if (result.code == 200) {
$('#baidu_icon').removeClass('glyphicon-refresh');
$('#baidu_icon').addClass('glyphicon-ok-circle');
$('#baidu_result').text('百度已收录');
}else if(result.code == 403){
$('#baidu_icon').removeClass('glyphicon-refresh');
$('#baidu_icon').addClass('glyphicon-info-sign');
$('#baidu_result').text('百度未收录');
baidu_push();
}else{
$('#baidu_icon').removeClass('glyphicon-refresh');
$('#baidu_icon').addClass('glyphicon-remove-circle');
$('#baidu_result').text('查询收录失败');
}
});
}
function baidu_push(){
var bp = document.createElement('script');
var curProtocol = window.location.protocol.split(':')[0];
if (curProtocol === 'https') {
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
} else {
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
}
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
}
baidu_check();
</script>
/* 文章百度收录查询——over */
设置外观 → PJAX → PJAX 回调函数
/* 文章百度收录查询——begin */
if((typeof baidu_check) !== "undefined"){
baidu_check();
}
/* 文章百度收录查询——over */
8.5 右侧边栏上方3图标
进入 usr/themes/handsome/component/sidebar.php
文件
将红框处代码替换为以下代码即可:
ul class="nav nav-tabs nav-justified box-shadow-bottom-normal tablist" role="tablist">
<li data-index="0" class="active" role="presentation">
<a data-target="#widget-tabs-4-hots" role="tab"
aria-controls="widget-tabs-4-hots" aria-expanded="true"
data-toggle="tab">
<div class="sidebar-icon wrapper-sm">
<img src="https://blog-images-1309598269.cos.ap-beijing.myqcloud.com/headImg/202205300108360.svg" style="height: 2.5em;">
</div>
<span class="sr-only"><?php _me("热门文章") ?></span>
</a>
</li>
<?php if (COMMENT_SYSTEM == 0): ?>
<li role="presentation" data-index="1">
<a data-target="#widget-tabs-4-comments" role="tab"
aria-controls="widget-tabs-4-comments" aria-expanded="false"
data-toggle="tab">
<div class="sidebar-icon wrapper-sm">
<img src="https://blog-images-1309598269.cos.ap-beijing.myqcloud.com/headImg/202205300112228.svg" style="height: 2.5em;">
</div>
<span class="sr-only"><?php _me("最新评论") ?></span>
</a>
</li>
<?php endif; ?>
<li data-index="2" role="presentation">
<a data-target="#widget-tabs-4-random" role="tab"
aria-controls="widget-tabs-4-random" aria-expanded="false"
data-toggle="tab">
<div class="sidebar-icon wrapper-sm">
<img src="https://blog-images-1309598269.cos.ap-beijing.myqcloud.com/headImg/202205300113292.svg" style="height: 2.5em;">
</div>
<span class="sr-only"><?php _me("随机文章") ?></span>
</a>
</li>
<span class="navs-slider-bar"></span>
</ul>
8.6 右上角导航栏显示文字
进入 usr/themes/handsome/compent/headnav.php
文件中
将红框处代码替换为以下代码即可:
$headerItemsOutput .= '<li class="dropdown"><a '.$linkStatus.' href="'.$itemLink.'" class="feathericons dropdown-toggle" '.$iconColor.'>'.Content::returnIconHtml($iconName,true).'<div style="float:right;margin-top:2px"><span style="margin-left:5px; color:#FFFFFF">'._mt($itemName).'</span></div></a></li>';
8.7 去除右上角导航栏的登录接口
进入 usr/themes/handsome/compent/headnav.php
文件中将以下部分注释掉即可:
8.8 去除顶部博客名称
修改 /usr/themes/handsome/index.php
文件,删除以下代码:
<h1 class="m-n font-thin h3 text-black l-h"><?php $this->options->title(); ?></h1>
8.9 博客首页顶部添加倒计时
设置外观 → 开发者设置 → 自定义 CSS
/* 博客首页顶部添加倒计时——begin */
.gn_box {
padding: 10px 14px;
margin-bottom: 20px;
text-align: center;
background-color: #fff;
}
#t_d{
color: #982585;
font-size: 18px;
}
#t_h{
color: #8f79c1;
font-size: 18px;
}
#t_m{
color: #65b4b5;
font-size: 18px;
}
#t_s{
color: #83caa3;
font-size: 18px;
}
/* 博客首页顶部添加倒计时——over */
设置外观 → 开发者设置 → 首页列表最前方广告位
<!-- 博客首页顶部添加倒计时——begin -->
<div class="gn_box">
<h1><font color=#E80017>距</font><font color=#D1002E>离</font><font color=#BA0045>2</font><font color=#A3005C>0</font><font
color=#8C0073>2</font><font color=#75008A>3</font><font color=#5E00A1>年</font><font
color=#4700B8>毕</font><font color=#3000CF>业</font><font color=#1900E6>还</font><font color=#0200FD>有</font>
</h1>
<center>
<div id="CountMsg" class="HotDate">
<span id="t_d">157 天</span>
<span id="t_h">9 时</span>
<span id="t_m">7 分</span>
<span id="t_s">42 秒</span>
</div>
</center>
<script type="text/javascript"> function getRTime() {
var EndTime = new Date('2023/06/18 00:00:00');
var NowTime = new Date();
var t = EndTime.getTime() - NowTime.getTime();
var d = Math.floor(t / 1000 / 60 / 60 / 24);
var h = Math.floor(t / 1000 / 60 / 60 % 24);
var m = Math.floor(t / 1000 / 60 % 60);
var s = Math.floor(t / 1000 % 60);
document.getElementById("t_d").innerHTML = d + " 天";
document.getElementById("t_h").innerHTML = h + " 时";
document.getElementById("t_m").innerHTML = m + " 分";
document.getElementById("t_s").innerHTML = s + " 秒";
}
setInterval(getRTime, 1000);
</script>
</div>
<!-- 博客首页顶部添加倒计时——over -->
8.10 右侧边栏栏目前SVG图标
在 usr/themes/handsome/component/siderbar.php
文件这些位置分别添加相应代码:
<img src="https://blog-images-1309598269.cos.ap-beijing.myqcloud.com/blogImgs/202207232129594.svg" style="height: 1.5em;">
<img src="https://blog-images-1309598269.cos.ap-beijing.myqcloud.com/blogImgs/202207232127056.svg" style="height: 1.5em;">
<img src="https://blog-images-1309598269.cos.ap-beijing.myqcloud.com/blogImgs/202207232130739.svg" style="height: 1.5em;">
<img src=" https://blog-images-1309598269.cos.ap-beijing.myqcloud.com/blogImgs/202207232131820.svg" style="height: 1.5em;">
<img src="https://blog-images-1309598269.cos.ap-beijing.myqcloud.com/blogImgs/202207232132542.svg" style="height: 1.5em;">
<img src="https://blog-images-1309598269.cos.ap-beijing.myqcloud.com/blogImgs/202207232134150.svg" style="height: 1.5em;">
9、整体优化
9.1 伪静态设置
后台管理 → 设置 → 永久链接,启用地址重写功能
同时去宝塔面板中配置伪静态:
9.2 添加GZIP压缩
在Typecho站点根目录下的 config.inc.php
文件内加入下面的配置:
/** 开启gzip压缩 */
ob_start('ob_gzhandler');
9.3 解决QQ微信内置浏览器评论失败
进入数据库中,执行下方 SQL 命令:
ALTER TABLE `typecho_comments` CHANGE `agent` `agent` VARCHAR(512)
如果启用了插件 Access,建议执行下方 SQL 命令:
ALTER TABLE `typecho_access_log` CHANGE `ua` `ua` VARCHAR(512)
10、插件汇总及参考网站
插件名 | 说明 | 详情链接地址 |
---|---|---|
GoTop | 置顶悬挂猫插件 | |
CodePrettify | 代码高亮插件 | |
HoerMouse | 炫彩鼠标插件 | |
CommentFilter | 智能垃圾评论过滤插件 | |
CommentPush | 评论推送提醒插件 | |
MarkdownParse | 更快、更全的 Markdown 解析插件 | |
UserAgent | 显示评论者信息插件 | |
ZFonts | 字体美化插件 | |
ShortLinks | 外链转内链插件 | |
Sitemap | 自动生成站点地图插件 | |
Tagshelper | 文章标签选择插件 |
1 条评论