分类： wordpress

通过修改style.css实现“被选中文字的色块颜色”更改，

在对应的style.css文件中加入如下字段：

::-moz-selection {
    background-color: #3b3b3b;
    color: #fff;
}
 
::selection {
    background-color: #3b3b3b;
    color: #fff;
}

background-color 后面的颜色为被选中文字的色块颜色。
color 后面的参数为被选中时显示的文字的颜色。
::selection 适用于 Chrome, Safari, IE9+等等浏览器；
::-moz-selection 适用于firefox。

当前主题Twenty Sixteen于585行添加

后台 — 外观 — 编辑 — style.css

在body和a:hover中分别加入样式：
 cursor: url(image/鼠标样式图片名称.png), auto; 

例如：

body {
    cursor: url(image/cursor.png), auto;
}

a {
    cursor: url(image/pointer.png), auto;
}

鼠标样式图片上传至服务器里相对应的主题下，image/cursor.png 即为image文件夹中名为cursor.png的文件，若找不到image文件夹(或img文件夹)创建一个即可。
#cursor：正常光标
#pointer：链接光标
#“body”于Twentysixteen中469行；“a:hover”于Twentysixteen中755行。

一个可以在编辑器中可视化选择代码语言和插入代码的 WordPress 插件，

可以显示行号、鼠标悬浮高亮和被标记行高亮。

作者：Sunriseydy （Github）

版本：v2.0.9

地址：https://github.com/sunriseydy/Pure-Highlightjs/releases

百度云： 1N3Hvf9s9DRpYHg5JZ8muXw   

提取码： av33

编辑器插件：erphp-editor-font   提取码：aj4s

在functions.php中添加代码：

add_filter("mce_buttons_3", "add_editor_buttons");
		
function custum_fontfamily($initArray){
		$initArray['font_formats'] = "微软雅黑=Microsoft YaHei,Microsoft JhengHei,黑体;宋体=SimSun;黑体=SimHei;楷体=kaiti,KaiTi_GB2312;隶书=LiSu;幼圆=幼圆;Impact=Impact;Arial=Arial;Verdana=Verdana;Tahoma=Tahoma";
		return $initArray;
}
add_filter('tiny_mce_before_init', 'custum_fontfamily');

于Twentysixteen第138行

把以下代码添加到当前主题的head.php或footer.php文件的</body>前。

<script type="text/javascript">
/* 鼠标特效 */
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": 999999999999999999999999999999999999999999999999999999999999999999999,
            "top": y - 20,
            "left": x,
            "position": "absolute",
            "font-weight": "bold",
            "color": "#ff6651"
        });
        $("body").append($i);
        $i.animate({
            "top": y - 180,
            "opacity": 0
        },
        1500,
        function() {
            $i.remove();
        });
    });
});
</script>

添加评论框输入特效

添加以下代码到主题尾部调用即可

<script src="activate-power-mode.js"></script>
<script>
POWERMODE.colorful = true; // 控制开启/开启礼花特效  
POWERMODE.shake = false; // 控制开启/关闭屏幕震动特效  
document.body.addEventListener('input', POWERMODE);
</script>

true 为开启

false 为关闭

附activate-power-mode.js文件下载 (提取码：5ui2)

注意事项：

1. 鼠标点击特效的代码添加到主题页脚文件或者js里面；
2. 评论框输入特效请自己填写你的activate-power-mode.js文件路径。

<script src="activate-power-mode.js"></script>

*文章部分内容转自老D博客