如何在Wordpress分頁上向上一個/下一個添加類？ （paginate_links）

Question

我修改了Wordpress functions.php以顯示分頁：

<?php echo paginate_links( array(
    'prev_text'          => __('Previous Page'),
    'next_text'          => __('Next Page'),
    'type'               => 'list'
) ); ?>

輸出幾乎是完美的：

<ul class="page-numbers">
    <li>
        <span class="page-numbers current">1</span>
    </li>
    <li>
        <a class="page-numbers" href="https://domain.tld/page/2/">2</a>
    </li>
    …
    <li>
        <a class="page-numbers" href="https://domain.tld/page/10/">10</a>
    </li>
    <li>
        <a class="next page-numbers" href="https://domain.tld/page/2/">Next Page</a>
    </li>
</ul>

有沒有一種方法可以將類添加到上Prev和Next列表項li ？

    <li class="prev-list-item">
        <a class="prev page-numbers" href="http://domain.tld/page/1/">Previous Page</a>
    </li>

＆

    <li class="next-list-item">
        <a class="next page-numbers" href="http://domain.tld/page/2/">Next Page</a>
    </li>

Answer 1

除了直接輸出函數外，還可以將鏈接列表作為數組返回。 然后，您可以使用各自的功能定位下一個和上一個鏈接。

$links = paginate_links( array(
  'prev_next'          => false,
  'type'               => 'array'
) );

if ( $links ) :

    echo '<ul class="page-numbers">';

    // get_previous_posts_link will return a string or void if no link is set.
    if ( $prev_posts_link = get_previous_posts_link( __( 'Previous Page' ) ) ) :
        echo '<li class="prev-list-item">';
        echo $prev_posts_link;
        echo '</li>';
    endif;

    echo '<li>';
    echo join( '</li><li>', $links );
    echo '</li>';

    // get_next_posts_link will return a string or void if no link is set.
    if ( $next_posts_link = get_next_posts_link( __( 'Next Page' ) ) ) :
        echo '<li class="next-list-item">';
        echo $next_posts_link;
        echo '</li>';
    endif;
    echo '</ul>';
endif;

Answer 2

這是一個javascript（jQuery）解決方案。 不好，但是可以用：

 (function ( $ ) { $('ul.page-numbers li a').each(function() { var $this = $(this); if ( $this.hasClass('prev') ) $this.parent('li').addClass('prev-list-item'); if ( $this.hasClass('next') ) $this.parent('li').addClass('next-list-item'); }); }( jQuery )); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <ul class="page-numbers"> <li> <span class="page-numbers current">1</span> </li> <li> <a class="page-numbers" href="https://domain.tld/page/2/">2</a> </li> … <li> <a class="page-numbers" href="https://domain.tld/page/10/">10</a> </li> <li> <a class="next page-numbers" href="https://domain.tld/page/2/">Next Page</a> </li> </ul> 

只需將JavaScript代碼包裝在<script></script>標記中，然后將其插入到paginate_links()函數之后。