Description

The idea of this issue is to end up with a Comments Loop Block (name may change) that loops over the comments of a given post. This would be similar to the Query Loop used for posts. Users should be able to define and change the layout of the post comments directly from the Gutenberg editor, and both the editor and the frontend should match.

This is how the different comment blocks should look like:

https://excalidraw.com/#json=6537760064143360,EgfZIljXt2SI2DTSFebHQQ

Existing Solution / Workaround

Right now, there are two similar blocks:

• Post Comments block: This block currently renders the comments.php file of the PHP theme in the frontend and a loop of paragraphs in the editor. This way, the editor and the frontend are different and users aren't able to change the layout unless they change the PHP code.
• Post Comment block: This block allows users to insert a specific comment by ID in their posts/pages and edit the layout including other blocks like Post Comment Author, Post Comment Content or Post Comment Date. However, it isn't possible to loop through all the comments of a specific post.

Tasks

These are the steps we should follow to finish the tracking issue:

Please note that I'll be adding the relevant issues once they are created.

• The Comments Query Loop block (Comments Query Loop block #34996). This should be similar to the Query Loop used for posts.
• The Comments Template block (Comments Template block #35000). This contains the block elements used to render a comment specified below, like the date, content or author. It should be similar to the Post Template block.
• Initial block elements for comments:
  • Comment Author (Comment Author Block #30572)
  • Comment Date (Comment Date Block #30573)
  • Comment Content (Comment Content Block #30574)
  • Comment Author Gravatar (Comment Author Gravatar Block #30575)
  • Comment Reply Link (Comment Reply Link Block #30576)
  • Edit Comment link (Edit Comment Link Block #30577)
• Comments Pagination (Post Comments Pagination block #35007). It should be similar to the Query Pagination block.
  • Comments Pagination Next (Post Comments Pagination Next block #35008). Similar to the Query Pagination Next block.
  • Comments Pagination Previous (Post Comments Pagination Previous block #35009). Similar to the Query Pagination Previous block.
  • Comments Pagination Numbers (Post Comments Pagination Numbers block #35010). Similar to the Query Pagination Numbers block.

Out of scope

There are some functionalities that could be nice to work on but that won't be covered in this tracking issue, although they may be addressed later in the future:

• Comments Form: There is an already working Post Comments Form block, that allows users to leave a reply. Just adding the Reply Link block pointing to this form should be enough for now.
• Comments Metadata: It could be nice to create a block to show any meta data added for the comments in the future.
• Comments Status: It could also make sense to create a block to show the status of the comments (approved, pending...), specially when they are submitted.

Questions

• Once this is done, should we deprecate the existing Post Comments block?
• As explained previously, there are already working blocks for the Post Comment Author, Post Comment Date, Post Comment Content that are used for the Post Comment Block. I guess we could work on the existing ones right? Or would it be better to create new ones for this purpose?
• It seems to me that, while working on the Block Elements, we should keep in mind that they should also work fine for the Post Comment Block right?
• Once the Comments Loop block is finished, should we even deprecate the Post Comment Block and create a setting in the loop to select just an id?
• I feel that, as already pointed in other issues, it would be better to have two different blocks for the Comment Author and the Comment Author Avatar. However, right now in the posts, the Avatar is just a setting in the Post Author block. Is there any reason to not create two different blocks?
• Should we create in the future different block elements for the Comments Form block as well to be able to edit its layout?
• Anything else you think we should address and not covered here?

Of course, any feedback apart from these questions is more than welcome 🙂

Previous work

There has been already some work done related to the Comments Block that was tracked in this issue → #24101