Loper主题美化滑动解锁功能,Loper主题集成了一个很实用的滑动解锁功能,它的作用就是防止垃圾评论和机器人,拽立网,让你不用整天忙于文章评论审核和删除,我个人感觉强大是强大就是样式效果不怎么好看,可能是我看的太多了看腻了,所以我决定要修改滑动解锁美化效果,今天我把Loper主题美化滑动解锁功能方法分享给大家,请看以下操作!
美化前的效果图!
2.登陆你的后台管理,选择【外观】-【编辑】-【loper: 模板函数 (functions.php)】
直接搜索以下全部代码:
//滑动验证
function my_preprocess_comment($comment) {
if (!is_user_logged_in()) {
if(!session_id()) session_start();
if(isset($_POST['iQapTcha']) && empty($_POST['iQapTcha']) && isset($_SESSION['iQaptcha']) && $_SESSION['iQaptcha']) {
unset($_SESSION['iQaptcha']);
return($comment);
} else err("抱歉,你没有通过验证。");//提示语自行修改
} else
return($comment);
}
add_action('preprocess_comment', 'my_preprocess_comment');
把上面全部代码替换为:
//滑动验证
function my_preprocess_comment($comment) {
if (!is_user_logged_in()) {
if(!session_id()) session_start();
if(isset($_POST['iQapTcha']) && empty($_POST['iQapTcha']) && isset($_SESSION['iQaptcha']) && $_SESSION['iQaptcha']) {
unset($_SESSION['iQaptcha']);
return($comment);
} else err("抱歉,你没滑动解锁!");//提示语自行修改
} else
return($comment);}
add_action('preprocess_comment', 'my_preprocess_comment');
2.登陆你的后台管理,选择【外观】-【编辑】-【loper: 样式表 (style.css)】
直接添加以下全部代码:【放在最底部】
/********************************/
/*******QapTcha滑动解锁功能CSS****/
/** 拽立网修改版 www.zlinet.com **/
/*******************************/
/* 控制解锁位子 */
#QapTcha {padding:10px 10px 10px 0;margin-top:10px;}
/* 控制清除效果 */
#QapTcha .clr{ clear:both ;}
/* 控制解锁条图片 */
#QapTcha #bgSlider {width:202px;height:22px;background:transparent url('qaptcha/sprites.png') no-repeat 0 -22px;float:left;}
/* 控制解锁按钮图片 */
#QapTcha #Slider {width:26px;height:22px;background:transparent url('qaptcha/sprites.png') no-repeat 0 0 ;margin: 0 0 0 5px;cursor:e-resize;}
/* 控制提示字体大小位子 */
#QapTcha #TxtStatus {float:left;width:202px;margin:2px 0 0 10px;font-size:11px;}
/* 解锁前字体颜色 */
#QapTcha .dropError { color:#FF0000 ;}
/* 解锁后字体颜色 */
#QapTcha .dropSuccess { color:#67A611 ;}
3.登陆你的后台管理,选择【外观】-【编辑】-【loper: 顶部 (header.php)】
直接搜索以下【4】个代码:
<script src="<?php bloginfo('template_url');?>/qaptcha/jquery/jquery-ui.js"></script>
<script src="<?php bloginfo('template_url');?>/qaptcha/jquery/jquery.ui.touch.js"></script>
<script src="<?php bloginfo('template_url');?>/qaptcha/jquery/QapTcha.jquery.js"></script>
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo('template_url');?>/qaptcha/jquery/QapTcha.jquery.css" />
把上面【4】个代码全部替换为以下全部【3】个代码:
<script src="<?php bloginfo('template_url');?>/qaptcha/jquery-ui.js"></script>
<script src="<?php bloginfo('template_url');?>/qaptcha/jquery.ui.touch.js"></script>
<script src="<?php bloginfo('template_url');?>/qaptcha/QapTcha.jquery.js"></script>
然后把以下3个JS代码和1个图片上传到Loper主题【/qaptcha/】目录里!
上传文件前,必须清空里面的全部文件和文件夹【jquery】和【images】!
要上传的4个文件我会打包,请看最下面地址!
美化后的效果图!
美化后的效果解锁图!
提示:除去【qaptcha】目录CSS,添加到主题(style.css)优化加载速度方便修改!
提示:CSS代码提示可以改,颜色改,QapTcha.jquery.js里面句子提示也可以改!各有所爱!

版权声明:本站原创文章,于2015年09月11日,由 拽立网 发表,共 2715 字。
打赏



不错,现在修改好了,免插件,我不想折腾,直接用了插件。
@王桂明博客:
呵呵,用插件也很好!插件能支持手机,我还没去研究代码! 
管理员回复刚把站点转移到openshift上面,https协议也转成了http,然后后台各种优化,加了点插件发现文章评论的时候不能滑动滑块,折腾了几个小时才发现是跟Crayon Syntax Highlighter这个插件冲突了,郁闷啊
@空心:
我的高亮代码是免插件的,我个人不喜欢用插件,还有就是loper只带的滑动解锁功能不支持手机的,有时间写个替换滑动解锁文章!也是免插件!
管理员回复拽立可以吧你现在用的这个滑动解锁插件分享下嘛,或者写一篇教程,我用了插件,还有知更鸟的修改版,都显示不出来,简直郁闷,现在用的自带的还有不少bug
@繁夜: 这样啊,我没用华东解锁插件哦,我都是写到主题集成里面去了!有空写个文章分享一下!
管理员回复我现在把官方插件集成到了主题中,电脑一切正常,就是手机还是无法滑动,而插件上说支持手机,是有什么地方还需要修改吗?
@繁夜: 主题集成的解锁JS代码你清理干净了? 会不会JS代码冲突了!我记得我前把以前全部滑动解锁功能删除了,我是用了只跟鸟和一些混合一起使用的集成带主题里!
管理员回复搞定了,原作者创建的div是用的id标记,插件用的class来标记,没注意看导致部分功能失效了,调试了半天
@繁夜: 那就好,这个我以前刚弄也出现过,我很快就弄好了!你挺厉害的!
管理员回复朋友交换个友链吧,就用企鹅邮箱备注吧,163 Gravatar现在不让注册了,无法显示头像很尴尬
@繁夜: 不是吧,我上个月都帮朋友弄了头像,要翻墙才行的,不然你进不去他Gravatar网站!友情链接没问题,我等会就搞上去!我的友情你写:拽立网 http://www.zlinet.com
管理员回复友链已加,但你这儿的友链跳转正确,友链上显示的网址不对,估计是之前你的友链有一个和我网站重名的,你给看看修改下吧
@繁夜: – -这都给你发现了,厉害的观察力啊,我修复好了,是我大意了,赶时间弄了一下!有空再来研究!

管理员回复