要添加自定义注释样式到WordPress主题中,可以按照以下步骤:
在主题文件夹中创建一个新的CSS文件,例如comments.css。
在该文件中编写自定义注释样式的CSS代码,例如:
.comment {
background-color: #f7f7f7;
padding: 20px;
margin-bottom: 20px;
border: 1px solid #ddd;
}
.comment-author {
font-weight: bold;
margin-bottom: 10px;
}
.comment-date {
font-size: 12px;
margin-bottom: 10px;
}
.comment-content {
font-size: 14px;
line-height: 1.5;
}
function mytheme_enqueue_comments_style() {
wp_enqueue_style( 'mytheme-comments-style', get_template_directory_uri() . '/comments.css' );
}
add_action( 'wp_enqueue_scripts', 'mytheme_enqueue_comments_style' );
这将在主题的头部添加一个外部CSS文件,其中包含自定义注释样式的CSS代码。
<?php wp_list_comments(); ?>
用以下代码替换它:
<?php
wp_list_comments( array(
'callback' => 'mytheme_comment',
) );
?>
<?php
function mytheme_comment( $comment, $args, $depth ) {
?>
<div <?php comment_class(); ?> id="comment-<?php comment_ID(); ?>">
<div class="comment-author">
<?php echo get_comment_author_link(); ?>
<span class="comment-date"><?php echo get_comment_date(); ?> <?php echo get_comment_time(); ?></span>
</div>
<div class="comment-content">
<?php if ( $comment->comment_approved == '0' ) : ?>
<p><em>等待审核...</em></p>
<?php endif; ?>
<?php comment_text(); ?>
</div>
<?php comment_reply_link( array_merge( $args, array(
'depth' => $depth,
'max_depth' => $args['max_depth'],
'reply_text' => '回复',
'login_text' => '登录以回复',
) ) ); ?>
</div>
<?php
}
?>
这将添加一个自定义的回调函数来输出注释,其中包含前面创建的自定义注释样式。
以上就是如何添加自定义注释样式到WordPress主题中的步骤,需要注意一些细节和修改文件路径和CSS样式。