wowordpress验证码插件-Captcha 小试

作者:matrix 发布时间:2013 年 10 月 22 日 分类:Wordpress 兼容并蓄

找到Captcha插件式由于需要加强博客后台的登录安全。最近这些天,一直都被搞Aamin用户名,TMD  真是找不到事做了。我这小网站也~ ➡

经后面测试,此插件不靠谱。

试试这个

添加wordpress后台验证功能

 

插件官方地址:

http://wordpress.org/plugins/captcha/

图片4792-wowordpress验证码插件-Captcha 小试

插件设置有后台登录、评论框、注册页面、修改密码页面的验证码开关选项。

非图片输出的数学验证   效果应该不错的~

图片4793-wowordpress验证码插件-Captcha 小试

貌似有些不靠谱~  评论上的未测试

暴力破解admin密码样本

WordPress主题中隐藏 wp_head()函数的版本信息

作者:matrix 发布时间:2013 年 9 月 30 日 分类:Wordpress

wp_head()函数的版本信息

个别主题代码会显示如下这样的信息:

<meta name="generator" content="WordPress 3.X.X" />

这就泄露了wp版本信息。为了加强安全性所以说就要做隐藏。

这是由于header.php 中<?php wp_head(); ?>函数的输出导致的。

你也可以选择删除这行代码,只是有些插件功能的需要,最好保留。

只需要在functions.php中添加一行代码就可以让<?php wp_head(); ?>禁止输出wp版本信息,而其他东西原封不动。

functions.php中添加:

remove_action('wp_head','wp_generator');  

参考:http://www.nuanche.com/hidden-WordPress-generator

给wordpress添加title属性的鼠标气泡悬浮窗

作者:matrix 发布时间:2013 年 9 月 26 日 分类:Wordpress 兼容并蓄

鼠标停留在有title属性上的时候或有提示,但是默认的样式中有觉得不可观的地方。利用js即可实现修改。

NGRO的效果演示:

NGRO的效果演示

css 阅读剩余部分 »

wordpress添加二级导航功能CSS代码

作者:matrix 发布时间:2013 年 9 月 21 日 分类:Wordpress 零零星星

NGRO主题没有导航菜单,也就只有自己动手了。

最终样式,感觉还不错:

最终样式

步骤: 阅读剩余部分 »

添加鼠标滑过图片闪烁的js特效-jquery-opacity-rollover

作者:matrix 发布时间:2013 年 9 月 20 日 分类:Wordpress 兼容并蓄

图片4842-添加鼠标滑过图片闪烁的js特效-jquery-opacity-rollover

onamae.com的25号免费域名没抢到,倒是看到onamae上的一个图片闪光特效好奇,这就扒了。

看头部的meta写的jquery-opacity-rollover.js文件,不知道这是个啥子插件上的东东。

作者:http://h2ham.seesaa.net

实际效果,文字说明:

假设图片被指定加载此js特效阅读剩余部分 »

wordpress中ZeroClipboard实现js+flash跨浏览器剪切板复制粘贴

作者:matrix 发布时间:2013 年 9 月 16 日 分类:Wordpress 零零星星

用ZeroClipboard跨浏览器实现复制到剪切板,兼容ie、chrome、firefox等等支持flash的浏览器。

图片4869-wordpress中ZeroClipboard实现js+flash跨浏览器剪切板复制粘贴

ZeroClipboard以前在google代码的项目404,发现个神似ZeroClipboard的zClip 项目:http://www.steamdev.com/zclip/

其余项目:可以参考http://zeroclipboard.org/

网上关于ZeroClipboard的有很多,有些不能用 看着也杂~

下面记录自用ZeroClipboard的代码。点击查看最新版本的简单设置

ZeroClipboard version: "1.0.7"

js和swf下载:
http://www.400gb.com/file/28619600
http://pan.baidu.com/share/link?shareid=3611655227&uk=3238236832

步骤:

1.修改压缩包中zpCOPY.js的第九行:

    moviePath: 'zpCOPY.swf', // URL to movie

确保zpCOPY.swf路径的正确,建议使用绝对地址(形如https://www.hhtjim.com/zpCOPY.swf)。
2.在需要调用复制的页面加入js代码:

<script type="text/javascript" src="https://www.hhtjim.com/zpCOPY.js"></script>
<script type="text/javascript">
var clip = null;
function $(id) { return document.getElementById(id); }
function init() {
clip = new ZeroClipboard.Client();
clip.setHandCursor(true);
clip.setText($('text').value);
clip.glue('anniu');
clip.addEventListener( "complete", function(){
    alert("复制成功!");
});
clip.addEventListener( "load", function(client) {
    client.movie.title="复制本文固定链接";
});
}
</script>

说明:

第1行的js地址可自定义

第8、9行的text、anniu为第3步代码中对应的id值

第10、11行是复制后的弹窗提示。

3.同上,放在那页面,适当位置添加:

<body onLoad="init()"></body>
<textarea style="display:none" id="text" ><?php the_permalink() ?></textarea>
     <a id="anniu" href='javascript:void(0);' title="复制本文链接">+复制链接</a>

说明:

第1行的onLoad="init()"为打开页面即加载init函数。缺少此行会导致加载flash失败。

第2行为需要复制的文本内容。这里的复制的内容是<textarea里的<?php the_permalink() ?>返回的WordPress文章网址。

经测试无法复制其他标签的文字,只有<textarea标签里的可用。由于文本框有点占位置,所以做了隐藏style="display:none"。

第3行为点击复制的那个按钮。

4.之后就成功了。

经本地测试chrome 版本 28.0.1500.95 m、ie10、firefox 23.0.1 复制成功!

本地测试于NGRO主题  💡

图片4870-wordpress中ZeroClipboard实现js+flash跨浏览器剪切板复制粘贴

弹窗提示

图片4871-wordpress中ZeroClipboard实现js+flash跨浏览器剪切板复制粘贴

参考:http://www.myext.cn/webkf/27383.html

http://keleyi.com/a/bjac/3wjq3xm2.htm

zclip DEMO:http://www.steamdev.com/zclip/

 


最新的v1.1.1版本  更简单

需要调用JQ库和zclip.min.js:

<script type="text/javascript" src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="http://file.icycat.com/view/js/jquery.zclip.min.js"></script>

然后是复制的按钮和文本代码:

<a type="button" id="anniu" class="btn" > 复制 </a>
<a style="display:none" id="wenben"> 复制:https://www.hhtjim.com </a>
<script type="text/javascript">
$(document).ready(function(){$("#anniu").zclip({path:"http://file.icycat.com/view/js/ZeroClipboard.swf",copy:$("#wenben").text(),afterCopy:function(){$(this).css("color","#777");$(this).text("复制成功")}})});
</script>

说明:第1行 复制按钮为 id="anniu"

第2行 复制的文本是 id="wenben"的内容

3-4行 加载配置的swf文件路径,复制按钮、复制的文本ID以及复制成功后变成“复制成功”的样式。

代码参考来自:http://file.icycat.com/

wordpress中提取文章内第一张图片作为缩略图

作者:matrix 发布时间:2013 年 9 月 4 日 分类:Wordpress 兼容并蓄

网上有很多类似的代码,大多都来自知更鸟的HotNews。略有不同,这里还是记录一下。

一.模板函数中添加:

<?php //取文章内first_image  
function catch_first_image() {  
global $post,$posts;  
$first_img = '';  
ob_start();  
ob_end_clean();  
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i',$post->post_content,$matches);  
$first_img = $matches [1] [0];  
if(emptyempty($first_img)){  
$random = mt_rand(1,10);  
echo get_bloginfo ( 'stylesheet_directory');  
echo '/images/random/'.$random.'.jpg';//若没有则输出/images/random/内图片  
}  
return $first_img;  
}  

?>  

二.主题目录内新建includes文件夹,thumbnail.php丢入: 阅读剩余部分 »

完善lazyload懒加载图片渐显特效

作者:matrix 发布时间:2013 年 9 月 3 日 分类:Wordpress 兼容并蓄

图片时载入的渐显特效JQuery 中有提到lazyload,可以加速WordPress站点的页面载入速度。只是以前的有些偏移这里稍微更新一下。

JQuery

官网:http://www.appelsiini.net/projects/jeditable

github:https://github.com/tuupola/jquery_jeditable

多图demo:http://www.appelsiini.net/projects/lazyload/enabled_gazillion.html

预加载图片和lazyload v1.8.5下载:

http://www.400gb.com/file/29074139

http://pan.baidu.com/share/link?shareid=2497435386&uk=3238236832

步骤:

1.header中加载JQ库 这里使用1.7.2版本的没问题。若已经加载JQ库不必重复加载。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">

2.紧接着加载压缩包里的jquery.lazyload.min.js。依然还是主题的header中。(示例,放入主题目录内的/js/文件夹)

<script src="<?php bloginfo('stylesheet_directory');?>/js/jquery.lazyload.min.js" charset="utf-8"></script>

3.再添加js代码,还是紧接着放置。

<script type="text/javascript" charset="utf-8">  
jQuery(document).ready(  
function($){  
$("img").lazyload({  

     effect      : "fadeIn" //加载图片使用的效果(淡入)  

});  
});  
  </script> 

说明:第4行的img为需要预加载的地方。这里是所有img标签。

4.还再主题的header.php中添加

<?PHP ob_start();?>  

说明:使用ob_start()函数自动在缓冲区处理需要最终加载的图片标签格式

5.在主题footer.php适当位置处添加php代码.可以是</body>之前,也可以是最后一行。

 <?php  

//图片延缓加载相关处理,替换src为data-original,并添加占位符  
$echo = ob_get_contents(); //获取缓冲区内容  
ob_clean(); //清楚缓冲区内容,不输出到页面  
$placeholder = "grey.gif"; //占位符图片  
$preg = "/<img (.*)src(.*) \/>/i"; //匹配图片正则  
$replaced = '<img \\1src="'.$placeholder.'" data-original\\2 />';  
print preg_replace($preg, $replaced, $echo); //重新写入的缓冲区  
ob_end_flush(); //将缓冲区输入到页面,并关闭缓存区  
?>  

说明:注意第6行中的grey.gif为:预加载的图片名称grey.gif,预加载的图片路径:WordPress程序根目录。当然这里也可以使用绝对路径。

压缩包内还有白色的white.gif和透明的transparent.gif都是预加载图片,可自定义跟换。

参考:http://dl.epinv.com/post/304.html

http://www.neoease.com/lazy-load-jquery-plugin-delay-load-image/

http://www.oschina.net/code/snippet_111193_3306

http://www.173it.cn/view-5577-1.html