內容簡介
Responsive Pagination 外掛可讓您配置頁面分頁，以適應不同的螢幕尺寸。基於響應式網頁設計概念，您的分頁可因瀏覽器寬度不同而顯示不同。
例如，當您的網站訪客使用桌面電腦和大型螢幕時，您可能希望有較長的分頁，包含許多頁數，但當他們使用手機時，只需要簡要的 Prev 和 Next 鏈接。
當您發現您的佈景主題在分頁的響應式設計上做得不好時，您可以嘗試使用此外掛。這個外掛可讓您手動配置到所需的斷點。
兩種應用 Responsive Pagination 的不同方法
您可以選擇要應用 Responsive Pagination 的方式。
方法 A：轉換現有的分頁（無需編寫程式碼）
此方法將把佈景主題中現有的分頁轉換為響應式分頁，無需添加任何 WordPress 縮略碼或 PHP 程式碼。您只需要填寫現有分頁元素的選擇器（CSS 或 jQuery 類型選擇器）。您可以在管理設置頁面（設置 > Responsive Pagination）中輸入選擇器。
方法 B：由頭開始編程創建新分頁
此方法需要您直接在模板文件中插入 PHP 程式碼，使用 Responsive Pagination API。此方法支援使用 WP_Query 进行查询，甚至可以使用不使用 WP_Query 的更通用的内容。
Responsive Pagination API（用於編程使用）
注：此 API 部分是一個編寫響應式分頁的簡短指南。然而，有一個更容易的解決方案可以在不接觸任何程式代碼的情況下使用此外掛，這是通過在管理設置頁面中轉換您的佈景主題現有的分頁，並只提供其 CSS/jQuery 選擇器。
如果您想編寫響應式分頁，此外掛會為您新增一個可使用的新功能，可在您放置功能時呈現新分頁。
<?php create_responsive_pagination( $id, $args ) ?>
參數：
$id：（字符串）（必需）您想要創建的新分頁的 ID，格式為 kebab-case。
$args ：（WP_Query | array）（必需）WP_Query 實例或包含：
$current:（整型） 當前頁面
$total：（整型） 總頁數
$urlFirstPage：（字符串）首頁 URL
$urlPattern:（字符串）使用 {pagenum} 標籤的這個分頁的 URL 模式。
備註：分頁設置和斷點配置仍從管理設置頁面配置。
範例（用於編程使用）
使用 WP_Query 在主循環中為帖子創建分頁的範例。只要在循環中使用 WP_Query，那么就可以使用此片段，甚至在自定義文章類型上也能使用。
<?php
global $wp_query; // 或者一些自定義 WP_Query 實例
if( function_exists( 'create_responsive_pagination' ) ) {
create_responsive_pagination( 'my-pagination-id', $wp_query );
}
?>
在不使用 WP_Query 的情況下，提供自己的當前頁面，總頁數，首頁 URL 和 URL 模式來創建更通用的分頁。
<?php
if( function_exists( 'create_responsive_pagination' ) ) {
create_responsive_pagination( 'my-pagination-id', array(
'current' => $my_current_page, // 在這裡輸入當前頁面
'total' => $my_total_pages, // 在這裡輸入總頁數
'urlFirstPage' => $my_url_first_page, // 在這裡輸入首頁 URL
'urlPattern' => $my_url_pattern, // 在這裡輸入使用 {pagenum} 標籤的 URL 模式。
) );
}
?>
外掛標籤
開發者團隊
原文外掛簡介
Responsive Pagination plugin lets you configure your paginations to adapt to different screen size. Your paginations can be shown differently based on browser width as in responsive web design concept.
For instance, you might want to have a longer pagination with many page numbers when your site visitors are using desktops and large screens, but need shorter pagination with only Prev and Next link when they’re using phones.
You may try using this plugin when you found your theme is not doing well with the responsive design on its pagination. This plugin lets you configure manually to the desired breakpoints.
Two Different Methods to Apply Responsive Pagination
You can choose the way you want to apply responsive pagination.
Method A : Convert Existing Paginations (No Coding Required)
This method will convert the existing paginations from your theme into responsive paginations without needs to add any WordPress shortcode or PHP code. You only need to fill the selectors (CSS or jQuery-like selector) of the existing pagination elements. You’ll input the selectors in Admin Settings Page (Settings > Responsive Pagination)
Method B : Create new Pagination Programmatically from Scratch
This method will need you to insert PHP code into template files directly using Responsive Pagination API. This method supports queries using WP_Query, or even something more generic without WP_Query.
Responsive Pagination API (For Programmatic Usage)
Note : This API section is a short guide for creating responsive pagination programmatically. However, there is easier solution using this plugin without touching any code – that is by converting your theme’s existing pagination from within Admin Settings Page with just providing its CSS/jQuery selector.
If you want to create responsive pagination programmatically, this plugin adds new function for you to use, which will render a new pagination where you put the function.
Parameters :
$id: (string) (required) ID for the new pagination you want to create in kebab-case format.
$args : (WP_Query | array) (required) WP_Query instance, or an associative array contains :
$current : (int) Current page
$total: (int) Total pages
$urlFirstPage : (string) URL for first page
$urlPattern: (string) URL pattern for this pagination by using {pagenum} tag.
Note : Pagination settings and Breakpoint Configurations are still configured from within Admin Settings Page.
Example (For Programmatic Usage)
Example for creating pagination for posts within main loop using WP_Query. This also works with custom post type as long as you have WP_Query within loop.
Example for creating a more generic pagination by providing your own data for current page, total pages, URL first page, and URL pattern without WP_Query.
$my_current_page, // your current page here
'total' => $my_total_pages, // your total page here
'url_first_page' => 'https://www.example.com/archives/', // URL when current page = 1
'url_pattern' => 'https://www.example.com/archives/page/{pagenum}' // the pattern using {pagenum} tag
) );
}
?>
