支持自动提示的多引擎的搜索框

支持自动提示的多引擎的搜索框

技术应用 算法语言 2年前 (2015-12-30) 浏览: 189 评论: 0

使用网上开源的导航站源码制作了我的导航网页“百元导航”后,总觉得它丢掉了导航网站的一个很重要的东西—搜索框。于是极客人为自己的导航站加入了搜索框的功能,支持百度搜索、好搜、极客搜、CSDN搜索、蒲公英PT搜索等(可以加代码轻松扩展),除了网站界面使用了网上的代码,逻辑处理部分的js代码全由本人实现。 html代码: 下面是搜索框的界面的html部分,CSS没有贴在下面,如果需要请留言: javascript代码 要想搜索框支持多搜索引擎切换,首先需要掌握搜索引擎搜索关键词的URL参数,查看有几个GET参数(搜索引擎一般都是用GET传值的),比如下面是搜索引擎搜索“王柏元的博客”的结果页的URL: https://www.baidu.com/s?ie=UTF-8&wd=%E7%8E%8B%E6%9F%8F%E5%85%83 ?ie后面是编码格式,wd后面是搜索的关键词的URLEncode编码。 所以只要做一个表单,在表单内部加入name="ie"的DOM元素,这个元素没有必要在界面上显示,可以在CSS样式中加入“display:none”,下面的addparams函数实现的就是这一功能;再加入name="wd"的文本框,就是输入关键词的那个搜索框。最后将表单的action设置为百度搜索关键词网址:https://www.baidu.com/s 下面的setEngine函数就是切换搜索引擎的函数。传入searchIndex,就是html中select下option的value; 为了在用户切换搜索引擎后,再次打开导航页默认显示切换后的搜索引擎,可采用cookie记录searchIndex。 下面的代码用以在切换搜索引擎时,如果搜索框不为空则自动搜索搜索框内关键词,不用点击“搜索按钮”。 搜索框加入百度搜索自动提示 其中搜索自动提示的功能采用了百度开放的百度搜索框提示:引入一个百度的opensug.js文件,然后在要绑定搜索提示的文本框input元素中加入baiduSug="1"。这样在绑定的搜索框中输入文字即可获得和百度一样的搜索提示。 比如: 网上说百度搜索提示还有很多高级用法,比如自定义搜索提示的背景颜色、字体等等。不过极客人试过发现并不支持,你可以自行尝试,成功了欢迎来王柏元的博客交流!

一个炫酷、快速的PC网址导航站-百元导航

一个炫酷、快速的PC网址导航站-百元导航

前端与界面 2年前 (2015-12-29) 浏览: 127 评论: 0

前几天在一个网站上发现了一个炫酷的导航网页,界面美观大气,采用windows8磁贴风格、网站图标采用扁平化设计。后来发现这个导航网页是开放源码的,于是就下载了一份,并做了细微的修改与优化放在我的主机上,取名“百元导航”。之后我就自豪将“百元导航”设置为我所有浏览器的主页。因为我可以自信地告诉你,这个导航网页二次加载速度绝对快于任何导航网站(不服可亲测),包括主流的百度搜索、360导航。话不多说,百元导航的网址:http://wangbaiyuan.cn/daohang,欢迎大家将其设置为你的浏览器主页和提出宝贵意见。 0.3s的极速加载体验 百元导航的首次加载速度在我的15M宽带下、360极速浏览器谷歌内核下测试速度为851ms,二次加载速度260ms,并且支持第二次没有联网都可以访问。之所以能在不到0.3s的速度里完成加载,是因为网页内的所有资源包括CSS、js以及网页自身的html都缓存在本地。二次访问相当于你在本地硬盘上打开一个网页文件。 怎样实现浏览器资源缓存 一般来说,浏览器会将其访问过的一些资源文件进行保存,比如CSS,JS,这些存储在本地磁盘的网页文件称为缓存,在二次访问时,浏览器一般会优先访问本地缓存里面的内容,如果网页中还有些资源文件在缓存里没有找到或者缓存已经过时,才会通过网络连接向服务器上请求下载。这就是我们在上网时发现一个网站首次访问速度会特别慢、第二次就快很多的缘故。 浏览器缓存css、js是默认行为,缓存时间也是不确定的,为了让浏览器缓存所有的文件,甚至包括网页文件自身,并且让浏览器缓存的CSS、JS缓存的时间足够长,服务器可以做一个缓存文件类型设置和缓存超时设置。 在网站根目录或者当前资源文件目录中的htaccess中加入: 表示将扩展名为flv、gif、jpg、jpeg、png、ico、swf、js、css、pdf、eot 的文件缓存过期时间为2592000秒,30天。如下同理,将js、css过期时间设置为10天: 将txt、xml、html过期时间设置为10天   或者在PHP中使用@header函数发出响应头消息告诉浏览器资源过期时间: 上面实现了将放置此代码的PHP文件返回的文件类型是text/css)缓存过期时间为每天北京时间0点,GMT时间(格林尼治时间)16:00。 有自动提示、支持多引擎的搜索框 搜索框的代码是我在原有的导航网站源代码基础上加入的,支持百度、极客搜、谷歌、360、搜狗搜索,并使用了百度开放的百度搜索框提示代码“opensug.js”实现了自动提示功能。具体的实现方法可以参考我的下一篇博文:支持自动提示的多引擎的搜索框。  

让博客插入的视频宽度自适应

让博客插入的视频宽度自适应

前端与界面 2年前 (2015-10-14) 浏览: 124 评论: 0

好久没写技术类博文,这次暂且水一水上次在博客里发了一段个人制作的视频,使用的优酷提供的分享代码:就是一个embed视频标签,无奈优酷提供的代码视频长宽都是死的,600*400的样子,在电脑上还行,在手机上宽度太大直接撑爆了手机屏幕,用户体验很不好,下面的代码就是实现在不同设备自动适应宽度的。实现原理很简单,就是用js(jquery)动态设定视频的长宽度。 请将下面的代码加进主题的functions.php文件中,并且将代码中所有的#main-wrap-left换成显示文章的div的class名或者ID。  

强化WordPress网站安全的 12 个方法

强化WordPress网站安全的 12 个方法

计算机技术 2年前 (2015-05-09) 浏览: 1003 评论: 0

这篇文章主要是利用.htaccess去对网站做设定、限制目录读取,强化WordPress网站整体安全,不过你也别忘了要设定强一点的密码。 接下来极客人要介绍的主要是透过.htaccess对网站做一个基础的强化,保护wp-admin目录、限制wp-includes目录读取、防垃圾留言、禁止目录索引、限制wp-config.php访问权限等等,算是很基础的网站安全防护,不论你网站是否遭受攻击,其实这些都是必要性的安全防护。当然,进行了下面的网站安全防护不代表你被不会被黑客入侵,而是多一层保障、降低一些被攻击几率。   一、限制wp-admin目录IP 如果你管理wordpress网站一般就只有那么几个IP,而且你对自己的网站安全十分看重,比如你运行一个关系重大的团队网站,同时常常受到黑客的光顾,而且团队运行的登陆者常常使用的几个固定IP,为了保证网站的安全,下面这个方法可以限制读取wp-admin目录的IP或者IP网段,不是指定的IP(或者IP网段)就无法访问后台,这个方法当然不仅仅针对wordpress网站。 用NotePad++新增一个.htaccess文件,在htaccess文件中添加下述代码,并将文件上传到“wp-admin”目录下。 其中的蓝色部分请换成你的IP,这段语法的判断流程简言之就是先封锁有所IP,然后开放允许的IP,所以将“allow from 12.34.56.78”的12.34.56.78改成你的IP。如果是一个网段,可以输入“ 12.34.56.”   二、限制存取wp-includes目录 “wp-includes”这个目录是系统的一些核心目录,还有”/wp-admin/wp-includes”和,”/wp-includes”在我们的网站页面上并没有哪个页面有URL会指向这些地方(通常这个目录里的文件只能被被管理者修改或者代码里调用的)。用以下这段语法可以限制存取的权限,请将下面的代码加入到根目录的.htaccess文件中。 此为官方建议设定。   如果没有加入以上语法,会显示错误讯息;如果加了以上语法,会显示WordPress的默认404页面:告诉你目录不存在,这样是一个比较安全的防护措施。 三、限制wp-login.php登入IP 如果你网站没有开放注册,那你可以执行这项的方法,限制允许访问wp-login.php只有网站的管理者,设定方法和前面的限制wp-admin存取IP方法类似,请将“12.34.56.78”改成你允许的IP或是网段。   四、限制上传大小 避免黑客透过Dos攻击,利用传输大文件来冲爆你的流量,所以可以透过限制单档大小来阻绝这样的一个状况发生,将以下语法加入到根目录的.htaccess文件中即可,极客人的预设是10MB。   五、保护wp-config.php配置文件 用过WordPress都知道”wp-config.php”这个文件攸关整个系统的运行,少了它或者配置错误连不上数据库,因为这个文件内保存了MySQL的账号与密码,为了保护这个文件,WordPress官方有个建议,就是先将此文件权限设定为”400”,也就是只允许拥有人权读取。不过设400可能会让一些插件例如wp super cache要写入设定值时发生错误,所以请大家斟酌裁定。 不过保护wp-config.php重头戏是设定.htaccess目录,修改根目录的.htaccess目录,加入以下语法,这语法意思是:禁止所有人浏览(主机内的程序是可以正常读取的)。 此为官方建议的设置方法:   六、防垃圾留言攻击 以下这段语法是保护你的留言防止被机器人垃圾留言攻击,主要屏蔽没有referrer的请求,但极客人使用过后发现成效有限,建议再加装Akismet和quiz保护会更好。请将下述代码加入到根目录的.htaccess文件,其中的”wangbaiyuan.cn”请换成你自己的网站网址。   七、禁止目录索引 如果你的虚拟主机没有开启禁止目录索引功能,请您务必加上此语法以保护没有index目录的目录,避免被恶意人士将网站内容全部下载。   八、变更数据表前缀 数据表前缀词其实在一开始安装的时候就务必做一个修正的动作,避免使用预设wp的名称,修改请务必小心,否则可能造成网站错误,做任何调整前务必先行备份。 九、合理设置目录权限 网站内该设定的权限务必根据需求调整好,例如wp-config.php就不建议设定为777。  十、账号安全 WordPress系统默认安装是采用admin账号,不过后来的版本允许使用者自行选择网站管理员账号,以避免恶意用户想要尝试admin登入网站。如果你本身已经使用admin,请赶快换账号吧!不然黑客轻易的就可以猜到你账号,接下来猜出密码应该很快了。另外建议使用Limit Login Attempts强化登入安全,当然您也要设一个不易猜出的密码。 十一、关闭后台主题编辑功能 WordPress后台的主题一旦权限开放就可以在后台直接编辑,如果没有开放则只可浏览。主机若有安装suPHP默认就是可以编辑。如果你觉得这项功能用不到,建议您可以关闭它,毕竟直接暴露在后台可以编辑是一件很危险的事情,除了可能因为黑客入侵乱改,也可能自己改错造成网站出错。请将以下语法加入倒wp-config.php适当位置,就可以关闭修改的权限了。   十二、限制 .htaccess 访问权限 当以上的东西调整完之后,别忘了强化你的.htaccess目录本身权限。将以下语法加入到.htaccess目录内已启用自我保护。语法是禁止所有人直接浏览该目录,但是系统使用读取是允许的。   最后各位还是要做好个人的账号密码保护,另外也别在不明的网络、计算机乱登入网站,这都可能造成帐密外泄,除此之外,再次提醒,使用以上方法只会加强WordPress安全,但无法保证百毒不侵,仍有机会遭受到黑客入侵,通常状况可能是您帐密外泄、网站插件、主题有漏洞、系统有不明的漏洞,还有目录权限设定不正确等等的状况,各位还是要多多注意。

wordpress使用tinection主题怎样节省流量

wordpress使用tinection主题怎样节省流量

算法语言 3年前 (2015-01-31) 浏览: 1444 评论: 7

做博客站以来,笔者换了不少主题,最后决定使用的是知言创作的tinection主题,这是一款个人认为非常优秀的wordpress主题,但是其缺点也很明显:速度太慢,因为tinection主题代码里加载了太多css,js文件,导致向服务器请求次数极多,好在知言更新主题的速度较快,希望能在以后的更新中精简一下代码和减少文件请求次数。 除了上述缺点,tinection还有一个问题:它耗费流量太大。之前笔者使用的欲思主题在仅本人调试访问的情况下一个月才花费1个G流量,而现在的tinection主题一天就要花费近300M流量,而且扪心自问网站的访问频次并没有之前使用欲思主题的次数多。而对于个人用户来说,大家一般使用的是虚拟主机,空间商提供的月流量常常有限,而且即使使用CDN加速,按照tinection主题的这样的“耗油量”也不够花,为此,笔者琢磨了一下主题的代码,向大家介绍一个实用的wordpress使用tinection主题怎样节省流量的方法。 减少随机缩略图的张数 tinection的文章列表和相关列表都为无图文章随机分配缩略图,但是很“鸡肋”的是随机分配的所有图片竟然有40张之多,其实由于随机分配图片,减少图片张数并不能节省流量,但是在大多数使用了“静态文件缓存”的博客站来说,太多的随机图片将使访问者很难碰到之前缓存的同一文件。所以减少缩略图以提高缓存文件命中概率,是省流量的可行方法。 具体方法: 在主题文件夹themes\tinection\下找到functions.php,搜索“$random = mt_rand”,这是个产生随机数的函数,你可以根据需要设置为你想要的图片张数。 例如笔者只想使用15张: 这样主题只会调用tinection主题随机图片文件夹“tinection\images\random\”下的“1~15.jpg”图片 推荐:降低缩略图质量减少流量 笔者通过“审查元素”发现,tinection主题缩略图大小偏大,而且极其可笑的是,竟然有的缩略图片比原图片还大不少。其中有一个原图片54K,缩略之后竟然达到102K!对于大量使用的tinection主题将耗费太多不必要的流量。笔者经过修改代码后把这个图片大小降到了14K,而且图片质量影响不大。 具体方法: 在主题文件夹themes\tinection\下找到functions.php,搜索“function tin_thumb_source”,将该函数内容改成: 其中笔者把移动设备的缩略图质量设置成了20,其它设备设置成了80,大家可以根据自己的需要修改。还有需要指出的是,经本人实践,本主题的缩略图功能对png格式图片缩略效果极差,甚至增加原图片大小,建议大家写文章时插入jpg格式图片。

21 个非常有用的 .htaccess 提示和技巧

21 个非常有用的 .htaccess 提示和技巧

百元百科 3年前 (2015-01-15) 浏览: 420 评论: 3

  Apache Web 服务器可以通过 .htaccess 文件来操作各种信息,这是一个目录级配置文件的默认名称,允许去中央化的 Web 服务器配置管理。可用来重写服务器的全局配置。该文件的目的就是为了允许单独目录的访问控制配置,例如密码和内容访问。在做网站的时候常常用到很多.htaccess 规则,我给大家总结了21 个非常有用的 .htaccess 提示和技巧 下面是 21 个非常有用的 .htaccess 配置的提示和技巧: 1. 定制目录的 Index 文件     你可以使用上面的配置来更改目录的默认页面,例如你将这个脚本放在 foo 目录,则用户请求 /foo/ 时候就会访问 /foo/index.html。 2. 自定义错误页   当用户访问页面报错时,例如页面找不到你希望显示自定义的错误页面,你可以通过这种方法来实现。或者是动态的页面:   3. 控制访问文件和目录的级别 .htaccess 经常用来限制和拒绝访问某个文件和目录,例如我们有一个 includes 文件夹,这里存放一些脚本,我们不希望用户直接访问这个文件夹,那么通过下面的脚本可以实现:   上述脚本是拒绝所有的访问,你也可以根据IP段来拒绝:   一般这些方法是通过防火墙来处理,但在一个生产环境中的服务器来说,这样的调整非常方便。 有时候你只是想禁止某个ip访问:   4. 修改环境变量 环境变量包含了服务器端 CGI 的一些扩展信息,可使用 SetEnv 和 UnSetEnv 进行设置以及取消设置.   5. 301 重定向 如果你希望某个页面跳转到新的页面:   下面可以实现对整个路径的重定向   6. 通过 .htaccess 实现缓存策略 通过设置在浏览器上缓存静态文件可以提升网站的性能:   7. 使用 GZIP 对输出进行压缩 在 .htaccess 中添加下面的代码可以将所有的 css、js 和 html 使用 GZIP 算法压缩:   使用上面代码的前提是启用 mod_gzip 模块,你可以使用下面脚本来判断 Web 服务器是否提供 mod_deflate 支持:   如果 Web 服务器不支持 mod_deflate ,那么可使用下面方法:   更多关于压缩的内容请阅读: Compressing PHP, CSS, JavaScript(JS). 8. 强制要求使用 HTTPS 访问 通过以下脚本可以强制整个网站必须使用 https 方式访问:   9. URL 重写 例如要将 product.php?id=12 重写为 product-12.html   将 product.php?id=12 重写为 product/ipod-nano/12.html   重定向没有 www 到有 www 的 URL 地址:   重写 yoursite.com/user.php?username=xyz 到 yoursite.com/xyz   重定向某个域名到一个 public_html 里新的子文件夹:   10. 阻止列出目录文件 使用下面代码可以防止列表目录里的所有文件:   或者   更多详情 Denying/Allowing directory listing. 11. 添加新的 MIME-Types MIME-types 依赖于文件的扩展名,未能被识别的文件扩展名会当成文本数据传输   12. 防盗链 你不希望别人网站引用你站内的图片、css 等静态文件,也就是传说中的防盗链,可以使用如下脚本:   13. 指定上传文件的大小限制,适用于 PHP   上述脚本中,通过四个参数来设置上传文件的限制,第一个参数是文件的大小,第二个是 POST 数据的大小,第三个是传输的时间(单位秒),最后一个是解析上传数据最多花费的时间(单位秒) 14. 禁止脚本执行   15. 修改字符集和语言头   16. 设置服务器时区(GMT)   17. 强制 “File Save As” 提示   18. 保护单个文件 正常情况下 .htaccess 可用于限制整个目录的访问,但也可以只限制某个文件:   19. 设置 Cookie 通过环境变量来设置 Cookie   基于请求设置 Cookie,该代码发送 Set-Cookie 头用于设置 Cookie 值为第二个括号里的匹配项   20. 设置自定义的响应 Headers

新建wordpress网站速度慢怎么办

新建wordpress网站速度慢怎么办

算法语言 3年前 (2015-01-11) 浏览: 448 评论: 4

新建立的wordpress站点,不管是前台还是后台,一般会有打开速度的问题。笔者也遇到这个问题,接下来向大家介绍:新建wordpress网站速度慢怎么办 出现的原因有两个:1.google在中国大陆被网络长城屏蔽,导致网站引用Google 的资源无法加载;2.wordpress的Gravatar头像无法加载(也是墙掉的结果); 怎样解决google字体无法加载问题 最好的方法是禁用google字体服务。 Google在中国大陆访问时常抽风,因此也影响到了google api和一些公共服务,而其中现在很流行的google fonts也饱受困扰,很多google的公共库文件访问缓慢或者根本就是无法访问, 比如: theme.googleusercontent.com 、fonts.google apis.com 、ajax.google apis.com 很多网站前端以前都是直接用google的地址,这会或多或少的影响网站打开速度(不过笔者没遇到这个问题,可能是使用国人自己做的主题的原因)。 解决方法 1、安装插件:在插件中搜索 Disable Google Fonts,选择安装,然后启用,这样就可以禁止Google字体的加载,这样就可以提高访问速度了。 最近360网站卫士提供的公共库资源( http://libs.useso.com/ ),效果果然提高不少。 这个插件是调用360的CDN常用前端公共库替换所有谷歌google.com域名链接。 插件下载地址: http://baiye.us/wp-content/uploads/2014/06/googlefontsto360.zip 2、删除代码:很多人不喜欢用插件那么这个可以修改代码打开/wp-includes/script-loader.php搜索fonts.googleapis.com找到代码位置,直接把//fonts.googleapis.com/…这个链接整个删掉即可。(修改前请备份好数据,用//注释掉也是可以的哦) 3、推荐使用这种方法,依次打开 /wp-includes/script-loader.php,约581行的位置,替换谷歌的字体库为360网站卫士的国内CDN节点,把/wp-includes/script-loader.php文件中的fonts.googleapis.com换成fonts.useso.com即可。 怎样解决wordpress的Gravatar头像无法加载的问题 首先讲讲什么是gravatar头像 Gravatar全称Globally Recognized Avatar(全球识别头像),来自国外网站(http://www.gravatar.com)提供的在线头像服务,主要用在博客和论坛留言中,依靠邮件地址识别判断,为每个用户展示个性化的通用头像服务,完全免费,最初用在WordPress上,现在已经遍地开花,很多博客都支持Gravatar头像显示。——因为被墙掉的缘故,所有的博客一般都会出现头像无法加载的问题 介绍一下头像插件-WP User Avatar 安装 WP User Avatar 以后,就可以 在后台 - 设置 - 讨论,设置网站的默认头像,还会在后台 - 用户 - 我的个人资料,添加了一个自定义头像功能,允许用户设置自己的头像。这样一来,如果用户在“个人资料”中设置了自己的头像,就优先显示,如果没有设置,就显示用户的 Gravatar 头像,或者网站的默认头像。详细参考地址:http://www.wpdaxue.com/wp-user-avatar.html 如果想保留Gravatar服务,可以这样 参考地址:http://www.v7v3.com/wpjiaocheng/201401511.html      

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

切换登录

注册