Single Post Template: Link to next and previous post

Hi Community,

I am aware of the “Post Navigation” block and how it can link to previous and next post. On my Single post template I would just like to have two buttons, which sends you to the previous post, and another button that sends you to the next one. Unfortunately i was not able to customise the navigation block to just show 1 link.

Therefor i’ve been seraching trough the communty forum and only found this post Custom Post Navigation Previous and Next Post Code/ Dynamic Content - #15 by Patric which is from 2023. I’ve been trying various approaches but I’m unable to get it to work. I did also add the echo function to the whitelist, but just as the final comment on the page, nothing seems to happen when i click my button.

Can someone help me out how to create a link to the previous post page, trough the button block?

Kind regards,

Martijn

As a start, it would help to see your code… Cheers Patric

Hi Patric, thanks so much for your reply! I used the code that you wrote in your post:

<?php 
function get_prev_and_next_post($arg) {
$prev_post = get_adjacent_post();
$next_post = get_adjacent_post(false,"", false);
if ( ! empty( $prev_post ) ):
switch ($arg) {
    case "pp_id": $returnarg = $prev_post->ID; break;
    case "pp_title": $returnarg = wp_trim_words( $prev_post->post_title, 6 ); break;
    case "pp_thumb": $returnarg = get_the_post_thumbnail_url( $prev_post->ID, 'thumbnail'); break;
    case "pp_link": $returnarg = get_permalink( $prev_post->ID ); break;
    }
endif;
if ( ! empty( $next_post ) ):
switch ($arg) {
    case "np_id": $returnarg = $next_post->ID; break;
    case "np_title": $returnarg = wp_trim_words( $next_post->post_title, 6 ); break;
    case "np_thumb": $returnarg = get_the_post_thumbnail_url( $next_post->ID, 'thumbnail'); break;
    case "np_link": $returnarg = get_permalink( $next_post->ID ); break;
    }
endif;  
   if ( ! empty( $returnarg ) ):
  return $returnarg;
  endif;
}

But that didn’t seem to work. In the meantime I was able to come up with a custom solution using Claude.ai: It doesn’t use the echo command but adds the pp_title, pp_link, pp_thumb, pp_id, np_title, np_link, np_thumb and np_id to the dynamic tags available in the bricks ui:

 
 // =============================================
 // Post Navigation Dynamic Data for Bricks
 // =============================================
 
 function get_nav_post_data($arg) {
     static $cache = [];
     
     $is_prev = str_starts_with($arg, 'pp_');
     $key     = $is_prev ? 'prev' : 'next';
 
     if ( ! isset($cache[$key]) ) {
         $cache[$key] = get_adjacent_post(false, '', $is_prev) ?: null;
     }
 
     $post = $cache[$key];
     if ( empty($post) ) return '';
 
     $type = substr($arg, 3);
     return match($type) {
         'id'    => $post->ID,
         'title' => wp_trim_words($post->post_title, 6),
         'thumb' => get_the_post_thumbnail_url($post->ID, 'thumbnail'),
         'link'  => get_permalink($post->ID),
         default => '',
     };
 }
 
 // Register tags in Bricks dynamic data dropdown
 add_filter('bricks/dynamic_tags_list', function($tags) {
     $new_tags = [
         ['name' => '{pp_title}', 'label' => 'Prev Post: Title',     'group' => 'WP Post Navigation'],
         ['name' => '{pp_link}',  'label' => 'Prev Post: Link',      'group' => 'WP Post Navigation'],
         ['name' => '{pp_thumb}', 'label' => 'Prev Post: Thumbnail', 'group' => 'WP Post Navigation'],
         ['name' => '{pp_id}',    'label' => 'Prev Post: ID',        'group' => 'WP Post Navigation'],
         ['name' => '{np_title}', 'label' => 'Next Post: Title',     'group' => 'WP Post Navigation'],
         ['name' => '{np_link}',  'label' => 'Next Post: Link',      'group' => 'WP Post Navigation'],
         ['name' => '{np_thumb}', 'label' => 'Next Post: Thumbnail', 'group' => 'WP Post Navigation'],
         ['name' => '{np_id}',    'label' => 'Next Post: ID',        'group' => 'WP Post Navigation'],
     ];
     return array_merge($tags, $new_tags);
 });
 
 // Render the tags on the frontend
 add_filter('bricks/dynamic_data/render_tag', function($tag, $post, $context) {
     $clean_tag = trim($tag, '{}');
     if ( str_starts_with($clean_tag, 'pp_') || str_starts_with($clean_tag, 'np_') ) {
         return get_nav_post_data($clean_tag);
     }
     return $tag;
 }, 10, 3);
 
 // Render tags inside content and URL fields
 add_filter('bricks/dynamic_data/render_content', function($content, $post, $context) {
     $tags = ['pp_title','pp_link','pp_thumb','pp_id','np_title','np_link','np_thumb','np_id'];
     foreach ($tags as $tag) {
         if ( str_contains($content, "{{$tag}}") ) {
             $content = str_replace("{{$tag}}", get_nav_post_data($tag), $content);
         }
     }
     return $content;
 }, 10, 3);

Posting it here in case someone else is looking for the same solution, hope it is helpfull.