在制作文章页面模板 single.php 时,在文章的下面我们通过一段代码调用了一个评论功能,这个评论功能是WP程序自带的评论框,样式比较单一。我们可以自己制作一个评论功能模板 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条评论', '% 评论' );?>
THE END
暂无评论内容