WordPress评论功能模板(comment.php)制作

WordPress评论功能模板(comment.php)制作

在制作文章页面模板 single.php 时,在文章的下面我们通过一段代码调用了一个评论功能,这个评论功能是WP程序自带的评论框,样式比较单一。我们可以自己制作一个评论功能模板 comment.php 来替换默认的评论功能模板。

图片[1]-WordPress评论功能模板(comment.php)制作-龙网 - 教程、网赚、安全、免费资源

评论功能模板 comment.php 制作步骤:

第一步:下载独立的评论模板。 comment.php 将它放到我们制作的主题文件夹下;

第二步:打开style.css文件,在CSS文件的最下方,插入下面的CSS样式代码:

/* 评论 */
#comments{ width:100%; margin:10px 0px; padding:8px 0px 5px; text-indent:8px; background:#F3F3F3; border-bottom:1px solid #BBC5CC; }
.commentlist{ }
.commentlist p{ text-indent:0px;}
.commentlist a:link, .commentlist a:visited{ background:none; color:#454545;}
.commentlist a:hover{ background:none; color:#CC0000; text-decoration:underline;}
.commentlist li{ float:left; margin:5px 0px; width:96%; padding:15px 10px 5px 10px; background:#FFF; border:1px solid #BBC5CC;}
.commentlist li.alt{ background:#FFFAF4; border:1px solid #BBC5CC;}
.commentlist li .gravatar{ float:left; width:48px; margin:0px 8px 5px 0px; padding:1px 1px; text-align:center; border:1px solid #C7C7C7;}
.commentlist li .gravatar img{ margin:0px !important; padding:0px !important;}
.commentlist li .floor{ float:left; width:48px; margin-top:1px; padding:2px 0px 1px; text-align:center; border-top:1px solid #A7B6BE; background:F8F8F8; color:#999999;}
.commentlist li .authordata{ float:right; width:480px;}
.commentlist li .commentmetadata{ float:right; color:#999999;}
.commentlist li .commentcontent{ float:right; width:480px;}
#editcomment{ float:left; font-size:14px;}
#editcomment p{ padding:10px 10px 5px;}
#author, #email, #url{ margin-left:8px; width:40%; border:1px solid #CCCCCC; color:#906; font-weight:bold; font-size:14px; background:#FCFCFC; padding:5px 3px;}

第三步:在需要显示评论功能的位置,如文章的下方,使用下面的标签调用评论功能。

<?php comments_template(); ?>

第四步:有的页面需要显示文章被评论的数量,可以使用下面调用评论数的标签调用。

<?php comments_number('暂无评论', '1条评论', '% 评论' );?>
版权声明
转载请注明本文地址:https://www.e363.com/1641.html
THE END
喜欢龙网的内容,就支持一下吧!
点赞131赞赏 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容