kawakami
WORDPRESS
ワードプレスのコメント欄をカスタマイズ
ワードプレスのコメントは、
single.php の ＜php comments_template(); ＞の位置に表示されます。
表示の際、テーマの中に comments.php があれば、これをテンプレートとして読み込み、なければワードプレスのデフォルトのコメントテンプレートが読み込まれます。
このデフォルトのテンプレートをカスタマイズしたい場合ですが、ワードプレスの関連ファイルを直接編集すると、バージョンアップ等があったときに、上書きで更新されて元に戻ってしまう場合がありますので、一度、現在使用しているテーマ内にコピーしてから作業を行うようにします。
まず、
/wp-includes/theme-compat/comments.php このファイルを使用しているテーマフォルダにコピーします。
そして、このファイルの36行目あたりにある wp_list_comments(); を次のように変更します。
|
1 |
<?php wp_list_comments('callback=original_comment');?> |
次に以下のソースを function.php に記述すれば、デフォルトのままコメント機能が表示されます。
この状態で、comment.php および 以下のソース内のHTMLをタグを編集して、デザインのカスタマイズを行います。
|
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 36 37 38 39 40 |
function original_comment( $comment, $args, $depth ) { if ( 'div' == $args['style'] ) { $tag = 'div'; $add_below = 'comment'; } else { $tag = 'li'; $add_below = 'div-comment'; } ?> <<?php echo $tag; ?> <?php comment_class( empty( $args['has_children'] ) ? '' : 'parent' ); ?> id="comment-<?php comment_ID(); ?>"> <?php if ( 'div' != $args['style'] ) : ?> <div id="div-comment-<?php comment_ID(); ?>" class="comment-body"> <?php endif; ?> <div class="comment-author vcard"> <?php if ( 0 != $args['avatar_size'] ) echo get_avatar( $comment, $args['avatar_size'] ); ?> <?php printf( __( '<cite class="fn">%s</cite> <span class="says">says:</span>' ), get_comment_author_link() ); ?> </div> <?php if ( '0' == $comment->comment_approved ) : ?> <em class="comment-awaiting-moderation"><?php _e( 'Your comment is awaiting moderation.' ) ?></em> <br /> <?php endif; ?> <div class="comment-meta commentmetadata"><a href="<?php echo esc_url( get_comment_link( $comment->comment_ID ) ); ?>"> <?php /* translators: 1: date, 2: time */ printf( __( '%1$s at %2$s' ), get_comment_date(), get_comment_time() ); ?></a><?php edit_comment_link( __( '(Edit)' ), ' ', '' ); ?> </div> <?php comment_text() ?> <div class="reply"> <?php comment_reply_link( array_merge( $args, array( 'add_below' => $add_below, 'depth' => $depth, 'max_depth' => $args['max_depth'] ) ) ); ?> </div> <?php if ( 'div' != $args['style'] ) : ?> </div> <?php endif; ?> <?php } |
starnotes
hasegawa