Adding numbers to comments in wordpress

I’ve seen various sites using the built in wordpress comment system with a custom callback (to generate their own html different than that if the built in comments in wordpress) adding numbers to comments on their site.

Ala – http://mobile.smashingmagazine.com/2013/08/12/creating-high-performance-mobile-websites/

Read More

Each comment has a number beside it.
After doing a whole lot of searching I can’t find any built in function of wordpress that does this.

I’m using a custom calllback for my comments.

function mytheme_comment($comment, $args, $depth) {
        $GLOBALS['comment'] = $comment;
        extract($args, EXTR_SKIP);

        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">
                    <div class="rounded">
                        <?php if ($args['avatar_size'] != 0) echo get_avatar( $comment, $args['avatar_size'] ); ?>
                    </div> <!-- end div rounded -->

                </div> <!-- end div vcard -->
                <div class="comment-meta commentmetadata">

                    <?php printf(__('<cite class="fn">%s</cite> <span class="says"></span>'), get_comment_author_link()) ?>
                    <a href="<?php echo htmlspecialchars( get_comment_link( $comment->comment_ID ) ) ?>">
                        <?php

                            printf( __('%1$s at %2$s'), comment_time('F j, Y g:i a')) ?></a><?php edit_comment_link(__('(Edit)'),'  ','' ); 

                        ?>

                    </a>

                    <?php if ($comment->comment_approved == '0') : ?>
                        <em class="comment-awaiting-moderation">
                            <?php _e('Your comment is awaiting moderation.') ?>
                        </em>
                    <br />
                    <?php endif; ?> 
                </div> <!-- end div commentmetadata -->
                <div class="commentsholder">

                    <?php comment_text() ?>

                </div> <!-- end div commentsholder -->

                <div class="reply">
                    <?php comment_reply_link(array_merge( $args, array('add_below' => $add_below, 'depth' => $depth, 'max_depth' => $args['max_depth']))) ?>
                </div> <!-- end div reply -->

            <?php echo '<div style="clear:both"></div>' ?>
            <?php if ( 'div' != $args['style'] ) : ?>
        </div> <!-- end div commentid -->
        <?php endif; ?>
<?php
        }

Can anyone give me any idea how to number each comment?

Related posts

Leave a Reply

2 comments

  1. Look at the twentytwelve theme. It uses an ordered list.

    <ol class="commentlist">
        <?php wp_list_comments( array( 'callback' => 'twentytwelve_comment', 'style' => 'ol' ) ); ?>
    </ol><!-- .commentlist -->
    

    In the functions.php twentytwelve_comment function the comments are wrapped in a <li></li>.

    If your comments are on multiple pages or you want to style the numbers you could use a plugin like http://wordpress.org/plugins/gregs-threaded-comment-numbering/. Read here how to use it.

  2. I was exploring Alexander Kuzmin idea and I think that’s how Smashing Magazine is numbering their comments.

    It’s done in a linear fashion without caring if the comment is threaded or not.

    I tested in TwentyEleven, and manipulated the callback for wp_list_comments( array( 'callback' => 'twentyeleven_comment' ) );.

    In functions.php:

    $countcomm = 1;
    function twentyeleven_comment( $comment, $args, $depth ) 
    {
        global $countcomm; 
    
        // PRINT THE COMMENTS AND USE $countcomm TO ECHO THE NEW "COMMENT ID"
    
        // TAKING CARE OF THE COMMENT PERMALINK:
        // CHANGE ALL INSTANCES OF comment_ID() AND $comment->comment_ID
        // TO $countcomm
    
        $countcomm++;
    }