Customising the comment form for a wordpress blog

I have been trying to figuire this out all evening and can’t make sense and am not really sure what to search for on search engines. I am pretty much a noob at wordpress. I know HTML, CSS and I can customise a basic WP template, it’s just this last bit on the comments area that I need to customise which I am having trouble with.

This is what I have in my comments.php in my theme

[INDENT]<?php
/**

  • The template for displaying Comments.
  • The area of the page that contains both current comments
  • and the comment form. The actual display of comments is
  • handled by a callback to twentyten_comment which is
  • located in the functions.php file.
  • @package WordPress
  • @subpackage Twenty_Ten
  • @since Twenty Ten 1.0
    */
    ?>

<div id=“comments”>
<?php if ( post_password_required() ) : ?>
<p class=“nopassword”><?php _e( ‘This post is password protected. Enter the password to view any comments.’, ‘twentyten’ ); ?></p>
</div><!-- #comments –>
<?php
/* Stop the rest of comments.php from being processed,

  • but don’t kill the script entirely – we still have
  • to fully load the template.
    */
    return;
    endif;
    ?>

<?php
// You can start editing here – including this comment!
?>

<?php if ( have_comments() ) : ?>

<tr><td class=“comment-responses”><?php
printf( _n( ‘One Response to %2$s’, ‘%1$s Responses to %2$s’, get_comments_number(), ‘twentyten’ ),
number_format_i18n( get_comments_number() ), ‘<em>’ . get_the_title() . ‘</em>’ );
?></td></tr>
<!–comments–><tr><td class=“maincontent_postcomments”>
<div>
<?php wp_list_comments(‘callback=mytheme_comment’); ?>
</div>

					&lt;/td&gt;&lt;/tr&gt;		&lt;!--endcomments--&gt;

<?php if ( get_comment_pages_count() > 1 && get_option( ‘page_comments’ ) ) : // Are there comments to navigate through? ?>

&lt;!--pagination--&gt;&lt;tr&gt;&lt;td class="comments-pagination-td"&gt;&lt;div class="comments-pagination"&gt;&lt;?php previous_comments_link( __( '&lt;' ) ); ?&gt;&lt;/div&gt;&lt;div class="comments-pagination"&gt;&lt;?php next_comments_link( __( '&gt;' ) ); ?&gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;					

<?php endif; // check for comment navigation ?>

<?php else : // or, if we don’t have comments:

if ( ! comments_open() ) :
?>
<p class=“nocomments”><?php _e( ‘Comments are closed.’ ); ?></p>
<?php endif; // end ! comments_open() ?>

<?php endif; // end have_comments() ?>

					&lt;!--commentform--&gt;&lt;tr&gt;&lt;td class="comment-form"&gt;

<?php comment_form_title( ‘Leave a Reply’ ); ?>

<?php comment_form( $args, $post_id ); ?>

					&lt;div&gt;&lt;/div&gt;[/INDENT]

This is how it looks on my wordpress blog: The site is up… | Lucinda

I have managged to customise the comments_list with a callback that I customised in the functions.php file which is in the themes folder.

I have been trying to do something similar with the comment_form because you can see how it looks at the moment - the default look.

So, my question is do you also use a ‘function thing’ for this, like you do with the comments_list ? because the way I managed to code that to how I like is because I used the default function for the comments_list and took the tags(I don’t know if that’s what theyre called, but anyway - the codes like ‘<?php comment_text(); ?>’

This is how the area of my functions.php for the comments_list looks

[INDENT]function mytheme_comment( $comment, $args, $depth ) {
$GLOBALS[‘comment’] = $comment;
switch ( $comment->comment_type ) :
case ‘’ :
?>
<!–comments–> <tr><td class=“maincontent_postcomments”><div>
<div class=“comments_datenameedit”><?php
/* translators: 1: date, 2: time */
printf( __( ‘%1$s’, ‘twentyten’ ), get_comment_date(), get_comment_time() ); ?></div>
<div class=“comments_datenameedit”><?php printf( __( ‘Comment by %s’ ), sprintf( ‘%s’, get_comment_author_link() ) ); ?></a></div>
<div class=“comments_datenameedit”><a href=“http://”><?php edit_comment_link( __( ‘(Edit)’, ‘twentyten’ ), ’ ’ );
?></a></div>
<div class=“comments_comment”><?php comment_text(); ?></div>

<div class=“comments_datenameedit”><a href=“http://”><?php comment_reply_link( array_merge( $args, array( ‘depth’ => $depth, ‘max_depth’ => $args[‘max_depth’] ) ) ); ?></a></div>

</div>

					&lt;/td&gt;&lt;/tr&gt;	&lt;!-- #comment-##  --&gt;[/INDENT]

I get confused because in the codex files it says that the source is in wp-includes but I need to have the customisation of it in the theme folder obviously - I just don’t know how to do it.

Because I have customised the rest of the template, I’m sure I could learn how to do it.

Thanks for any help

Hi luc9999. Are you just trying to style the comment form differently? That can be done purely via CSS. Reading your post, it wasn’t quite clear (to me at least) what you are asking here.

PS: TBH, I really think your site is too wide. Even on my big screen, the browser is not set to a width of 1300px.

No, neither was I really. But after reading a tutorial I managed to make it work.

I just swapped this code in comments.php

<?php comment_form(); ?>

for this:

[INDENT]<?php if(comments_open()) : ?>
<?php if(get_option(‘comment_registration’) && !$user_ID) : ?>
<p>You must be <a href=“<?php echo get_option(‘siteurl’); ?>/wp-login.php?redirect_to=<?php echo urlencode(get_permalink()); ?>”>logged in</a> to post a comment.</p><?php else : ?>
<form action=“<?php echo get_option(‘siteurl’); ?>/wp-comments-post.php” method=“post” id=“commentform”>
<?php if($user_ID) : ?>
<p>Logged in as <a href=“<?php echo get_option(‘siteurl’); ?>/wp-admin/profile.php”><?php echo $user_identity; ?></a>. <a href=“<?php echo get_option(‘siteurl’); ?>/wp-login.php?action=logout” title=“Log out of this account”>Log out »</a></p>
<?php else : ?>
<p><input type=“text” name=“author” id=“author” value=“<?php echo $comment_author; ?>” size=“22” tabindex=“1” />
<label for=“author”><small>Name <?php if($req) echo “(required)”; ?></small></label></p>
<p><input type=“text” name=“email” id=“email” value=“<?php echo $comment_author_email; ?>” size=“22” tabindex=“2” />
<label for=“email”><small>Mail (will not be published) <?php if($req) echo “(required)”; ?></small></label></p>
<p><input type=“text” name=“url” id=“url” value=“<?php echo $comment_author_url; ?>” size=“22” tabindex=“3” />
<label for=“url”><small>Website</small></label></p>
<?php endif; ?>
<p><textarea name=“comment” id=“comment” cols=“100%” rows=“10” tabindex=“4”></textarea></p>
<p><input name=“submit” type=“submit” id=“submit” tabindex=“5” value=“Submit Comment” />
<input type=“hidden” name=“comment_post_ID” value=“<?php echo $id; ?>” /></p>
<?php do_action(‘comment_form’, $post->ID); ?>
</form>
<?php endif; ?>
<?php else : ?>
<p>The comments are closed.</p>
<?php endif; ?>
[/INDENT]

And it has worked - because now I can control how the comments area looks. But now my quesrion is I thought that the first tag: <?php comment_form(); ?> was put there to make it simpler and you do the customisation in another file?

Thaks for your reply anyway.

The comment_form() function in the [WP install dir]/wp-includes/comments-template.php will run by default. Since modifying this particular file is generally not a good idea (since any WP updates will erase any changes you make) the idea behind the tutorial you mentioned is to centralize all customizations to the [WP install dir]/wp-content/themes/[your_theme] folder (which is unaffected by any WP updates – unless you are customizing a default theme such as twenty_ten).

OK, so the way the code is now is best? Why did the developers make it like that? Why didn’t they make it easier to customise the comments form?

Thanks for your help

In the past, I just made my own copy of the comment_form() function in my theme’s functions.php.

Then, you can either rename the function (and all change all references to the old function by changing it to the new function’s name) or simply comment out the old function in the comments-template.php and do a:

if(!function_exists('comment_form'){
  // paste your own version of the function here
}else{
  // WP has been updated which uncommented the old function - remind yourself somehow to re-comment out the old function
}

Unless you have decent understanding of PHP, I would stick with the tutorial you mentioned earlier (assuming it works).

After testing this out I found the better way to centralize your comment form changes/formatting would be to:

  • Make a copy of the comment_form() function in the comments-template.php file
  • Paste it in your theme’s functions.php + rename it (eg. my_comment_form())
  • Redirect the comments.php file to use your new function by changing the last line from <?php comment_form(); ?> to <?php my_comment_form(); ?>

Now any changes you make to your my_comment_form() will not be lost whenever you update WordPress.