{"id":15881853,"date":"2022-08-02T16:51:03","date_gmt":"2022-08-02T16:51:03","guid":{"rendered":"https:\/\/wordpress.org\/support\/?post_type=helphub_article&p=15881853"},"modified":"2024-06-06T13:51:10","modified_gmt":"2024-06-06T13:51:10","slug":"comment-pagination-block","status":"publish","type":"helphub_article","link":"https:\/\/wordpress.org\/documentation\/article\/comment-pagination-block\/","title":{"rendered":"Comments Pagination block"},"content":{"rendered":"\n
Go to the List of Blocks<\/a><\/p>\n\n\n\n The Comments Pagination<\/em> block is part of the Comments block that displays paginated navigation to the previous or next comment sections. You can only insert the\u00a0Comments Pagination <\/em>block<\/em>\u00a0inside a Comments block.\u00a0<\/p>\n\n\n\n To add the block, select the Comments block and hover your mouse over a blank space. Click the (+) icon to open the block inserter pop-up window. Look for the Comments Pagination<\/em> block using the search bar and click on the block icon to add it to the Comments block.<\/p>\n\n\n\n Alternatively, add a Paragraph block within the Comments block and type \/comments-pagination to insert the Comments Pagination<\/em> block.<\/p>\n\n\n\n Detailed instructions on adding blocks<\/a><\/p>\n\n\n\n The block toolbar<\/em> contains tools to customize each block on the editor quickly. The Comments Pagination<\/em> block has the following tools:<\/p>\n\n\n\n The Select Comments tool lets highlight the Comment Pagination<\/em>\u2019s parent block, which is the Comments block.<\/p>\n\n\n\n You can transform a Comment Pagination block<\/em> into a Columns, or a Group block. <\/p>\n\n\n\n The block-moving tools allow you to move the block up and down the editor. Use the six dots icon to drag and drop the Comments Pagination<\/em> block and place it anywhere on the Comments block. Alternatively, click on the up and down arrows to move the block up or down.<\/p>\n\n\n\n <\/a>Get more information about moving a block within the editor.<\/a><\/p>\n\n\n\n The change items justification <\/em>tool lets you change the horizontal placement of the items inside the Comment Pagination<\/em> block. There are four options to choose from:<\/p>\n\n\n\n The change vertical alignment <\/em>tool lets you choose the vertical position of the items inside the Comments Pagination<\/em> block. You can choose between top, middle, and bottom vertical alignment.<\/p>\n\n\n\n Unlike the previous alignment tools, the change alignment<\/em> tool is used for the Comments Pagination<\/em> block\u2019s position inside the Comments block. Choose one of the following block alignment options:<\/p>\n\n\n\n These controls give you the option to copy, duplicate, and edit your block as HTML.<\/p>\n\n\n\n <\/a>Read about these and other settings.<\/a><\/p>\n\n\n\n The block settings panel contains customization options specific to the block. To open it, select the block and click the cog icon next to the Publish button.<\/p>\n\n\n\n Here are the options for the Comments Pagination<\/em> block:<\/p>\n\n\n\n In the layout section, you will find the following customization options:<\/p>\n\n\n\n The settings section shows three options for a decorative arrow to the next and previous comments link. Here are the options:<\/p>\n\n\n\n The color section lets you customize the text, background, and link color for the Comments Pagination block. Click on any of the options to change the color, and a pop-up to pick a color will appear. Choose from the default color or click the upper rectangle area to pick a custom color using the color picker.<\/p>\n\n\n\n <\/a>Read about these and other settings.<\/a><\/p>\n\n\n\n The Typography settings enable you to customize the font and text appearance of the content within the Comments Pagination <\/em>block. The settings have various options, such as font size, font style, font family, and letter spacing.<\/p>\n\n\n\n Learn more about the Typography settings.<\/a><\/p>\n\n\n\n The \u201cAdvanced\u201d tab lets you add CSS class(es) to your block. This will allow you to write custom CSS and styles to the block.<\/p>\n\n\n\n The Comments Pagination<\/em> block consists of the following three inner blocks (which can\u2019t be inserted on their own):<\/p>\n\n\n\n The Comments Previous Page block <\/em>displays the previous posts page link. <\/p>\n\n\n\n The Comments Page Numbers <\/strong>block <\/em>displays a list of page numbers for pagination. <\/p>\n\n\n\n The Comments Next Page block <\/em>displays the next posts page link.<\/p>\n\n\n\n All these blocks are located inside a Comments block and lets you customize the appearance of the pagination.<\/p>\n\n\n\n The block toolbar for all the Comments Pagination<\/em> inner blocks – Comments Previous Page, Comments Page Numbers, and Comments Next Page contains the tools to customize each block. <\/p>\n\n\n\n Use the block-moving tools to move the block up and down inside the editor. Use the six dots icon to drag and drop the block and reposition it anywhere on the editor. Alternatively, click on the up and down arrows to move the block up or down the editor.<\/p>\n\n\n\n Page Numbers, Next Page and Previous page blocks share the same functionality for more block options button. Click on the three dots icon to show more options and a drop-down menu will appear.<\/p>\n\n\n\n The block settings panel contains customization options specific to the block. To open it, select the block and click the Settings<\/strong> panel icon next to the Publish<\/strong> or Update<\/strong> button.<\/p>\n\n\n\n Here are the options for the Comments Pagination<\/em> inner blocks.<\/p>\n\n\n\n The Comments Pagination<\/em> inner blocks – Comments Previous Page, Comments Page Numbers, and Comments Next Page <\/strong>provides color settings option to add background color.<\/p>\n\n\n\n For details refer to this support article: Color settings overview<\/a><\/p>\n\n\n\n The Comments Pagination<\/em> inner blocks – Comments Previous Page, Comments Page Numbers, and Comments Next Page provides typography settings to change the font family, appearance, line height, letter spacing, decoration, letter case, and font size. <\/p>\n\n\n\n
By default, a Comments Pagination<\/em> block is included when you insert a Comments block. However, you can still add this block manually.<\/p>\n\n\n\n<\/figure>\n\n\n\n
<\/figure>\n\n\n\n
Block toolbar<\/h2>\n\n\n\n
Select comments block<\/h3>\n\n\n\n
<\/figure>\n\n\n\n
Transform to<\/h3>\n\n\n\n
<\/figure>\n\n\n\n
Block-moving tools<\/h3>\n\n\n\n
<\/figure>\n\n\n\n
Change items justification<\/h3>\n\n\n\n
<\/figure>\n\n\n\n
\n
Change vertical alignment<\/h3>\n\n\n\n
<\/figure>\n\n\n\n
Change alignment<\/h3>\n\n\n\n
<\/figure>\n\n\n\n
\n
More options<\/h3>\n\n\n\n
<\/figure>\n\n\n\n
Block settings<\/h2>\n\n\n\n
Layout <\/h3>\n\n\n\n
<\/figure>\n\n\n\n
\n
Settings<\/h3>\n\n\n\n
<\/figure>\n\n\n\n
\n
Color <\/h3>\n\n\n\n
<\/figure>\n\n\n\n
Typography<\/h3>\n\n\n\n
<\/figure>\n\n\n\n
Advanced<\/h3>\n\n\n\n
Comments Pagination inner blocks <\/h2>\n\n\n\n
\n
Block toolbar<\/h3>\n\n\n\n
<\/figure>\n\n\n\n
Block-moving tools<\/h4>\n\n\n\n
<\/figure>\n\n\n\n
More options<\/h4>\n\n\n\n
<\/p>\n\n\n\n
Block settings<\/h3>\n\n\n\n
Color<\/h4>\n\n\n\n
Typography<\/h4>\n\n\n\n