关于博客上配置的一些小功能汇总 |坐而言不如起而行！二丫讲梵

本文预计阅读时间 4 分钟

文章目录[隐藏]

1，鼠标指尖贯彻社会主义核心价值观。
2，更改鼠标样式。
3，关于右侧侧边栏的 3D 标签云。
4，配置博客有评论微信通知。
5，如何将 404 页面对接到腾讯公益。

很多时候在使用博客的过程中，遇到不少实用而且给力的小工具，这里统一进行记录整理。

1，鼠标指尖贯彻社会主义核心价值观。

之前在浏览某些站点的时候，就看到过人家的站点里鼠标点击之后会显示诸如“富强”，“民主”，“自由”之类的词汇，感觉很高大上额，今天心血来潮也给博客添加了这个功能，网上一找，原来竟是如此简单。

效果展示：

这里可以看到点击之后的核心主机价值观各字的颜色是不停变幻的，这个颜色随机的功能，也是许多介绍这个功能的博客里的代码所不具备的，我找到这个代码也是非常巧合的缘分，其间丢过，后来又费了大劲儿找回来，现在下边保存的就是了，再也不怕丢失了。

接下来就介绍一下这个用代码实现的鼠标点击特效的功能。文章整理自https://www.itfensi.net/article/1417.html

去到主题的根目录下找到 footer.php，打开并添加下边的代码。添加位置如图所示：

添加的代码内容如下：

<!--eryajf 鼠标单击特效-->
<script type="text/javascript"> /* 鼠标特效 */
function getColorRandom(){ /* 随机颜色函数 */
var c="#";
var cArray=["0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F"];
for(var i=0;i<6;i++){
var cIndex= Math.round(Math.random()*15);
c+=cArray[cIndex];
}
return c;
}
var a_idx = 0; jQuery(document).ready(function($)
{
$("body").click(function(e){
var a = new Array("富强", "民主", "文明", "和谐", "自由", "平等", "公正" ,"法治", "爱国", "敬业", "诚信", "友善");
var $i = $("<span/>").text(a[a_idx]);
a_idx = (a_idx + 1) % a.length;
var x = e.pageX,
y = e.pageY;
$i.css({
"z-index": 999999999,
"top": y - 20,
"left": x,
"position": "absolute",
"font-weight": "bold",
"color":getColorRandom()});
$("body").append($i);
$i.animate({
"top": y - 180, "opacity": 0}, 1500,
function() { $i.remove(); }); }); });
</script>

2，更改鼠标样式。

之前在各种博客闲逛的时候，看见过一些变异了的鼠标样式，那时候还不知道鼠标样式这个词儿，而且感觉很多站点设置的鼠标样式并不好看，直到偶然间逛到闲鱼博客，看到了滑稽版的鼠标样式，让我瞬间觉得，这么一个有意思而又可爱的样式，，我也想要。

说干就干，就去百度怎么弄。最后参考了这篇文章：https://www.qcgzxw.cn/1385.html#

总结起来也就两步：

1，上传鼠标样式文件到服务器。

2，将上传的在 style.css 里边进行引用。

我就因为上传的鼠标样式的文件不对，导致一直失败，大家可以根据自己的喜好去下载鼠标样式，如果也想要我的这个，那么点击下边链接可以下载。

文件下载	文件名称：鼠标样式	文件大小：50K
	下载声明：本站文件大多来自于网络，仅供学习和研究使用，不得用于商业用途，如果有版权问题，请联系博主进行相关处理！
	下载地址：https://pan.baidu.com/s/1xLNIatKR8giMZqY8DZkmug

关于提取密码，请看下边的介绍。

注意：本段内容须成功“回复本文”后“刷新本页”方可查看！

下载之后，上传到服务器的对应目录下。要保证可以通过连接下载到。

然后在主题根目录下的 style.css 文件开头添加如下代码：

/** 鼠标样式 开始**/ 
/** 普通指针样式**/ 
body {
cursor: url(http://www.eryajf.net/啦啦啦), default;
}
 
/** 链接指针样式**/ 
a:hover{cursor:url(http://www.eryajf.net/啦啦啦), pointer;}
 
/** 鼠标样式 结束**/

注意：要将 url 改成你自己的域名以及你的鼠标样式文件所放的位置。

然后再去浏览器里边刷新，应该就可以了。

如果，并不可以。那么尝试清除浏览器缓存，以及重启 nginx，等，将缓存释放，再去尝试。

如果，还不行，那么参考一下：WordPress 解决修改 style.css 不生效问题三步走！这篇文章。

以上，就实现了如本站的鼠标样式啦。

当然还有更简单的方式，就是使用插件（Unique Cursor），但是插件里边的有太 low 了，所以就不推荐了哈。

3，关于右侧侧边栏的 3D 标签云。

有时候逛别人的站点，看到旁边的标签要么是 3D 的，要么是地图的，很是酷炫，一般效果如下图：

终于在逛小文博客（原文）的时候看到，原来有一款很不错的汉化插件可以直接实现，那还说什么呢，直接来呗。

先放出下载链接：

文件下载	文件名称：3D 标签云	文件大小：200K
	下载声明：本站文件大多来自于网络，仅供学习和研究使用，不得用于商业用途，如果有版权问题，请联系博主进行相关处理！
	下载地址：https://pan.baidu.com/s/176cqX5222SvC9uJwfeRb6g

提取码如下所示。

注意：本段内容须成功“回复本文”后“刷新本页”方可查看！

使用起来也非常简单，安装并启用，然后在外观—》小工具处就可以看到这款工具了。

可以自定义其中的宽高以及一些其他简单配置，基本上都是比较简单的。

4，配置博客有评论微信通知。

这个功能就简直不要太赞了，也是下午在逛闲鱼博客（原文）的时候看到的功能，当然这个是别人写好的，咱们直接拿过来用的一个功能。

功能了解

首先，要完成这个 WordPress 有新评论微信提醒管理员的功能，需要用到这个叫 Server 酱的东西。

Server 酱是什么？

「Server 酱」，英文名「ServerChan」，是一款「程序员」和「服务器」之间的通信软件。

说人话？就是从服务器推报警和日志到手机的工具。

开通并使用上它，只需要一分钟：

登入：用 GitHub 账号登入网站，就能获得一个 SCKEY （在「发送消息」页面）

绑定：点击「微信推送」，扫码关注同时即可完成绑定

发消息：往 http://sc.ftqq.com/SCKEY.send 发 GET 请求，就可以在微信里收到消息啦

当然，官方还有一大堆解释，闲鱼就懒得发了，了解那么多也没什么卵用，简单知道，能用就行了，呵呵。

功能部署

其实上面已经把方法简单说了一下，事实上部署起来也就是那么简单……这里还是完整梳理一遍。

1，注册 GitHub 账号（有了就跳过这步）。

2，用 GitHub 账号登入网站，就能获得一个 SCKEY （在「发送消息」页面）

3，绑定「Server 酱」：点击「微信推送」，扫码关注同时即可完成绑定。

4，将获取的 SCKEY ，替换代码中的“你的 SCKEY ”，添加到function.php，保存即可。（代码来自网络，作者不清，知道的可以告知）

//评论微信推送  
function sc_send($comment_id)  
{  
$text = '博客上有一条新的评论';  
$comment = get_comment($comment_id);  
$desp = $comment->comment_content;  
$key = '你的 SCKEY';  
$postdata = http_build_query(  
array(  
'text' => $text,  
'desp' => $desp  
)  
);  
   
$opts = array('http' =>  
array(  
'method' => 'POST',  
'header' => 'Content-type: application/x-www-form-urlencoded',  
'content' => $postdata  
)  
);  
$context = stream_context_create($opts);  
return $result = file_get_contents('http://sc.ftqq.com/'.$key.'.send', false, $context);  
}  
add_action('comment_post', 'sc_send', 19, 2);

这里就配置成功啦，现在就可以去进行一下测试咯。

试验。

我在留言板上做一下留言，然后去微信看看效果。

ok，大功告成，感谢 server 酱，感谢闲鱼哥！

5，如何将 404 页面对接到腾讯公益。

之前在不少地方看过 404 的腾讯公益界面，对于我们这样一个小人物，如果将自己的博客 404 也变成这样一个公益界面，或许能出一份小力，也是莫大的功德。

其实设置的方法倒是非常简单的。

首先去到自己博客主题的根目录中。找到 404.php，先备份一下，然后将下边的内容进行替换。

cp 404.php 404.phpbak

vim 404.php    #添加如下代码

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="二丫讲梵 导航的 404 错误页面，当您看到这个页面，表示您的访问出错，这个错误是您打开的页面不存在，请确认您输入的地址是正确的!虽然你访问的页面找不回来了，但>是我们可以一起寻找失踪宝贝!" />
<meta name="keywords" content="404,404 错误页面,二丫讲梵 导航,一起寻找失踪宝贝,404 公益计划" />
<title>404 - 对不起，您查找的页面不存在 _ 一起寻找失踪宝贝 _boke112 导航</title>
</head>
<body>
<script type="text/javascript" src="//qzonestyle.gtimg.cn/qzone/hybrid/app/404/search_children.js" charset="utf-8" homePageUrl="/" homePageName="点此返回 二丫讲梵首页"></script>
</body>
</html>

其中的一些文字，你可以根据自己的需求进行一些小调整。

效果如下图：

未完待续。。。