Archived topic
Making "Leave a Comment" In WP A Paragraph Tag
7 replies · Started by Jodie on December 17, 2022
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 there,
this doc provides the PHP Snippet you require:
https://docs.generatepress.com/article/generate_comments_title_output/
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