Site logo

Archived topic

Making "Leave a Comment" In WP A Paragraph Tag

7 replies · Started by Jodie on December 17, 2022

Viewing posts 1–8 of 8

Hi,

At the bottom of every post, I have a H3 which is "Leave a Comment"

How can I change this to be a "p" tag? Thanks for your help!

Cheers Jodie

Hi David,

Great, that worked, thank you!

Just a couple more questions.

1. How do I change the "Comments Title" to have a font size of 20px?
2. How do I change the h3 "Leave a Comment" to a p tag?
3. How do I remove the post title from the "Comments Title" and just have it say "Comments"?

Thanks for your help!

Cheers Jodie

1. In Customizer > Typography -> Add New Typography.
In the Target element list, select Custom and in the CSS Class field provided add: .comments-title
Then add the font style you require.

2. The reply-title is output in the core comment_form() function. But it too has filters :)
Add this snippet to change that


add_filter( 'comment_form_defaults', 'custom_reply_title' );
function custom_reply_title( $defaults ){
  $defaults['title_reply_before'] = '<p id="reply-title" class="comment-reply-title">';
  $defaults['title_reply_after'] = '</p>';
  return $defaults;
}

You can repeat answer #1 for this too, and use the class of: .comment-reply-title
If the styles for 1 and 2 are identical then just use one custom typography setting, and add both classes with a comma delimiter eg. .comments-title, .comment-reply-title

3. So the function from this doc you can change to:

add_filter( 'generate_comments_title_output', function( $output, $comments_title ) {
    $comments_title = 'Comments';
    return sprintf(
        '<p class="comments-title">%s</p>',
        esc_html( $comments_title )
    );
}, 10, 2 );

Hi Fernando,

Great, that worked! One more question please.

There's a big gap underneath "Comments" and the first comment. Any ideas on how to reduce this please?

Thanks for your help!

Cheers Jodie

Edit the Typography you set for the comments-title and give it a bottom margin value. Eg. 0.5em
As currently it being a <p> its attracting the 1.5em bottom margin for text.

Hi David,

That worked, thanks so much for your help!

Cheers Jodie

You're welcome

This archived topic is closed to new replies.