• Nov 11, 2022

Customize the WP-PageNavi HTML structure

This code will help you to customize WP-PageNavi pagination html structure.

Example -1: Using this you can wrap a and span with li

<?php
add_filter( 'wp_pagenavi', 'ap_pagination', 10, 2 );
 
// customize the PageNavi HTML before it is output
function ap_pagination($html) {
	$out = '';
	//wrap a's and span's in li's
	$out = str_replace("<a","<li><a",$html);    
	$out = str_replace("</a>","</a></li>",$out);
	$out = str_replace("<span","<li><a",$out);   
	$out = str_replace("</span>","</a></li>",$out);
	$out = str_replace("<div class='wp-pagenavi'>","",$out);
	$out = str_replace("</div>","",$out);
 
	return '<ul>'.$out.'</ul> ';
}
?>

Example 2: Add extra attribute to pagination link

add_filter('wp_pagenavi', 'ap_pagination', 10, 2);
function ap_pagination($html)
{
  $out = '';
  $out = str_replace("<a", "<a rel='canonical' ", $html);

  return  $out;
}
Share on: