First of all, thanks to Ian Stewart for the codes here-
In functions.php paste the following codes:
// Template for comments and pingbacks.
if ( ! function_exists( 'my_comment' ) ) :
function my_comment( $comment, $args, $depth ) {
$GLOBALS['comment'] = $comment;
switch ( $comment->comment_type ) :
case 'pingback' :
case 'trackback' :
// Display trackbacks differently than normal comments.
?>
<li <?php comment_class(); ?> id="comment-<?php comment_ID(); ?>">
<p><?php _e( 'Pingback:', 'your-theme' ); ?> <?php comment_author_link(); ?> <?php edit_comment_link( __( '(Edit)', 'your-theme' ), '<span class="edit-link">', '</span>' ); ?></p>
<?php
break;
default :
// Proceed with normal comments.
global $post;
?>
<li <?php comment_class(); ?> id="li-comment-<?php comment_ID(); ?>">
<article id="comment-<?php comment_ID(); ?>" class="comment">
<header class="comment-meta comment-author vcard">
<?php
echo get_avatar( $comment, 44 );
printf( '<cite class="fn">%1$s %2$s</cite>',
get_comment_author_link(),
// If current post author is also comment author, make it known visually.
( $comment->user_id === $post->post_author ) ? '<span> ' . __( 'Post author', 'your-theme' ) . '</span>' : ''
);
printf( '<a href="%1$s"><time datetime="%2$s">%3$s</time></a>',
esc_url( get_comment_link( $comment->comment_ID ) ),
get_comment_time( 'c' ),
/* translators: 1: date, 2: time */
sprintf( __( '%1$s at %2$s', 'your-theme' ), get_comment_date(), get_comment_time() )
);
?>
</header><!-- .comment-meta -->
<?php if ( '0' == $comment->comment_approved ) : ?>
<p class="comment-awaiting-moderation"><?php _e( 'Your comment is awaiting moderation.', 'your-theme' ); ?></p>
<?php endif; ?>
<section class="comment-content comment">
<?php comment_text(); ?>
<?php edit_comment_link( __( 'Edit', 'your-theme' ), '<p class="edit-link">', '</p>' ); ?>
</section><!-- .comment-content -->
<div class="reply">
<?php comment_reply_link( array_merge( $args, array( 'reply_text' => __( 'Reply', 'your-theme' ), 'after' => ' <span>↓</span>', 'depth' => $depth, 'max_depth' => $args['max_depth'] ) ) ); ?>
</div><!-- .reply -->
</article><!-- #comment-## -->
<?php
break;
endswitch; // end comment_type check
}
endif;
And make another PHP file with the following contents and name it to comments.php:
<?php /* The Comments Template — with, er, comments! */ ?>
<div id="comments">
<?php /* Run some checks for bots and password protected posts */ ?>
<?php
$req = get_option('require_name_email'); // Checks if fields are required.
if ( 'comments.php' == basename($_SERVER['SCRIPT_FILENAME']) )
die ( 'Please do not load this page directly. Thanks!' );
if ( ! empty($post->post_password) ) :
if ( $_COOKIE['wp-postpass_' . COOKIEHASH] != $post->post_password ) :
?>
<div class="nopassword"><?php _e('This post is password protected. Enter the password to view any comments.', 'your-theme') ?></div>
</div><!-- .comments -->
<?php
return;
endif;
endif;
?>
<?php /* See IF there are comments and do the comments stuff! */ ?>
<?php if ( have_comments() ) : ?>
<?php /* Count the number of comments and trackbacks (or pings) */
$ping_count = $comment_count = 0;
foreach ( $comments as $comment )
get_comment_type() == "comment" ? ++$comment_count : ++$ping_count;
?>
<?php /* IF there are comments, show the comments */ ?>
<?php if ( ! empty($comments_by_type['comment']) ) : ?>
<div id="comments-list" class="comments">
<h3><?php printf($comment_count > 1 ? __('<span>%d</span> Comments', 'your-theme') : __('<span>One</span> Comment', 'your-theme'), $comment_count) ?></h3>
<?php /* If there are enough comments, build the comment navigation */ ?>
<?php $total_pages = get_comment_pages_count(); if ( $total_pages > 1 ) : ?>
<div id="comments-nav-above" class="comments-navigation">
<div class="paginated-comments-links"><?php paginate_comments_links(); ?></div>
</div><!-- #comments-nav-above -->
<?php endif; ?>
<?php /* An ordered list of our custom comments callback, custom_comments(), in functions.php */ ?>
<ol>
<?php wp_list_comments('type=comment&callback=custom_comments'); ?>
</ol>
<?php /* If there are enough comments, build the comment navigation */ ?>
<?php $total_pages = get_comment_pages_count(); if ( $total_pages > 1 ) : ?>
<div id="comments-nav-below" class="comments-navigation">
<div class="paginated-comments-links"><?php paginate_comments_links(); ?></div>
</div><!-- #comments-nav-below -->
<?php endif; ?>
</div><!-- #comments-list .comments -->
<?php endif; /* if ( $comment_count ) */ ?>
<?php /* If there are trackbacks(pings), show the trackbacks */ ?>
<?php if ( ! empty($comments_by_type['pings']) ) : ?>
<div id="trackbacks-list" class="comments">
<h3><?php printf($ping_count > 1 ? __('<span>%d</span> Trackbacks', 'your-theme') : __('<span>One</span> Trackback', 'your-theme'), $ping_count) ?></h3>
<?php /* An ordered list of our custom trackbacks callback, custom_pings(), in functions.php */ ?>
<ol>
<?php wp_list_comments('type=pings&callback=custom_pings'); ?>
</ol>
</div><!-- #trackbacks-list .comments -->
<?php endif /* if ( $ping_count ) */ ?>
<?php endif /* if ( $comments ) */ ?>
<?php /* If comments are open, build the respond form */ ?>
<?php if ( 'open' == $post->comment_status ) : ?>
<div id="respond">
<h3><?php comment_form_title( __('Post a Comment', 'your-theme'), __('Post a Reply to %s', 'your-theme') ); ?></h3>
<div id="cancel-comment-reply"><?php cancel_comment_reply_link() ?></div>
<?php if ( get_option('comment_registration') && !$user_ID ) : ?>
<p id="login-req"><?php printf(__('You must be <a href="%s" title="Log in">logged in</a> to post a comment.', 'your-theme'),
get_option('siteurl') . '/wp-login.php?redirect_to=' . get_permalink() ) ?></p>
<?php else : ?>
<div class="formcontainer">
<form id="commentform" action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post">
<?php if ( $user_ID ) : ?>
<p id="login"><?php printf(__('<span class="loggedin">Logged in as <a href="%1$s" title="Logged in as %2$s">%2$s</a>.</span> <span class="logout"><a href="%3$s" title="Log out of this account">Log out?</a></span>', 'your-theme'),
get_option('siteurl') . '/wp-admin/profile.php',
esc_html($user_identity, true),
wp_logout_url(get_permalink()) ) ?></p>
<?php else : ?>
<p id="comment-notes"><?php _e('Your email is <em>never</em> published nor shared.', 'your-theme') ?> <?php if ($req) _e('Required fields are marked <span class="required">*</span>', 'your-theme') ?></p>
<div id="form-section-author" class="form-section">
<div class="form-label"><label for="author"><?php _e('Name', 'your-theme') ?></label> <?php if ($req) _e('<span class="required">*</span>', 'your-theme') ?></div>
<div class="form-input"><input id="author" name="author" type="text" value="<?php echo $comment_author ?>" size="30" maxlength="20" tabindex="3" /></div>
</div><!-- #form-section-author .form-section -->
<div id="form-section-email" class="form-section">
<div class="form-label"><label for="email"><?php _e('Email', 'your-theme') ?></label> <?php if ($req) _e('<span class="required">*</span>', 'your-theme') ?></div>
<div class="form-input"><input id="email" name="email" type="text" value="<?php echo $comment_author_email ?>" size="30" maxlength="50" tabindex="4" /></div>
</div><!-- #form-section-email .form-section -->
<div id="form-section-url" class="form-section">
<div class="form-label"><label for="url"><?php _e('Website', 'your-theme') ?></label></div>
<div class="form-input"><input id="url" name="url" type="text" value="<?php echo $comment_author_url ?>" size="30" maxlength="50" tabindex="5" /></div>
</div><!-- #form-section-url .form-section -->
<?php endif /* if ( $user_ID ) */ ?>
<div id="form-section-comment" class="form-section">
<div class="form-label"><label for="comment"><?php _e('Comment', 'your-theme') ?></label></div>
<div class="form-textarea"><textarea id="comment" name="comment" cols="45" rows="8" tabindex="6"></textarea></div>
</div><!-- #form-section-comment .form-section -->
<div id="form-allowed-tags" class="form-section">
<p><span><?php _e('You may use these <abbr title="HyperText Markup Language">HTML</abbr> tags and attributes:', 'your-theme') ?></span> <code><?php echo allowed_tags(); ?></code></p>
</div>
<?php do_action('comment_form', $post->ID); ?>
<div class="form-submit"><input id="submit" name="submit" type="submit" value="<?php _e('Post Comment', 'your-theme') ?>" tabindex="7" /><input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" /></div>
<?php comment_id_fields(); ?>
<?php /* Just … end everything. We're done here. Close it up. */ ?>
</form><!-- #commentform -->
</div><!-- .formcontainer -->
<?php endif /* if ( get_option('comment_registration') && !$user_ID ) */ ?>
</div><!-- #respond -->
<?php endif /* if ( 'open' == $post->comment_status ) */ ?>
<?php comment_form(); ?>
</div><!-- #comments -->
Now put the following code block into your page.php to activate the comments template into your pages:
<?php comments_template( '', true ); ?>
Hope, it will then act like you want. So think, you have to do some template CSS, as per the codes here.
functions.phpin your theme folder? If any, then is there any comments function mentioned there? For an easy way, I'd recommend you to open the default TwentyEleven or TwentyTwelve theme and do two things: (1) Copy thecomments.phpand paste that into your folder, and (2) Copy the comments-related codes from itsfunctions.phpand paste them into your pages. Now check whether it makes good to you. :)<?php comments_template( '', true ); ?>from yourpage.php(if you are referring to your Pages, not Posts). It will detach the comments template from your pages.