[Support request] Styling Comments section with borders.

Home Forums Support [Support request] Styling Comments section with borders.

Home Forums Support Styling Comments section with borders.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #702809
    Sam

    Hi guys,

    how do i style the words “4 Comments” to do the following?

    1. I would like 4 and Comments to have separate classes – want style them separately.

    2. Currently, it is being output by the Say What plugin that Tom recommended.

    3. I would also like to add borders and margins to this 4 Comments class, but any styling i’ve done so far to target it has not worked.

    4. For example, trying .comments-area h3 {} has only resulted in the other elements being styled, while .comments-title h3 does not target the right element.

    Do let me know, thank you!

    GeneratePress 2.1.4
    GP Premium 1.7.2
    #703057
    David
    Staff
    Customer Support

    Hi there,

    You would need to copy the comments.php file from the parent theme and add it to your child theme and edit the template to make those changes.

    #703094
    Sam

    Hi David,

    Thank you for your response. May I know specifically what edits must I make to the file once I’ve added it from the parent theme?

    #703474
    Tom
    Lead Developer
    Lead Developer

    Right now it’s a bit of a pain to change that text.

    I added a filter in GP 2.2 which will make it much easier: https://github.com/tomusborne/generatepress/commit/28d3c2acd7685e053e1f4f0baf442dffb966b5bb

    You can make the above change to your comments.php file to take advantage of it right now if you’d like:

    add_filter( 'generate_comment_form_title', function() {
        $comments_number = get_comments_number();
    
        return sprintf( // WPCS: XSS OK.
            /* translators: 1: number of comments */
            esc_html( _nx(
                '<span class="comment-number">%1$s</span> <span class="comment-title-text">Comment</span>',
                '<span class="comment-number">%1$s</span> <span class="comment-title-text">Comments</span>',
                $comments_number,
                'comments title',
                'generatepress'
            ) ),
            number_format_i18n( $comments_number )
        );
    } );

    Then you could take advantage of the comment-number and comment-title-text classes.

    #703764
    Sam

    Hey Tom, thanks but it didn’t work. It just output the comments without classes at the bottom of the comment box.

    Wonder if there’s any other option, please?

    #704313
    Tom
    Lead Developer
    Lead Developer

    Did you make this change to the theme first?: https://github.com/tomusborne/generatepress/commit/28d3c2acd7685e053e1f4f0baf442dffb966b5bb

    Did you remove the code from your site? I’m not seeing any difference.

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.