WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Nested Comments CSS Help (11 posts)

  1. core-basic
    Blocked
    Posted 1 year ago #

    This is sort of a broad question. I apologize if I am in the wrong spot.

    Let me start by saying this. Yes, I have nested comments enabled. I was using a custom callback and it worked absolutely fine, but I'm a minimalist. I like to add as little extra as I possibly need to.

    My first question is, will nested comments work without a custom callback? And second, what are the classes that control each aspect of the nested comments. I know about .byuser, .bypostauthor, and .comment-author-name. But I haven't been able to get .bypostauthor to work.

    I am using

    <?php wp_list_comments(); ?>

    and

    <?php comment_form(); ?>

    This is a custom theme.

    Thanks in advance.

  2. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    will nested comments work without a custom callback?

    they should work; wp_list_comments() shold take care of that.

    what are the classes that control each aspect of the nested comments

    you will possibly need to use a browser inspaection tool to check this in a test site.

    the default aoutput by wp_list_comments() uses comment_class() to genrate some css classes; http://codex.wordpress.org/Function_Reference/comment_class

    I haven't been able to get .bypostauthor to work.

    possibly depends on the individual case; for instance, are your styles specific enough?

  3. core-basic
    Blocked
    Posted 1 year ago #

    So there's not somewhere I can read about WP default classes for wp_list_comments? Is comment_class automatically applied when using wp_list_comments? I can inspect it like you say, but there has to be php somewhere telling classes what to be because some of the class names in firebug definitely aren't correct.

    Plus inspecting doesn't fill me in on all possible classes. Does anyone know the classes associated with wp_list_comments()?

    Thanks.

  4. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    Is comment_class automatically applied when using wp_list_comments?

    yes - see the default code used by wp_list_comments() in /wp-includes/comment-template.php from line 1393: protected function comment( $comment, $depth, $args ) { ...

    there has to be php somewhere telling classes what to be

    yes, that is the comment_class() function, also in /wp-includes/comment-template.php, from line 299: function get_comment_class( $class = '', $comment_id = null, $post_id = null ) { ....

  5. core-basic
    Blocked
    Posted 1 year ago #

    Thanks alchymyth, in a way you pointed me in the direction I needed to go in.

    If it helps anyone else here are five classes I know of that affect nested comments.

    /* styles odd numbered comments */
    li.odd {
    background: #EEE;
    }
    
    /* styles even numbered comments */
    li.even {
    background: #FFF;
    }
    
    /* styles post author comments */
    li.bypostauthor {
    background: #00ee00;
    }
    
    /* styles threaded comments */
    ul.children{
    padding: 0 0 0 15px;
    }

    The ul.children is the big one. This is how you define how your threaded comments will look.

    If there are better ways to define or use these classes I'd really like to know.

  6. Jose Castaneda
    Member
    Posted 1 year ago #

    WordPress also add the depth class to the comments.

  7. core-basic
    Blocked
    Posted 1 year ago #

    How does the depth class work?

  8. Jose Castaneda
    Member
    Posted 1 year ago #

    Depending on the depth you choose it adds that class. So let's say I chose to have a nested setting of 4. It will add .depth-1, .depth-2 and so on. Nice to have Sometimes. Even better when you combine classes:

    /* List item with comment class and depth-2 */
    li.comment.depth-2 {
    color: #eee;
    padding-left: 20px;
    font-family: serif;
    }

    Mind you that is specific CSS targeting. ;)

  9. core-basic
    Blocked
    Posted 1 year ago #

    Jose, that's awesome! Thank you both for the great information. I'm marking this resolved.

  10. core-basic
    Blocked
    Posted 1 year ago #

    Turns out i've got one last question. What is the thread-alt class used for?

  11. Jose Castaneda
    Member
    Posted 1 year ago #

    The alt class I used just like the odd/even only it gets applied for the 'alt'ernate thread, I believe. Don't quote me on that since I myself am not 100% sure.

Topic Closed

This topic has been closed to new replies.

About this Topic