PHP & JS · WORDPRESS GUTENBERG

post-navigation-block — Accessible Taxonomy-Aware Previous/Next Block for WordPress

post-navigation-block is a WordPress Gutenberg block that renders customizable Previous and Next post navigation links with thumbnail previews and keyboard arrow support. It supports strict same-category or custom-taxonomy traversal and outputs clean semantic HTML5 nav landmarks.

$ wp plugin activate post-navigation-block

GitHub ↗

SQL Query Cost 1 Indexed Lookup

Accessibility WCAG 2.1 AA <nav>

DOM Payload < 1.4 KB HTML

Same-Term Filter Category / Tag

Interactive Gutenberg Post Navigation Markup & ARIA Preview Adjacent Post Titles & Taxonomy Constraint Layout & Accessibility Preset

Deterministic Execution Output & Telemetry STATUS: READY // 0 ERRORS

PHP (Gutenberg Dynamic Render Callback)

function render_post_navigation_block( array $attributes ): string {
    $in_same_term = ! empty( $attributes['inSameTerm'] );
    $prev = get_previous_post( $in_same_term );
    $next = get_next_post( $in_same_term );
    ob_start(); ?>
    <nav class="wp-block-bhubbard-post-nav" aria-label="Post navigation">
        <?php if ( $prev ) : ?>
            <a rel="prev" href="<?php echo esc_url( get_permalink( $prev ) ); ?>">&larr; <?php echo esc_html( get_the_title( $prev ) ); ?></a>
        <?php endif; ?>
        <?php if ( $next ) : ?>
            <a rel="next" href="<?php echo esc_url( get_permalink( $next ) ); ?>"><?php echo esc_html( get_the_title( $next ) ); ?> &rarr;</a>
        <?php endif; ?>
    </nav>
    <?php return (string) ob_get_clean();
}

Production Engineering Specifications

Repository:    https://github.com/bhubbard/post-navigation-block
Live Studio:   https://code.brandonhubbard.com/post-navigation-block/
Portal:        https://code.brandonhubbard.com/
Install:       wp plugin activate post-navigation-block
Design System: Brandon Hubbard Swiss Modernist (#0A0A0C / 1px Exposed Structural Grid)