I want to make a pager for a custom wp_query where I can have a prev and a next.
I have a CPT called family and I must show the families that meet the condition that their status is Retained, important I must show only one family per page, and I must put the paginator to navigate one by one.
This is my code:
$paged = get_query_var( 'paged' ) ? absint( get_query_var( 'paged' ) ) : 1;
$args_families = array (
'post_type' => array( 'family' ),
'paged' => $paged,
'orderby' => 'ASC',
'posts_per_page' => 1,
'meta_query' => array(
array(
'key' => 'status',
'value' => 'Retained',
'compare' => '=',
)
)
);
$family_query = new WP_Query( $args_families );
<?php if ( $family_query->have_posts() ) : ?>
<?php while ( $family_query->have_posts() ) : ?>
<?php $family_query->the_post(); ?>
<?php
echo get_field('status'). '<br>';
echo ' '.'fid_'.get_field('family_id') . '<br>';
echo 'ID + ACF'.' '.'fid_'.get_field('family_id' , $family_query->posts[$i]->ID);
$f_link = 'fid_'.get_field('family_id' , $family_query->posts[$i]->ID);
?>
<h3> <?php echo esc_attr( get_the_title() ); ?></h3>
<?php $profile_pic = get_field( 'profile_picture' ); ?>
<img src="<?php echo esc_url( $profile_pic['sizes']['family_large_thumb'] ); ?>" width="300px" height="300px" style="display:block;" />
<!-- attempt 1 to create the pager -->
<a href="https://localhost/adoptionnetwork/adopting-families/fid_20074/">next1</a>
<a href="https://localhost/adoptionnetwork/adopting-families/<?php echo $f_link ?>">next2</a>
<?php
//attempt 1 to create the pager
$older_link = '<a href="/adoptionnetwork/adopting-families/fid_' . ( $paged - 1 ) . '" rel="prev"><</a>';
$newer_link = '<a href="/adoptionnetwork/adopting-families/fid_' . ( $paged + 1 ) . '" rel="next">></a>';
?>
<?php endwhile; ?>
<?php
// Clean up after the query and pagination.
wp_reset_postdata();
?>
But I have no idea how to create the pager for this case.
NOTE: NOTE: I already used these functions but they didn’t work.
get_next_post_link( '%link', '<i class="far fa-angle-right"></i>' );
get_previous_post_link( '%link', '<i class="far fa-angle-left"></i>' );
previous_post_link();
next_post_link();
Thanks for you help