WordPress 免外掛實現文章分頁導航（含樣式）

為什麼不裝外掛？

外掛越多，網站越重、越難維護。WordPress 核心已提供分頁 API，幾行程式碼即可實現完整分頁導航。

步驟 1：functions.php 加入分頁函數

<?php
// 分頁導航 免外掛
function par_pagenavi($range = 4) {
    global $paged, $wp_query;
    if (!$max_page) $max_page = $wp_query->max_num_pages;
    if ($max_page > 1) {
        if (!$paged) $paged = 1;
        // 首頁連結
        if ($paged != 1) {
            echo " 返回首頁 ";
        }
        // 上一頁
        previous_posts_link(' 上一頁 ');
        // 頁碼邏輯
        if ($max_page > $range) {
            if ($paged < $range) {
                for ($i = 1; $i <= ($range + 1); $i++) {
                    echo "$i";
                }
            } elseif ($paged >= ($max_page - ceil($range / 2))) {
                for ($i = $max_page - $range; $i <= $max_page; $i++) {
                    echo "$i";
                }
            } elseif ($paged >= $range && $paged < ($max_page - ceil($range / 2))) {
                for ($i = ($paged - ceil($range / 2)); $i <= ($paged + ceil($range / 2)); $i++) {
                    echo "$i";
                }
            }
        } else {
            for ($i = 1; $i <= $max_page; $i++) {
                echo "$i";
            }
        }
        // 下一頁
        next_posts_link(' 下一頁 ');
        // 尾頁連結
        if ($paged != $max_page) {
            echo " 最後一頁 ";
        }
    }
}
?>

步驟 2：模板檔案調用

在 index.php、archive.php、search.php（或主題對應的列表模板）中，將原本的：

<div><?php previous_posts_link() ?></div>
<div><?php next_posts_link() ?></div>

替換為：

<div class="page_navi"><?php par_pagenavi(4); ?></div>

步驟 3：style.css 加入樣式

.page_navi { width:100%; height:36px; line-height:36px; text-align:center; overflow:hidden; padding-top:1em; }
.page_navi a { padding:3px 8px; margin:2px; text-decoration:none; color:#888; border:1px solid #ccf; }
.page_navi a:hover, .page_navi a.current { border:1px solid #356aa0; color:#356aa0; font-weight:bold; }

進階：支援自訂查詢

若使用 WP_Query 自訂迴圈，需傳入 $wp_query 物件：

function par_pagenavi($range = 4, $query = null) {
    global $paged, $wp_query;
    if ($query) $wp_query = $query;
    // ... 其餘邏輯不變
}

結語

十分鐘完成免外掛分頁，輕量、可控、無相依性。若需 AJAX 無刷新分頁，可搭配 admin-ajax.php 與前端 JS 實現。