我对评论表单有一个问题,因为我想更改回复评论表单的样式(单击评论的回复链接后打开的表单)。但我找不到正确的方法,也不想修改Wordpress中的本机文件,例如comment reply。js,因为更新时可能会丢失所有更改。
这是我索引中注释的代码部分。css文件:
/* -==========================- COMMENTS -==========================- */
#comments li { margin-top:20px; }
#comments .avatar { float: left;margin: 3px 15px 5px 0;border: 1px solid #000;background: #fff;padding: 4px;border-radius: 37px;box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.65);}
#comments .author-name { font-weight:bold; }
#comments .author-name, #comments .says { font-size:18px; }
#comments .commentmetadata { font:italic 13px \'Lora\', serif;float:right;letter-spacing: 0.4px;}
#comments ul li p { margin:80px 0 30px 0; font-size: 15px;text-align: justify;}
#comments .reply { float:right;margin-right: 2px;margin-bottom: 7px;}
.comment-reply-link, .comment-edit-link {box-shadow: 0 1px 8px rgba(0, 0, 0, 0.14) inset,0 1px 3px rgba(0, 0, 0, 0.6);border-bottom: 1px solid #8f7449;border-top: 1px solid #f4ddb6;border-radius: 5px;padding: 4px 10px 2px 10px;font: italic bold 16px \'Almendra\', Times, "Times New Roman", serif;color: #ab3624;text-shadow: 0 1px 0 rgba(255,255,255,0.35);text-decoration: none;width: auto;background: rgba(214, 147, 60, 0.19);border-left-color: transparent;border-right-color: transparent;cursor: pointer;letter-spacing: 0.5px;margin-left: 10px;}
#commentform label:after{ content:":"; }
#commentform input, #commentform textarea{ clear:left; width:91%; font: 700 13px \'PT Sans\',sans-serif;color: #4e392f;background: rgba(230,180,95,.4);border: 2px solid #8d7147;box-shadow: 0 1px 6px rgba(0,0,0,.25) inset,0 1px 0 #F4DDB6;padding: 3px 8px;border-radius: 5px;margin-bottom: 10px; margin-top: 10px;}
#commentform p.form-submit { text-align:center; }
#comments .children { margin-left:30px; }
#comments .comment-body { overflow:hidden; border-bottom: 1px dotted rgba(0, 0, 0, 0.22);padding-bottom: 5px;border-left: 3px solid #860909;padding-left: 15px;}
这是我的评论。php文件
<?php global $SMTheme; ?>
<?php if ( post_password_required() ) { ?>
<p><?php $SMTheme->_( \'password\' ) ?></p>
<?php return; } ?>
<?php if ( $post->comment_status!=\'open\' ) { ?>
<p><?php $SMTheme->_( \'closedcomments\' ) ?></p>
<?php return; } ?>
<?php if ( have_comments() ) { ?>
<div id="comments">
<h3 id="comments-title">
<?php
if (get_comments_number()==1) {
printf( $SMTheme->_( \'formoneresponse\' ), \'<em>\' . get_the_title() . \'</em>\');
} else {
printf( $SMTheme->_( \'formmultiresponse\' ), \'<em>\' . get_the_title() . \'</em>\', get_comments_number());
}
?></h3>
<ul class="commentlist">
<?php $i = 0; ?>
<?php wp_list_comments( array( \'type\' => \'comment\', \'callback\' => \'custom_comments\' ) );?>
</ul>
<?php if ( get_comment_pages_count() > 1 ) { ?>
<div class="navigation clearfix">
<div class="alignleft"><?php previous_comments_link( $SMTheme->_( \'prevcomments\' ) ); ?></div>
<div class="alignright"><?php next_comments_link( $SMTheme->_( \'nextcomments\' ) ); ?></div>
</div><!-- .navigation .clearfix -->
<?php } ?>
</div><!-- #comments -->
<?php } ?>
<?php
$args=array(
\'comment_field\' => \'<p class="comment-form-comment"><label for="comment">\' . $SMTheme->_( \'comment\' ) . \'</label><br /><textarea id="comment" name="comment" cols="45" rows="8" aria-required="true"></textarea></p>\',
\'must_log_in\' => \'<p class="must-log-in">\' . sprintf( $SMTheme->_( \'mustbe\' ).\' <a href="%s">\'.$SMTheme->_( \'loggedin\' ).\'</a> \'.$SMTheme->_( \'topostcomment\' ).\'.\' , wp_login_url( apply_filters( \'the_permalink\', get_permalink( $post_id ) ) ) ) . \'</p>\',
\'logged_in_as\' => \'<p class="logged-in-as">\' . sprintf( __( $SMTheme->_( \'loggedinas\' ).\' <a href="%1$s">%2$s</a>. \' ), admin_url( \'profile.php\' ), $user_identity, wp_logout_url( apply_filters( \'the_permalink\', get_permalink( $post_id ) ) ) ) . \'</p>\',
\'comment_notes_before\' => \'<p class="comment-notes">\' . $SMTheme->_( \'comment_notes_before\' ) . ( $req ? $required_text : \'\' ) . \'</p>\',
\'comment_notes_after\' => \'<p></p>\',
\'id_form\' => \'commentform\',
\'id_submit\' => \'submit\',
\'title_reply\' => $SMTheme->_( \'leavereply\' ),
\'title_reply_to\' => $SMTheme->_( \'leavereply\' ),
\'cancel_reply_link\' => $SMTheme->_( \'cancelreply\' ),
\'label_submit\' => $SMTheme->_( \'addcomment\' )
);
comment_form($args);
?>
有没有办法做到这一点?
最合适的回答,由SO网友:user1903782 整理而成
幸运的是,我能够解决这个问题。问题出在#comments ul li p
, 所以我删除了margin
和text-align
属性,这些属性与回复注释表单冲突,并修改了css文件的其他部分以获得相同的结果。
在其他情况下,解决方案可能会有所不同,但我希望这能起到指导作用!
这是我索引中的修改部分。css文件:
#comments li { margin-top:20px; }
#comments .avatar { float: left;margin: 3px 15px 5px 0;border: 1px solid #000;background: #fff;padding: 4px;border-radius: 37px;box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.65);}
#comments .author-name { font-weight:bold; }
#comments .author-name, #comments .says { font-size:18px; }
#comments .commentmetadata { font:italic 13px \'Lora\', serif;float:right;letter-spacing: 0.4px;}
#comments ul li p {font-size: 15px;}
#comments .reply { float:right;margin-right: 2px;margin-bottom: 7px;margin-top: 15px;}
.comment-reply-link, .comment-edit-link {box-shadow: 0 1px 8px rgba(0, 0, 0, 0.14) inset,0 1px 3px rgba(0, 0, 0, 0.6);border-bottom: 1px solid #8f7449;border-top: 1px solid #f4ddb6;border-radius: 5px;padding: 4px 10px 2px 10px;font: italic bold 16px \'Almendra\', Times, "Times New Roman", serif;color: #ab3624;text-shadow: 0 1px 0 rgba(255,255,255,0.35);text-decoration: none;width: auto;background: rgba(214, 147, 60, 0.19);border-left-color: transparent;border-right-color: transparent;cursor: pointer;letter-spacing: 0.5px;margin-left: 10px;}
#commentform label:after{ content:""; }
#commentform input, #commentform textarea{ clear:left; width:91%; font: 700 13px \'PT Sans\',sans-serif;color: #4e392f;background: rgba(230,180,95,.4);border: 2px solid #8d7147;box-shadow: 0 1px 6px rgba(0,0,0,.25) inset,0 1px 0 #F4DDB6;padding: 3px 8px;border-radius: 5px;margin-bottom: 10px; margin-top: 10px;}
#commentform p.form-submit { text-align:center; }
#comments .children { margin-left:30px; }
#comments .comment-body { overflow:hidden; border-bottom: 1px dotted rgba(0, 0, 0, 0.22);padding-bottom: 5px;border-left: 3px solid #860909;padding-left: 15px;text-align: justify;}
希望这有帮助。