现在的位置: 首页WP技巧>正文
WordPress打造个性化评论框
2010年07月07日 WP技巧 评论数 44

之前就有看到好多童鞋的评论框很有个性,像什么“无评不博”、“你的评论是我最大的动力”、“一针见血”等等。当时就有自己也折腾一个的冲动,无奈太懒得动了。而昨天又在评论框位置添加了个google adsense的广告,因为在各个浏览器显示有所不同,折腾了半天,终于是在万戈兄的指导下将其搞定,顺便也来美化美化自己的评论框。

首先添加的是评论框提示语句“爱分享 爱分文”,在comments.php文件下找到:

<textarea name="comment" id="comment" cols="40%" rows="10%" tabindex="4"></textarea>

然后将其改成:

<textarea onblur="if  (this.value == '')
{this.value = '爱分享 爱分文';}
" onfocus="if (this.value == '爱分享 爱分文') {this.value = '';}" name="comment" id="comment" cols="40%" rows="10%" tabindex="4">爱分享 爱分文</textarea>

这样效果就已经呈现了,看到评论框时有显示,单击就会消失。

再者给评论框添加个背景图片,也来搞个“无评不博”。当然首先要自己搞个图片,大小自定,根据自己的评论框大小就行,例如我的是350*200,上传到主题目录下的img文件夹。然后打开主题目录下的style.css文件,定义自己的#commentform textarea部分,例如我的代码:

#commentform textarea { width:350px; height:200px; background:url(img/comment-beijing.gif) no-repeat; }

如此这般,目的已近达到了,由于省略了不少参数,估计还有待测试。不管怎样,关键是思路,方法自然因人而异了。最终到底是什么效果,赶紧看看我的评论框吧。

目前有 44 条留言 其中:访客:33 条, 博主:11 条

  1. only博客 : 2010年08月18日08:24:53  31楼 @回复 回复

    哈哈 过来学习一下 评论右边的广告很不错,忍不住多。。。

  2. 八点博客 : 2010年12月12日14:05:52  32楼 @回复 回复

    学习 了~!~

  3. alige : 2011年03月07日22:02:16  33楼 @回复 回复

    你的代码变种了 真的很痛苦

给我留言

留言无头像?

无觅相关文章插件,快速提升流量

×
腾讯微博