Content to the templatefile, in the theme directory comments.php
One “aber dabai” is that I moved the $req asterix (*) besides the label Name/Email/Website and removed the “required” span class. And the extra class can mess up the absolute position for the name, and then the asterix.
I did this becourse I like to use the jQuery infieldLabel plugin to move the input label inside the input field.
Further more, I like to use a ajax comment plugin like: ptm-ajax-comments
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
$fields = array( 'author' => '<p class="comment-form-author">' . '<label for="author">' . __( 'Name' . ( $req ? '*' : '' ) ) . '</label> <input id="author" name="author" type="text" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30"' . $aria_req . ' />' . '</p>', 'email' => '<p class="comment-form-email">' . '<label for="email">' . __( 'Email' . ( $req ? '*' : '' ) ) . '</label> <input id="email" name="email" type="text" value="' . esc_attr( $commenter['comment_author_email'] ) . '" size="30"' . $aria_req . ' />' . '</p>', 'url' => '<p class="comment-form-url">' . '<label for="url">' . __( 'Website' . ( $req ? '*' : '' ) ) . '</label> <input id="url" name="url" type="text" value="' . esc_attr( $commenter['comment_author_url'] ) . '" size="30"' . $aria_req . ' />' . '</p>', ); $defaults = array( 'fields' => apply_filters( 'comment_form_default_fields', $fields ), 'comment_field' => '<p class="comment-form-comment"><label for="comment">' . _x( 'Comment', 'noun' ) . '</label><textarea id="comment" name="comment" cols="45" rows="8" aria-required="true"></textarea></p>', 'must_log_in' => '<p class="must-log-in">' . sprintf( __( 'You must be <a href="%s">logged in</a> to post a comment.' ), wp_login_url( apply_filters( 'the_permalink', get_permalink($post_id) ) ) ) . '</p>', 'logged_in_as' => '<p class="logged-in-as">' . sprintf( __( 'Logged in as <a href="%1$s">%2$s</a>. <a href="%3$s" title="Log out of this account">Log out?</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">' . __( 'Your email address will not be published.' ) . ( $req ? $required_text : '' ) . '</p>', 'comment_notes_after' => '<p class="form-allowed-tags">' . sprintf( __( 'You may use these <abbr title="HyperText Markup Language">HTML</abbr> tags and attributes: %s' ), ' <code>' . allowed_tags() . '</code>' ) . '</p>', 'id_form' => 'commentform', 'id_submit' => 'submit', 'title_reply' => __( 'Leave a Comment' ), 'title_reply_to' => __( 'Leave a Reply to %s' ), 'cancel_reply_link' => __( 'Cancel reply' ), 'label_submit' => __( '' ), ); comment_form($defaults); ?> <ol class="commentlist"> <?php wp_list_comments();?> </ol> |
Styling the commentform
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
div#respond {} div#respond p.comment-form-author, div#respond p.comment-form-email, div#respond p.comment-form-url, div#respond p.comment-form-comment{} div#respond input{} div#respond label{} div#respond p.comment-form-author label, div#respond p.comment-form-email label, div#respond p.comment-form-url label, div#respond p.comment-form-comment label{} h3#reply-title{} h3#reply-title small{} form#commentform{} p.comment-form-author{} p.coment-form-author label{} p.comment-form-author input#author{} p.comment-form-email{} p.comment-form-email label{} p.comment-form-email input#email{} p.comment-form-url{} p.comment-form-url label{} p.comment-form-url input#url{} span.required{} .comment-form-comment{} p.comment-form-comment label{} p.comment-form-comment textarea#comment{} p.must-log-in{} p.logged-in-as{} p.comment-notes{} p.form-allowed-tags{} p.form-allowed-tags code{} p.form-submit{} p.form-submit input{} #respond .form-submit input{} |
Styling the commentlist:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
ol.commentlist{} ol.commentlist li.comment{} ol.commentlist li.even, ol.commentlist li.thread-even{} ol.commentlist li.odd, ol.commentlist li.alt{}, ol.commentlist li.thread-alt, ol.commentlist li.thread-odd{} ol.commentlist li.comment .comment-body{} ol.commentlist li.comment .comment-body .comment-author{} ol.commentlist li.comment .comment-body .comment-author img.avatar{} ol.commentlist li.comment .comment-body .comment-author cite.fn{} ol.commentlist li.comment .comment-body .comment-author span.says{} ol.commentlist li.comment .comment-body .comment-meta{} ol.commentlist li.comment .comment-body .comment-meta a{} ol.commentlist li.comment .comment-body p{} /* the comment text */ ol.commentlist li.comment .comment-body .reply{} ol.commentlist li.comment .comment-body .reply a.comment-reply-link{} ol.commentlist li ul.children{} ol.commentlist li ul.children li.comment{} |
Enjoy