Post Navigation Link Block

Go back to the list of Blocks

Use the Post Navigation Link block to display the post pages link navigation for the previous and next pages.

WordPress block editor with a post navigation link block selected

Click the (+) icon to open the block inserter pop-up window and search for the Next post or Previous post blocks.

A demonstration how to add the post navigation link block

You can also use the keyboard shortcut /next-post or /previous-post to quickly insert a preferred Post Navigation Link block.

Detailed instructions on adding blocks can be found here.

Block toolbar

To view the block toolbar, click on the block, and the toolbar will be displayed.

Every block comes with unique toolbar icons. These block-specific controls allow you to manipulate the block right in the editor.

Both the Previous post and Next post blocks show five buttons in the block toolbar:

Block toolbar for the post navigation link block
  • Transform to
  • Drag
  • Move up/down
  • Change text alignment
  • Options

Transform to

The transform button on the post navigation link block toolbar

Click on the Transform button to convert the Post Navigation Link blocks into Columns or Group blocks.  

Drag icon

The draf icon on the post navigation link block toolbar

To drag and drop the block to a new location on the page template, click and hold the rectangle of dots, then drag it to the new location. The blue separator line indicates where the block will be placed. Release the left mouse button when you find the new location to place the block.

Move arrows

The move arrows on the post navigation link block toolbar

The up and down arrow icons can be used to move the block up and down on the page.

Detailed instructions on moving a block within the editor can be found here

Change text alignment

Change alignment tool on the post navigation link block toolbar

Use the change text alignment tool to change the text alignment for the Post Navigation Link blocks. The following is a list of the block width options:

  • Align text left
  • Align text center
  • Align text right

Options

Options button on the post navigation link block toolbar

Options on a block toolbar gives you more features to customize the block.

  • Show/Hide more settings opens or closes the block settings panel on the editor’s sidebar. Its functionality is similar to clicking the cog icon next to the Publish button.
  • Copy block adds the Post Navigation link block to the clipboard. Then, you can paste it anywhere you want in the block editor. 
  • Duplicate creates a copy of the selected block that appears after the current block.
  • Insert Before inserts a new block before the selected block(s).
  • Insert After inserts a new block after the selected block(s).
  • Move to lets you use a blue line on the editor to indicate the new position for the selected block. Use your keyboard’s up and down arrows to move the blue line. When the line is in the desired position, press Enter to move the selected block to that position.
  • Group allows you to create a group of blocks and treat them as a unit. You can, for instance, add a common background color or other blocks to the group.
  • Remove Post Navigation Link deletes the selected block from the content.

Block Settings

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.

Settings button on the WordPress block editor interface

Here are the options for the Post Navigation Link block:

Settings

Click Transform to variation to convert the Next post or Previous post blocks to their opposite blocks.

Drop-down menu to transform the post navigation link block variation

It’s also possible to display the title as a link, or include the label as part of the link:

Previous post block settings, showing the options to display the title as a link and include the label as part of the link

Typography

The Post Navigation Link block provides typography settings to change the font size, appearance, line height, letter case, and letter spacing.

For details, refer to this support article: Typography settings overview

Advanced

The Advanced tab lets you add CSS class(es) to your block. This will allow you to write custom CSS and styles for the block. 

Additional CSS settings for the post navigation link block

Changelog

  • Created 2022-12-14

Was this article helpful? How could it be improved?

First published

Last updated