WordPress评论框添加指引说明

上一篇博文中说了给评论框添加指引说明的事,有朋友希望我放出代码以免后人再搜索之苦,看到这话我顿时羞涩了。因为我不懂代码,并且我也是找度娘的。

虽自认为小白,但我相信比我白的人多了去,至于大虾们就可以不用往下看了,这点所谓的的技巧根本入不了你们的法眼!

WordPress评论框添加指引说明有几种方式,其中一种是添加评论框背景图片,图片上可以附带说明,这种方式好处是可以采用艺术字,图片可以做得很漂亮。不好的地方则是对移动端的适配比较难搞。对自适应的主题来说背景图尺寸难以把握。

另外一种是直接添加纯文字说明,这是我比较推崇的方式,通过修改主题文件里边的 comments.php 实现的。在版本 3 之前,整个 WordPress 评论框的全部代码都是在主题的 comments.php 文件中的。这使得修改它非常的方便。不过带来的问题就是让主题看起来有些乱。开发人员也注意到了这个问题,然后从 WordPrss 3 开始,评论框就被精简为一个函数了,直接在主题的相应位置调用此函数:<?php comment_form(); ?> 即可生成默认评论的表单。我们在修改主题文件的时候,需要注意自己所使用主题的评论模板,是直接引用该函数还是另行撰写了评论代码,我见网上很多教程对这两者并区分。

如果是主题直接撰写了评论模板代码,那很多东西是一看就能看得到,修改会很方便,例如,在评论框内添加背景说明的文字,“我坚信,评论可以一针见血!”。鼠标点击过去文字就会消失的,直接在主题文件comments.php 寻找这段代码:

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

将其修改为:

<textarea style="color:gray" onblur="if (this.value == ”) {this.value = ‘我坚信,评论可以一针见血!’;} " onfocus="if (this.value == ‘我坚信,评论可以一针见血!’) {this.value = ”;}" name="comment" id="comment" cols="60" rows="10" tabindex="4">我坚信,评论可以一针见血!</textarea>

如果主题是直接调用 <?php comment_form(); ?> 这个代码生成评论表单的,那修改就要麻烦一些。我没有找到引用该函数方式后,添加评论框背景文字的方法,只能在评论框上方添加说明。这样做可以给文字说明添加超链接,也算是个好处。

打开主题文件comments.php,找到该函数

<?php comment_form(); ?>

在后面补充array参数后,修改为:

<?php comment_form(array(‘title_reply’=>’雁过留声,人过留名’)); ?>

要给说明文字添加蓝色粗体的超链接,添加的文字就要这样

<a href="链接网址"><span style="font-weight: bold;"><span style="color: rgb(255, 0, 0);"><span style="color: rgb(0, 0, 255);">雁过留声,人过留名</a>

教程就到这,对大神来说这些都小儿科的,他们可能有更好的方法,我就不献丑了!

P.S.另外需要注意的是,请不要直接复制代码,虽然这代码看起来是相同,但背后对应的编码有很多地方不一样,在文章显示是中文格式,不能直接用在代码文件中!

觉得好可以点个赞!
(暂无人赞)
Loading...

《WordPress评论框添加指引说明》有15个想法

    1. 请不要直接复制代码,另外,我并没有采用评论框内背景文字的方案,我是写在评论框上方的

  1. 我用的是修改comment_form()参数,花了好多时间查阅资料,还是只是作出了一个丑陋的评论界面。

  2. 加上一段醒目的文字提示也算是个办法。啥叫评论?啥叫电子邮件?啥叫昵称?这些都不清楚的人你如何救治啊!

    1. 我没能折腾出评论框的背景文字,只是在上方做了简要说明,大概也能起到相同效果吧

风格君进行回复 取消回复

电子邮件地址不会被公开。 必填项已用*标注