MW-Pagenavの出力タグを変更する

MW-Pagenavの出力タグを変更する

MW-Pagenavで書き出されるソースの変更。
スタイルに当て込む場合などソース側を書き換える。

◯デフォルト出力

<div class='wp-pagenavi'>
  <a class="previouspostslink" rel="prev" href="http://hogehoge.com/news/?archive=2018"></a>
  <a class="page smaller" href="http://hogehoge.com/news/?archive=2018">1</a><span class='current'>2</span>
  <a class="page larger" href="http://hogehoge.com/news/page/3/?archive=2018">3</a>
  <a class="nextpostslink" rel="next" href="http://hogehoge.com/news/page/3/?archive=2018"> </a>
</div>

◆function

//customize the PageNavi HTML before it is output
function my_custom_pagination($html) {
    $out = '';

    //wrap a's and span's in li's
    $out = str_replace("<div","",$html);
    $out = str_replace("class='wp-pagenavi'>","",$out);
    $out = str_replace("<a","<li class=\"l-page__pager--item\"><a",$out);
    $out = str_replace("</a>","</a></li>",$out);
    $out = str_replace("<span","<li class=\"l-page__pager--item\"><span",$out);
    $out = str_replace("</span>","</span></li>",$out);
    $out = str_replace("</div>","",$out);

    return '<div class="l-page__pager">
            <ul class="l-page__pager--list">'.$out.'</ul>
        </div>';
}
add_filter( 'wp_pagenavi', 'my_custom_pagination', 10, 2 );

◆出力

<div class="l-page__pager">
  <ul class="l-page__pager--list">
    <li class="l-page__pager--item"><a class="previouspostslink" rel="prev" href="http://hogehoge.com/news/?archive=2018"> </a></li>
    <li class="l-page__pager--item"><a class="page smaller" href="http://hogehoge.com/news/?archive=2018">1</a></li>
    <li class="l-page__pager--item"><span class='current'>2</span></li>
    <li class="l-page__pager--item"><a class="page larger" href="http://hogehoge.com/news/page/3/?archive=2018">3</a></li>
    <li class="l-page__pager--item"><a class="nextpostslink" rel="next" href="http://hogehoge.com/news/page/3/?archive=2018"> </a></li>
  </ul>
</div>

参考サイト

Caleb Serna
Bootstrap WordPress Pagination Using WP-Pagenavi
http://calebserna.com/bootstrap-wordpress-pagination-wp-pagenavi/