How can I change the output display of my pagination? I have been trying for the past few hours to format the output of my pagination links (1,2,3, etc.) to resemble the below:
I have been unable to modify the code to get it even close to this. Could someone please point me in the right direction of what I need to be doing?
Here is my code:
<?php
if ( get_query_var( 'paged' ) ) {
$paged = get_query_var('paged');
}elseif( get_query_var( 'page' ) ) {
$paged = get_query_var( 'page' );
}else{
$paged = 1;
}
$per_page = 3;
$number_of_terms = wp_count_terms( 'series' ); // This counts the total number terms in the taxonomy with a function)
$paged_offset = ($paged - 1) * $per_page;
$args = array(
'orderby' => 'ID',
'order' => 'DESC',
'hide_empty' => 0,
'number' => $per_page,
'offset' => $paged_offset
);
$terms = get_terms('series', $args);
foreach($terms as $term){ ?>
<div class="block_item article">
<div class="article_image" style="background: url('<?php the_field('series_artwork', $term); ?>'); background-size: cover; background-position: 50%;"></div>
<h4 class="section_label"><?php the_field('date', $term); ?></h4>
<div class="block_item_content">
<h3><?php echo $term->name; ?></h3>
<p><?php echo $term->description; ?></p>
<a href="<?php echo get_term_link($term->slug, 'series'); ?>" class="button_styling">
Read More
</a>
</div>
</div>
<?php }
$big = 999999999; // need an unlikely integer
echo paginate_links(
array(
'before_page_number' => '<div class="pagination"><span>Page '. $paged .' of ' . $term->max_num_pages . '</span></div>',
'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
'format' => '/page/%#%',
'current' => max( 1, get_query_var('paged') ),
'total' => ceil( $number_of_terms / $per_page ),
'prev_text' => __(''),
'next_text' => __('')
)
);
?>
If you can get it to work with my existing function (something I have been trying to do) then bonus points to you!
functions.php
// numbered pagination
function pagination($pages = '', $range = 4)
{
$showitems = ($range * 2)+1;
global $paged;
if(empty($paged)) $paged = 1;
if($pages == '')
{
global $wp_query;
$pages = $wp_query->max_num_pages;
if(!$pages)
{
$pages = 1;
}
}
if(1 != $pages)
{
echo "<div class=\"pagination\"><span>Page ".$paged." of ".$pages."</span>";
if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo "<a href='".get_pagenum_link(1)."'>« First</a>";
if($paged > 1 && $showitems < $pages) echo "<a href='".get_pagenum_link($paged - 1)."'>‹ Previous</a>";
for ($i=1; $i <= $pages; $i++)
{
if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ))
{
echo ($paged == $i)? "<span class=\"current\">".$i."</span>":"<a href='".get_pagenum_link($i)."' class=\"inactive\">".$i."</a>";
}
}
if ($paged < $pages && $showitems < $pages) echo "<a href=\"".get_pagenum_link($paged + 1)."\">Next ›</a>";
if ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($pages)."'>Last »</a>";
echo "</div>\n";
}
}
Function Call
<?php if (function_exists("pagination")) {
pagination($terms->max_num_pages);
} ?>
Thank you for any help that can be provided!
How can I change the output display of my pagination? I have been trying for the past few hours to format the output of my pagination links (1,2,3, etc.) to resemble the below:
I have been unable to modify the code to get it even close to this. Could someone please point me in the right direction of what I need to be doing?
Here is my code:
<?php
if ( get_query_var( 'paged' ) ) {
$paged = get_query_var('paged');
}elseif( get_query_var( 'page' ) ) {
$paged = get_query_var( 'page' );
}else{
$paged = 1;
}
$per_page = 3;
$number_of_terms = wp_count_terms( 'series' ); // This counts the total number terms in the taxonomy with a function)
$paged_offset = ($paged - 1) * $per_page;
$args = array(
'orderby' => 'ID',
'order' => 'DESC',
'hide_empty' => 0,
'number' => $per_page,
'offset' => $paged_offset
);
$terms = get_terms('series', $args);
foreach($terms as $term){ ?>
<div class="block_item article">
<div class="article_image" style="background: url('<?php the_field('series_artwork', $term); ?>'); background-size: cover; background-position: 50%;"></div>
<h4 class="section_label"><?php the_field('date', $term); ?></h4>
<div class="block_item_content">
<h3><?php echo $term->name; ?></h3>
<p><?php echo $term->description; ?></p>
<a href="<?php echo get_term_link($term->slug, 'series'); ?>" class="button_styling">
Read More
</a>
</div>
</div>
<?php }
$big = 999999999; // need an unlikely integer
echo paginate_links(
array(
'before_page_number' => '<div class="pagination"><span>Page '. $paged .' of ' . $term->max_num_pages . '</span></div>',
'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
'format' => '/page/%#%',
'current' => max( 1, get_query_var('paged') ),
'total' => ceil( $number_of_terms / $per_page ),
'prev_text' => __(''),
'next_text' => __('')
)
);
?>
If you can get it to work with my existing function (something I have been trying to do) then bonus points to you!
functions.php
// numbered pagination
function pagination($pages = '', $range = 4)
{
$showitems = ($range * 2)+1;
global $paged;
if(empty($paged)) $paged = 1;
if($pages == '')
{
global $wp_query;
$pages = $wp_query->max_num_pages;
if(!$pages)
{
$pages = 1;
}
}
if(1 != $pages)
{
echo "<div class=\"pagination\"><span>Page ".$paged." of ".$pages."</span>";
if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo "<a href='".get_pagenum_link(1)."'>« First</a>";
if($paged > 1 && $showitems < $pages) echo "<a href='".get_pagenum_link($paged - 1)."'>‹ Previous</a>";
for ($i=1; $i <= $pages; $i++)
{
if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ))
{
echo ($paged == $i)? "<span class=\"current\">".$i."</span>":"<a href='".get_pagenum_link($i)."' class=\"inactive\">".$i."</a>";
}
}
if ($paged < $pages && $showitems < $pages) echo "<a href=\"".get_pagenum_link($paged + 1)."\">Next ›</a>";
if ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($pages)."'>Last »</a>";
echo "</div>\n";
}
}
Function Call
<?php if (function_exists("pagination")) {
pagination($terms->max_num_pages);
} ?>
Thank you for any help that can be provided!
I could see that you are trying to achieve the following output:
<div class="pagination">
<span>Page {current} of {total pages}</span>
{links here}
</div>
And you attempted it like so:
'before_page_number' => '<div class="pagination"><span>Page '. // wrapped for clarity
$paged .' of ' . $term->max_num_pages . '</span></div>'
But that will actually add the markup before each and every page number in the generated links. (And the $term->max_num_pages is also a null because in that context, $term doesn't have a max_num_pages property.)
So here's how you could achieve the expected output:
$big = 999999999; // need an unlikely integer
$cur_page = max( 1, $paged );
$num_pages = ceil( $number_of_terms / $per_page );
$links = paginate_links(
array(
'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
'format' => '/page/%#%',
'current' => $cur_page,
'total' => $num_pages,
'prev_text' => __(''),
'next_text' => __('')
)
);
// If there are links to paginate, display the pagination.
if ( $links ) {
$before = '<span>Page '. $cur_page .' of ' . $num_pages . '</span>';
echo '<div class="pagination">' . $before . ' ' . $links . '</div>';
}
See the paginate_links() reference for more details on that function, such as the mid_size and end_size parameters that control the number of pages/links to be displayed.
The following will loop through a custom taxonomy and pull all the associated terms.
<?php if ( get_query_var( 'paged' ) ) {
$page = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;
}
$per_page = 9;
$totalterms = wp_count_terms( 'series' );
$totalpages = ceil( $totalterms / $per_page );
$paged_offset = ( $page > 0 ) ? $per_page * ( $page - 1 ) : 1;
$args = array(
'orderby' => 'ID',
'order' => 'DSC',
'hide_empty' => true,
'exclude' => array(),
'exclude_tree' => array(),
'include' => array(),
'number' => $per_page,
'fields' => 'all',
'slug' => '',
'parent' => '',
'hierarchical' => true,
'child_of' => 0,
'get' => '',
'name__like' => '',
'pad_counts' => false,
'offset' => $paged_offset,
'search' => '',
'cache_domain' => 'core'
);
$terms = get_terms('series', $args);
foreach($terms as $term){ ?>
<div class="block_item article">
<div class="block_item_overlay"></div>
<div class="article_image" style="background: url('<?php the_field('series_artwork', $term); ?>'); background-size: cover; background-position: 50%;"></div>
<h4 class="section_label"><?php the_field('date', $term); ?></h4>
<div class="block_item_content">
<h3><?php echo $term->name; ?></h3>
<p><?php echo $term->description; ?></p>
<a href="<?php echo get_term_link($term->slug, 'series'); ?>" class="button_styling">
Read More
</a>
</div>
</div>
<?php }
$big = 999999999; // need an unlikely integer
printf( '<div class="pagination"><span>Page '.$page.' of '.$totalpages.'</span>',
custom_page_navi( $totalpages, $page, 3, 0 )
);
echo paginate_links(
array(
'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
'format' => '/page/%#%',
'current' => max( 1, get_query_var('paged') ),
'total' => ceil( $totalterms / $per_page ),
'prev_next' => false
)
); ?>
</div>
paginate_links()? You can add the "Page {x} of {y}" via custom code, and you can usemid_sizeandend_sizeto change/adjust the number of links displayed. – Sally CJ Commented Oct 24, 2018 at 14:40paginate_links()function. I'm still learning PHP and WordPress development. How would I go about adding the "Page {x} of {y}? – Peter Commented Oct 24, 2018 at 15:18