Entries by Bruce

wordpress一些有用的插件及用法介绍

在用wordpress做项目的时候,经常会用到一些插件,wordpress流行的一个重要原因也就是插件丰富强大。 下面我将我做项目时用到的一些好用的插件及用法分享给大家,下次做项目时可直接拿来用,而不用去网上搜索了。 一.做滚动banner的插件  比如,Smooth Slider,Promotion Slider,Easy Nivo Slider,WP Coda Slider 等等有很多这样的插件,不过这些插件在wordpress中都是共用的一个,如果页面的头部滚动banner是一样的,ok当然没有问题,但是如果客户要求每个页面的滚动banner不一样那要怎么办呢?  请看这两个插件:vSlider Multi Image Slider for WordPress,M-vSlider  vSlider Multi Image Slider for WordPress(vSider)插件的用法: 1.首先下载此插件然后安装。 2.登陆wordpress后台管理页面,找到安装插件后产生的新菜单,在里面根据选项建立一个或多个slider。 3.在静态页面中或是文章页面中插入[vslider name=”abc”](其中name的值abc就是建立banner时的名称)或者也可以在php模板页面中加入代码“” (同样的”abc”还是建立banner时的名称。) 4.在前台页面中测试结果。 vSlider Multi Image Slider for WordPress 的用法就是这样。 M-vSlider 的用法 1.首先下载此插件然后安装。 2.登陆wordpress后台管理页面,找到安装插件后产生的新菜单,在里面根据选项建立一个或多个slider,还可以在这里面设置滚动banner的显示效果,比如,淡进淡出,往左滑动,往右滑动,往上滑动,往下滑动,还可以设置每个图片停留的时间 等等。 3.在静态页面中或是文章页面中插入[m-vslider id=”x”](其中id的值”x”就是在后台管理banner列表中的id的名称)或者也可以在php模板页面中加入代码“” (同样的”x”还是后台管理banner列表中的id的名称。) 4.在前台页面中测试结果。 M-vSlider 的用法和上面的 vSlider Multi Image Slider for WordPress 差不多,我为什么还要介绍两种呢,并非多此一举。 对比,通过实际的操作你可以发现在vSlider插件中建立一个滚动banner时的图片是有限制的,这个限制数是20张,也就是一个slider最多允许上传20张图片,或许这个数果已经够了,如果要超过这个数量的图片怎么办呢,那就用M-vSlider这个插件,它对图片的数量是没有限制的,这就他们之间唯一的区别。 二.多语言插件 […]

js来控制css

在jquery中同样也可以像css文件中那样定义html的样式。 先说如何获取html标签的某个css属性值吧 获取方法:$(select).css(name) select是要获取的对象,name是css的属性名称。 例: $(“div”).css(“color”);    //获取div的color值 如何设置html标签的某个css属性值呢? 有两个方法 一.  $(select).css(name,value) :select是要获取的对象,name是css的属性名称,value是css的属性值。 例: $(“div”).css(“color”,”#FFF”); 二.   $(select).css({name1:value1,name2:value2}) :select是要获取的对象,name1,name2是css的属性名称,value1,value2是css的属性值,设置多个属性用逗号分隔。 例: $(“div”).css({color:”#ff0211″,background-image:”#ff0011″}); 注:在使用jquery中获取样式的背景时,要注意,不要用css(‘background’)这样方式,而要用css(‘background-color’)获取背景颜色或用css(‘background-image’)获取背景图片,而设置背景时就没有问题,我在做项目的过程中就遇到这种问题,花了很长时间才找到原因,所以在这里提醒各位。

jquery中html 与 text方法的区别

接鉵jquery的时间并不长,以前都是用直接用js写的,现在发现在jquery这个框架用起来很方便,不但代码量少了,使用也比较简单,对于浏览器的兼容问题也不用担心,在使用的过程中也会遇到一些疑问,在html标签中附加子标签时所用的方法html()与text()的区别。 通常在用jquery写ajax时,都会用到html()这个方法,而不用text()这个方法,他们之间有什么区别呢? 首先,html属性中有两个方法,一个有参,一个无参。下面我们都用实例来看看,这样比较容易帮助理解。 1. 无参html():取得第一个匹配元素的html内容。这个函数不能用于XML文档。但可以用于XHTML文档,返回的是一个String 例子: html页面代码:<div><span>Hello</span></div> jquery代码:$(“div”).html(); 结果:<span>Hello</span> 2.有参html(val):设置每一个匹配元素的html内容。这个函数不能用于XML文档。但可以用于XHTML文档。返回一个jquery对象 html页面代码:<div></div> jquery代码:$(“div”).html(“<p>Nice to meet you</p>”); 结果:<div><p> Nice to meet you</p></div>(html标签会被浏览器识别) 其次,text属性中有两个方法,一个有参,一个无参 1. 无参text():取得所有匹配元素的内容。结果是由所有匹配元素包含的文本内容组合起来的文本。返回的是一个String。 例子: html页面代码:<p><span>Hello<span><div> fine</div></p> jquery代码:$(“p”).text(); 结果:Hello fine 2.有参text(val):设置所有匹配元素的文本内容,与 html() 类似, 但将编码 HTML (将 “<” 和 “>” 替换成相应的HTML实体).返回一个jquery对象。 html页面代码:<div>Paragraph.</div> jquery代码:$(“div”).text(“<b>Some</b> new text.”); 结果: <p><b>Some</b> new text.</p> (html标签不会被浏览器识别,而是当作字符串来输出) 通过上面的例子,我们知道了,html()方法与text()方法的区别就在于对html标签的识别上不同。

WordPress的缓存插件

缓存插件。缓存插件的用途一般来说有二,一是降低服务器的负载,不管是CPU占用率还是数据库查询次数,二是提高访客访问站点的速度。对于 WordPress这样的几乎没什么是静态的东西来说,使用一种或多种缓存插件可能是最简单的提升访问速度和降低负载的方法。 我们经常听到或用到的缓存插件有二,WP Super Cache和Hyper Cache,它们的功能都是将你的动态页面静态化,将经常调用的页面以静态的html文 件展示,而不是来一个访客“动态”生成一次页面。这种机制可以极大地降低服务器负载,特别是对于访问量很大的站点来说。这种缓存方式称之为 “全内容HTML缓存”。但是这种缓存方式有一个小问题,对于页面上“必须”动态生成或实时联络的内容而言(比如侧边栏的某些挂件),静态页面 意味着它们的功能失效。由此带来的问题是有些内容无法实时显示,广告无法显示等等。那有没有比较温柔的“无痛”缓存既能缓存一些内容降低负 载,又能够和这些插件和平共处没准还能让我们赚点小钱呢?Object Cache是个不错的选择,当然如果你喜欢插件形式的,BatCache也可以。 把它俩放到一起说的原因是这两个小东西都基于服务器的Memcache扩展,所以如果你想使用这种缓存机制,先咨询下你的服务商是否在服务器上启用 了它。有了Memcache这个前提,Object Cache那就是直接就用啊。 什么是Object Cache或对象缓存?它和一般生成静态HTML页面的缓存(比如WP Super Cache或Hyper Cache)有什么不同? 一般的缓存是将服务器生成的完整HTML响应进行存档,将之保存为静态的文件保存在硬盘上以供下次调用,一般来说这样的机制都会给静态文件 一个有效期,在特定时间或特定动作之后,当前缓存过期并重新生成。 Object Cache则是另一种形式的缓存。它只缓存那些服务器生成上面的响应过程中创建的“数据”或对象。举个例子来说,如果一个Blog的首页 有一个列表,比如最新的5个文章,友情链接,指向最新5个评论的链接等等; 服务器可以“单独”地以原始数据格式(raw data format)缓存它们 ,所以在未来的调用请求中,这些内容可以被一个接一个地取回。 简单来说,一般的缓存是将生成的“结果”保存起来供下次相同请求时调用,而对象缓存是将生成过程中的零件们进行缓存,下次有相同请求时 无须现找零件而是即时拼装,所以也降低了服务器负载(特别是数据库请求次数)。 对象缓存比全内容HTML缓存要更灵活,因为它允许当缓存内容发生改变时,只使部分缓存时效。比如当一条新评论在你的博客上发表时,完全没 必要更新最新文章列表。另外,它还可以更容易地从以往请求内容的缓存数据中拼凑出新的请求,(比如,博客“单文章”页可能也包含最新评论列 表)。 所以你基本可以认为Object Cache是一个有条件的话一定必须肯定绝对要启用的东西,尽管它在WordPress 2.5及以上版本中没有默认开启,需要我 们自己往里面添加点内容启用它。据我自己的测试,它和任何其他的缓存插件,不管是Hyper Cache还是WP Super Cache还是DB Cache或是 Autoptimize都能够和平相处,所以,既然无痛而且确实有效,让我们都启用它吧。 原本Object Cache是WordPress内建的一个东西,但是由于种种原因在WP 2.5及以后版本中就取消了,或者说不再内建了。但是相关的API调用还在并 且都能正常工作,所以我们要做的就是用一个小文件启用它。 这个小程序全称File-Based Caching for WordPress,作者是Neosmart的Mahmoud H. Al-Qudsi,文件请访问这个页面下载。WOPUS之前的一篇文章也 对Object Cache做过简单的介绍。 使用方法很简单,上传object-cache.php文件到你的Wordpress的wp-content目录下(不是Plugins目录啊~),然后同样还在wp-content目录下 […]

XHTML与HTML

WordPress从所有内部函数中输出XHTML,因此所有主题以及大多数插件使用的都是XHTML脚本。因此如果要使用WordPress平台,就应该多学习一些XHTML相关知识。 下面介绍下XHTML与HTML的区别 和正确用法 XHTML与HTML的区别 HTML仍然与XHTML有很大相关性,熟悉HTML的人了解到这一点都会很高兴。HTML与XHTML的主要差别在于,XHTML更加强调网页制 作人员编程时的一致性与所编代码的可读性。两者也存在若干句法与语法上的差别,此外,XHTML还废除了一些HTML标签。如果用户熟悉掌握HTML,会 发现从HTML转换到XHTML其实很容易,而且新的XHTML规则会让使用者成为更优秀的开发人员。 如何编写XHTML代码 下面用正确与错误的进行对比更容易区分记忆 所有标签、属性以及值都必须使用小写字母 正确用法: <a href=”http://ccjk.com/blog/cn/” > 错误用法: <A HREF=”http://ccjk.com/blog/cn” > 所有属性值都必须放在引号内 正确用法: <a href=”http://ccjk.com/blog/cn” > 错误用法: <a href=http://ccjk.com/blog/cn> 所有标签都必须进行适当嵌套 正确用法: <em>http://ccjk.com/blog/cn <strong>stronger and stronger</strong></em> 错误用法: <em>http://ccjk.com/blog/cn <strong>stronger and stronger</em></strong> 所有XHTML文件都必须带有DOCTYPE定义 DOCTYPE标签的规则: DOCTYPE标签必须是文档中的第一个标签 DOCTYPE标签不是XHTML文件的一部分,不必为该标签添加结束斜线 DOCTYPE应指向一个名为DTD、具有有效定义的文件,该文件可通知浏览器如何读取文档 有效的XHTML文件包括三种:Strict(严格类型), Transitional(过渡类型), Frameset(框架类型)。文件可以被验证为“strict”,但“strict”类型中不允许出现一些老式标签和属性,这时可以使用 “Transitional”类型。 注意:用WordPress验证”Strict”类型时可能会出错,因为从2.6.2版本起,一些内部生成的<form>元素仍然使 用”name”属性,如<input name=”my_button” /> ,而在Strict DTD中这是不被允许的。 XHTML的不足 大多数人没有意识到要能够熟练操作XHTML还需要使用新的MIME 类型 […]