WordPress 主题 Theme Codename H 之评论模版设计

Theme Codename H 正是 LiveSino 使用的 WordPress 主题,由我改进代码和用户体验,目前最新的 Rev.96 相对于之前发布的正式版 Rev.74 有相当多的更新。在发布新版 Theme Codename H 主题之前,我觉得有必要开始一系列详尽的介绍。

首先从 Theme Codename H 评论模版开始。

WordPress 主题 Theme Codename H 之评论模版设计 

1)支持 WordPress 原生评论嵌套,支持 Gravatar 头像,其中访客和登录用户的头像边框将以灰色和绿色区别开。而对于不开放注册的博客来说,这一头像边框特性将标识出管理员、编辑等登录用户的评论。

2)在未登录的状态下,发表评论表单右侧将显示 Gravatar 头像:

  • 若是首次尝试发表评论,将显示默认头像
  • 若已成功发表过评论,并且 E-mail 输入框保存着上次的邮件地址,将显示该 E-mail 地址对应的 Gravatar 头像(就是图中所示的效果)

Gravatar 头像将链接至 Gravatar.com 站点,以便于访客设置头像,或者创建头像。

3)延续了 Theme Codename H 一贯的风格,“引用 Trackback”类型的评论将以精简的格式进行显示(无展开内容,仅标题和链接),且不可回复。

4)嵌套回复的原理可完全参考 Jinwen 老师的此文,实现的效果:所有评论的嵌套始终直属于主评论,二级评论将通过 @XXX 区别开回复对象。

另外,点击回复按钮,评论文本框会自动添加 @XXX 文字和链接;取消回复按钮也会同时出现,相比其左侧的提交按钮,取消回复采用了文本链接的形式。

5)我分别用不同颜色标注了表单输入框右侧的必填和选填提示,该样式也同样适用于主题中的其他部分,例如联系表单的输入框的。

若实在不想自行处理 WordPress 的评论模版,新版 Theme Codename H 主题中有现成的。 😛

赞赏
78 条评论
  • Simon

    Hm... comparing comments.php (to an older version) doesn't show up any changes. How do I switch to the new "comment design"?

    2010 年 02 月 28 日 6:58 上午 回复

    • 寻找自己

      @Simon not yet release

      2010 年 02 月 28 日 8:05 上午

    • Picturepan2

      @Simon Not released yet. The new Theme Codename H will be available in next few weeks, just like what Microsoft always says. :D

      2010 年 02 月 28 日 12:32 下午

    • Sullivan

      @Simon I wonder 你能看懂上面的中文吗?

      2010 年 02 月 28 日 5:23 下午

    • Simon

      Yes. I know the important words, thank you :)

      2010 年 02 月 28 日 9:57 下午

    • kookoo

      @Sullivan 呵呵

      2010 年 04 月 10 日 5:01 下午

    • Noeek

      @Simon Simon,you, really cute. : )

      2010 年 11 月 06 日 11:23 下午

  • 寻找自己

    呵呵,那种期待实在是。。。一言难尽 只有评论的介绍?其余的呢?

    2010 年 02 月 28 日 8:06 上午 回复

  • 大余

    发觉这个主题也挺适合用来做日记类主题的,有一个建议,可不可以考虑集成pageNavi这个功能,因为传统的翻页效率不免太低。

    2010 年 02 月 28 日 8:42 上午 回复

    • Picturepan2

      @大余 其实做什么都差不多,无非是利用 Wordpress 本身的模版在变化。hmmm, Theme Codename H 可能更倾向于一些其他主题并没有尝试过的功能吧。 至于集成 PageNavi 其实安装插件也不麻烦的吧。

      2010 年 02 月 28 日 12:34 下午

  • xiao3

    嗯~这个非常不错!要是再将留言过的人的资料框隐藏起来就更好啦!

    2010 年 02 月 28 日 9:15 上午 回复

    • Picturepan2

      @xiao3 恩,呵呵,用 jQuery 应该不难实现。

      2010 年 02 月 28 日 12:35 下午

  • 李嘉豪

    不错啊

    2010 年 02 月 28 日 9:34 上午 回复

  • 李嘉豪

    我弄了gravatar 怎么 还不显示出来

    2010 年 02 月 28 日 9:35 上午 回复

    • 小Q

      @李嘉豪 可能你没有设置好,设置显示的时候最好选择G级别,这样基本所以网站都能够显示!

      2010 年 02 月 28 日 11:30 上午

    • Picturepan2

      @李嘉豪 耐心 + 级别设置。。没其他的叻吧。

      2010 年 02 月 28 日 12:37 下午

  • 起衣

    。。起晚了。。。

    2010 年 02 月 28 日 12:11 下午 回复

    • 起衣

      @起衣 很好的是我也搞定了两层评论的嵌套 :) 回复邮件通知折腾了很久..

      2010 年 02 月 28 日 12:15 下午

    • 起衣

      @起衣 有个意见,图片加载效果的那张背景图控制在文章内容中使用就可以了,全站使用的时候遇到某些人的头像背景是透明就比较囧了,一直有个加载效果在那转...

      2010 年 02 月 28 日 12:35 下午

    • Picturepan2

      @起衣 恩,图片加载已经仅限正文部分叻。

      2010 年 02 月 28 日 12:40 下午

    • kankan

      @起衣  嗯

      2010 年 02 月 28 日 12:41 下午

    • 枯の灵

      @起衣 我看看哈……若是这样回复的话 会不会出错

      2010 年 03 月 04 日 10:45 上午

  • Windows 8

    在“存档 Archives”页,除了现实文章数目以外,希望实现在框架上显示年月,这样更为直观点。

    2010 年 02 月 28 日 6:08 下午 回复

    • Windows 8

      @Windows 8 还希望有评论翻页功能。

      2010 年 02 月 28 日 6:09 下午

    • Picturepan2

      @Windows 8 显示年月的去掉叻,但会恢复的。我在本地测试具体的样式。 :D

      2010 年 02 月 28 日 7:14 下午

  • 任平生

    评论框是不是可以 overflow:auto 在ie中默认有个滚动条有点不好看唉

    2010 年 02 月 28 日 10:00 下午 回复

    • Picturepan2

      @任平生 好~ 这就改。对了 这篇文章写的清楚?

      2010 年 02 月 28 日 10:13 下午

  • Slevines

    刚建了博客,用这个主题,可是Gravatar却显示不出来不知道怎么回事? 用twitter头像替换或者默认的却都可以显示

    2010 年 04 月 02 日 12:01 上午 回复

    • Picturepan2

      @Slevines 后台 设置里开启 Gravatar

      2010 年 04 月 02 日 12:15 上午

    • Slevines

      @Picturepan2 后台里面设置过了,昨晚上google了一夜也没个结果,因为是新建的博客,索性将目录全删除了,然后重新建根目录,设置目录权限,安装WordPress....只是一直觊觎Rev.96,嘿嘿,能不能先发来用呀?

      2010 年 04 月 02 日 10:50 上午

  • Slevines

    我们...不在一个时区?

    2010 年 04 月 02 日 10:50 上午 回复

  • Alican

    Hello, Where can i download rev 96 english version? Please help me. Alican.

    2010 年 04 月 13 日 2:27 上午 回复

    • Picturepan2

      @Alican Sorry, the new Theme Codename H is NOT released yet.

      2010 年 04 月 13 日 3:40 上午

    • Alican

      When you get published? rev.75 too old.

      2010 年 04 月 13 日 4:02 上午

  • uren

    Rev.96 怎么不放出来下载啊?

    2010 年 04 月 14 日 11:31 上午 回复

  • Alican

    Hello picturepan Please publish rev.96

    2010 年 04 月 18 日 3:27 上午 回复

  • Alican

    Picture pleaseeee.... rev.96!!

    2010 年 04 月 21 日 12:30 上午 回复

  • AOYU

    我已经在CSS表里面把图片边框设置为“border:0 px”了,怎么图片还是有边框呢??

    2010 年 05 月 08 日 11:00 下午 回复

  • striver

    已经下载了你的rev.75,强烈希望rev.96早日放出。 冒昧问下,picture是不是准备等到rev.1.0时再放出?

    2010 年 05 月 30 日 11:36 下午 回复

  • 爱月

    呃~等不及v96了,打算按照更新日志一点一点折腾了。。。

    2010 年 07 月 05 日 1:47 上午 回复

  • 爱月

    奔溃了。。。只能小改,大改不能。。。 评论页的详细修改方法给一个嘛~

    2010 年 07 月 05 日 1:49 下午 回复

  • xiao3

    为什么最新版还没有发布啊?似乎过了好久啦!一直在等着呢!

    2010 年 07 月 28 日 11:22 下午 回复

  • Hailo

    啥时能发布Rev96?

    2010 年 07 月 29 日 5:48 下午 回复

  • dqaria

    博主的主题超好看啊~~~~~~

    2010 年 08 月 23 日 4:26 下午 回复

  • 末路花未央

    超漂亮的主题,准备尝试一下。

    2010 年 08 月 24 日 5:50 下午 回复

    • 末路花未央

      @末路花未央 为什么我用这个主题,镶嵌回复时下面都出现两个“回复”呢,如果镶嵌第三层的话就出现三个“回复”

      2010 年 08 月 24 日 8:13 下午

    • Picturepan2

      只能嵌套 两层。

      2010 年 08 月 25 日 1:50 上午

    • 小龟爬爬

      @末路花未央 我也出现这种问题了,该怎么解决呢?

      2011 年 04 月 10 日 1:30 上午

  • LOO2K

    这个做得很精细,细节处理的太好了。赞一个!

    2010 年 08 月 24 日 9:46 下午 回复

  • 末路花未央

    有个问题,如果首页上有视频,而且位置比较比较靠上的话,点击右上角的”RSS订阅“后出现的订阅界面会被视频遮住; 还有,在评论栏想输入波浪曲线,即shift+键盘上方数字键”1“前面的按键,会自动跳到页首

    2010 年 08 月 26 日 10:45 下午 回复

  • 绝版黑色

    很简洁的主题.

    2010 年 09 月 02 日 10:57 上午 回复

  • Baider

    看看我的头像对不对,

    2010 年 10 月 09 日 1:42 下午 回复

  • 大余

    回复嵌套这里有个bug,如果你点一下“回复”,然后在输入框里把自动插入的代码删掉,然后再点回复,输入框就会有两次回复的代码,如此类推,一直累加。

    2010 年 10 月 19 日 11:25 上午 回复

    • Picturepan2

      @大余 啊 我这试的时候没问题的啊。。啥浏览器呢?

      2010 年 10 月 19 日 12:00 下午

    • 123

      @Picturepan2 在本地测试的时候IE8出现了好几个回复

      2010 年 11 月 01 日 11:12 上午

    • 大余

      @Picturepan2 Chrome 8 有这个问题。

      2010 年 11 月 02 日 3:38 下午

  • 青年怪客

    请教老师, 我的站上发布的文章,全部都出来了,没有老师的好看呀,请求帮助一下,感谢

    2010 年 10 月 19 日 9:41 下午 回复

  • 疯来愚去

    这个支持wp的最新版本是多少? 还是随便都可以 最低是多少???

    2010 年 11 月 23 日 8:59 下午 回复

    • Picturepan2

      @疯来愚去 支持 WordPress 3.0.1 的,2.9 以上应该都是没问题的。。以下就难说了。

      2010 年 11 月 24 日 12:21 上午

    • 疯来愚去

      @Picturepan2  我昨晚在3.0.1上安装有错误提示(内容忘了),不过启用后可以正常显示。 菜鸟问题建议:能不能在文章、评论、右侧栏等加上边框?? 或者说一下怎么修改css

      2010 年 11 月 24 日 9:30 上午

  • 大余

    Picturepan2 同学有打算弄个 Ajax comments 么?可以参考这里 http://kan.willin.org/?p=1271

    2010 年 11 月 24 日 1:41 下午 回复

    • 疯来愚去

      @大余  把页码也能个ajax 呵呵

      2010 年 11 月 25 日 1:58 下午

    • 疯来愚去

      @大余  刚看了下 确实不错啊 ajax效果就是很好

      2010 年 11 月 25 日 2:09 下午

    • Picturepan2

      @大余 嗯,我看过的,找机会尝试一下。。

      2010 年 11 月 25 日 5:05 下午

    • 疯来愚去

      @Picturepan2  1.0 final 呵呵

      2010 年 11 月 28 日 2:11 上午

  • zuiTT

    试试支持Ajax评论不!嘿嘿

    2010 年 11 月 29 日 5:13 下午 回复

  • 风中之竹

    不错,喜欢天蓝色!支持一下O(∩_∩)O~

    2010 年 12 月 13 日 10:39 上午 回复

  • TeRRY

    Codename评论代码十分标准,相应地ajaxcomments添加ajax评论功能变得很简单

    2010 年 12 月 28 日 4:44 下午 回复

  • 扒一扒

    这主题很不错,尤其在ie8下显示很好,支持,不用很多插件了,来我网站看效果吧

    2011 年 03 月 24 日 6:37 下午 回复

  • 曲豆先生

    这个主题不支持Widgets?

    2011 年 03 月 25 日 9:32 上午 回复

  • 陈建平的愚见

    @Picturepan2 翻页的小方块背景颜色能否改变?如果可以需要修改何处代码?

    2011 年 08 月 01 日 11:25 上午 回复

  • 陈建平的愚见

    表情如何使用?是在文章中显示还是评论?

    2011 年 08 月 01 日 11:43 上午 回复

  • in1874

    请问可以增加评论翻页吗? 另外我用这个主题为什么会出现2个回复?(这个问题解决了,后台设置嵌套2层即可)

    2012 年 01 月 28 日 1:57 上午 回复

    • Picturepan2

      @in1874 目前不更新这个主题了,准备新的。谢谢关注。

      2012 年 01 月 28 日 10:09 上午

  • 单点日志

    模板不错,留言有提示吗

    2012 年 05 月 10 日 10:14 上午 回复

发表评论