Title: Comment Layout
Last modified: February 5, 2021

---

# Comment Layout

 *  Resolved [parkinternet](https://wordpress.org/support/users/parkinternet/)
 * (@parkinternet)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/)
 * Can we add a button after “Leave a reply” like this [https://prnt.sc/ya6ba9](https://prnt.sc/ya6ba9).
   Such that users can easily navigate through it. (like – [https://kinsta.com/blog/wordpress-security](https://kinsta.com/blog/wordpress-security))
    -  This topic was modified 5 years, 3 months ago by [parkinternet](https://wordpress.org/support/users/parkinternet/).
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fcomment-layout-2%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 10 replies - 1 through 10 (of 10 total)

 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/#post-14009633)
 * It likely involves editing your theme’s comment template. If your theme is subject
   to updates you should use a child theme to contain altered templates.
 * On the template responsible for comments, there is typically code that outputs
   the comments title, followed by a call to `wp_list_comments()`. Between the two,
   output `<a href="#reply-title" class="jump-to-form">Leave a Comment</a>`.
 * Use CSS to style the link to appear as a button.
 *  Thread Starter [parkinternet](https://wordpress.org/support/users/parkinternet/)
 * (@parkinternet)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/#post-14015207)
 * I don’t have enough knowledge of php, can you provide me the code of php snippet,
   i can cutomize it’s css.
 * i tried this, but it doesn’t worked :-
 *     ```
       add_action('wp_list_comments',function(){
       echo '<a href="#reply-title">Leave a Comment</a>';
       });
       ```
   
    -  This reply was modified 5 years, 3 months ago by [parkinternet](https://wordpress.org/support/users/parkinternet/).
 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/#post-14015345)
 * You don’t need to know much of PHP beyond learning where to it’s safe to to insert
   HTML by closing a PHP block (with `?>`, after a PHP `;` is a good choice), then
   reopening the PHP block after your HTML (with `<?php`). Echoing out your HTML
   is also an option. I don’t know what your theme’s comment template looks like,
   so I cannot tell you exactly what to do beyond the anchor link needs to be output
   after “Leave a Reply” but before `wp_list_comments()` is called.
 * There’s presumably no action or filter hook to use, you just place the HTML anchor
   link right on your theme’s comment template. If it doesn’t end up where you thought
   it should, move it elsewhere. However, if your theme is subject to periodic updates,
   you should keep your altered template in a child theme.
 *  Thread Starter [parkinternet](https://wordpress.org/support/users/parkinternet/)
 * (@parkinternet)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/#post-14017938)
 * [https://test.papadrug.com/post1/](https://test.papadrug.com/post1/) this is 
   my website i want to place it into, can you please provide me php hook code for
   that? Please? You are only giving call function but i dont know how to jnsert
   that, can you please provide me full php hook for that?
 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/#post-14020259)
 * There is usually no hook available for the location you want to place the the
   button. Any such hook would be theme dependent. You probably need to edit the
   template file for comments. The function I mentioned should already be there,
   you just need to locate it and insert the desired anchor link above it. Mind 
   you, I’m largely guessing at what you should do. I have no idea what your theme
   template code looks like.
 *  Thread Starter [parkinternet](https://wordpress.org/support/users/parkinternet/)
 * (@parkinternet)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/#post-14025760)
 *     ```
       		<ol class="comment-list">
       			<?php
       			/*
       			 * Loop through and list the comments. Tell wp_list_comments()
       			 * to use generate_comment() to format the comments.
       			 * If you want to override this in a child theme, then you can
       			 * define generate_comment() and that will be used instead.
       			 * See generate_comment() in inc/template-tags.php for more.
       			 */
       			wp_list_comments(
       				array(
       					'callback' => 'generate_comment', 
       				)
       			);
       			?>
       		</ol><!-- .comment-list -->
   
       		<?php
       ```
   
 * This is my Php code that i found in comment.php (Can you suggest me where i have
   to put the hooks?)
 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/#post-14025984)
 * No hooks involved. Place something similar to the HTML that I offered earlier
   just above the first line (`<ol class="comment-list">`)
 *  Thread Starter [parkinternet](https://wordpress.org/support/users/parkinternet/)
 * (@parkinternet)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/#post-14028810)
 * [@bcworkz](https://wordpress.org/support/users/bcworkz/) I tried but it doesn’t
   worked, i am providing you all my comment.php code pls check :- whether i have
   to insert it :-
 *     ```
       <?php
       /**
        * The template for displaying Comments.
        *
        * The area of the page that contains both current comments
        * and the comment form. The actual display of comments is
        * handled by a callback to generate_comment() which is
        * located in the inc/template-tags.php file.
        *
        * @package GeneratePress
        */
   
       if ( ! defined( 'ABSPATH' ) ) {
       	exit; // Exit if accessed directly.
       }
   
       /*
        * If the current post is protected by a password and
        * the visitor has not yet entered the password we will
        * return early without loading the comments.
        */
       if ( post_password_required() ) {
       	return;
       }
   
       /**
        * generate_before_comments hook.
        *
        * @since 0.1
        */
       do_action( 'generate_before_comments' );
       ?>
       <div id="comments">
   
       	<?php
       	/**
       	 * generate_inside_comments hook.
       	 *
       	 * @since 1.3.47
       	 */
       	do_action( 'generate_inside_comments' );
   
       	if ( have_comments() ) :
       		$comments_number = get_comments_number();
       		$comments_title = apply_filters(
       			'generate_comment_form_title',
       			sprintf(
       				esc_html(
       					/* translators: 1: number of comments, 2: post title */
       					_nx(
       						'%1$s thought on &ldquo;%2$s&rdquo;',
       						'%1$s thoughts on &ldquo;%2$s&rdquo;',
       						$comments_number,
       						'comments title',
       						'generatepress'
       					)
       				),
       				number_format_i18n( $comments_number ),
       				get_the_title()
       			)
       		);
   
       		// phpcs:ignore -- Title escaped in output.
       		echo apply_filters(
       			'generate_comments_title_output',
       			sprintf(
       				'<h3 class="comments-title">%s</h3>',
       				esc_html( $comments_title )
       			),
       			$comments_title,
       			$comments_number
       		);
   
       		/**
       		 * generate_below_comments_title hook.
       		 *
       		 * @since 0.1
       		 */
       		do_action( 'generate_below_comments_title' );
   
       		if ( get_comment_pages_count() > 1 && get_option( 'page_comments' ) ) :
       			?>
       			<nav id="comment-nav-above" class="comment-navigation" role="navigation">
       				<h2 class="screen-reader-text"><?php esc_html_e( 'Comment navigation', 'generatepress' ); ?></h2>
       				<div class="nav-previous"><?php previous_comments_link( __( '&larr; Older Comments', 'generatepress' ) ); ?></div>
       				<div class="nav-next"><?php next_comments_link( __( 'Newer Comments &rarr;', 'generatepress' ) ); ?></div>
       			</nav><!-- #comment-nav-above -->
       		<?php endif; ?>
       		<ol class="comment-list">
       			<?php
       			/*
       			 * Loop through and list the comments. Tell wp_list_comments()
       			 * to use generate_comment() to format the comments.
       			 * If you want to override this in a child theme, then you can
       			 * define generate_comment() and that will be used instead.
       			 * See generate_comment() in inc/template-tags.php for more.
       			 */
       			wp_list_comments(
       				array(
       					'callback' => 'generate_comment', 
       				)
       			);
       			?>
       		</ol><!-- .comment-list -->
   
       		<?php
       		if ( get_comment_pages_count() > 1 && get_option( 'page_comments' ) ) :
       			?>
       			<nav id="comment-nav-below" class="comment-navigation" role="navigation">
       				<h2 class="screen-reader-text"><?php esc_html_e( 'Comment navigation', 'generatepress' ); ?></h2>
       				<div class="nav-previous"><?php previous_comments_link( __( '&larr; Older Comments', 'generatepress' ) ); ?></div>
       				<div class="nav-next"><?php next_comments_link( __( 'Newer Comments &rarr;', 'generatepress' ) ); ?></div>
       			</nav><!-- #comment-nav-below -->
       			<?php
       		endif;
   
       	endif;
   
       	// phpcs:ignore WordPress.PHP.StrictComparisons.LooseComparison
       	if ( ! comments_open() && '0' != get_comments_number() && post_type_supports( get_post_type(), 'comments' ) ) :
       		?>
       		<p class="no-comments"><?php esc_html_e( 'Comments are closed.', 'generatepress' ); ?></p>
       		<?php
       	endif;
   
       	comment_form();
       	?>
   
       </div><!-- #comments -->
       ```
   
 *  Moderator [bcworkz](https://wordpress.org/support/users/bcworkz/)
 * (@bcworkz)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/#post-14037230)
 * Oh! There is an action hook that can be used. That’s a bit unusual, how thoughtful
   of the theme authors 🙂
    On functions.php, unless there’s a better place suggested
   by theme authors, add this:
 *     ```
       add_action('generate_below_comments_title', function(){
          echo '<a href="#reply-title" class="jump-to-form">Leave a Comment</a>';
       });
       ```
   
 * It will appear as a plain link at first. You’ll need additional CSS to make it
   appear like a button and be positioned as you like.
 *  Thread Starter [parkinternet](https://wordpress.org/support/users/parkinternet/)
 * (@parkinternet)
 * [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/#post-14040062)
 * Thnaks Sir great service can you please solve my another issue? i will be highly
   grateful to you.. Another Topic link – [https://wordpress.org/support/topic/image-css/](https://wordpress.org/support/topic/image-css/)

Viewing 10 replies - 1 through 10 (of 10 total)

The topic ‘Comment Layout’ is closed to new replies.

## Tags

 * [button](https://wordpress.org/support/topic-tag/button/)
 * [comment](https://wordpress.org/support/topic-tag/comment/)
 * [comment button](https://wordpress.org/support/topic-tag/comment-button/)

 * In: [Developing with WordPress](https://wordpress.org/support/forum/wp-advanced/)
 * 10 replies
 * 2 participants
 * Last reply from: [parkinternet](https://wordpress.org/support/users/parkinternet/)
 * Last activity: [5 years, 3 months ago](https://wordpress.org/support/topic/comment-layout-2/#post-14040062)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics
