Bình thường để phân trang các bài viết trong WordPress ta thường dùng hai hàm previous_posts_link và next_posts_link hoặc có thể dùng plugin WP-PageNavi để phân trang theo dạng đánh số. Ngoài ra thay vì sử dụng plugin bạn có thể dùng hàm paginate_links để phân trang theo dạng đánh số thay vì cài thêm plugin cho WordPress.
Thêm đoạn code sau vào file
functions.phpcủa theme bạn đang dùng:
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| if ( ! function_exists( 'wplift_pagination' ) ) { | |
| function wplift_pagination() { | |
| global $wp_query; | |
| $big = 999999999; | |
| echo '<div class="page_nav">'; | |
| echo paginate_links( array( | |
| 'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ), | |
| 'format' => '?paged=%#%', | |
| 'current' => max( 1, get_query_var('paged') ), | |
| 'total' => $wp_query->max_num_pages ) ); | |
| echo '</div>'; | |
| } | |
| } |
Sau đó thêm đoạn code này vào nơi mà bạn muốn thêm phân trang
<?php wplift_pagination(); ?>
Cuối cùng dùng CSS để style cho phần phân trang. Thêm đoạn CSS này vào file
style.css`của theme bạn sử dụng.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .page_nav .page-numbers{ | |
| background:#BCBCBC; | |
| color:#fff; | |
| display:block; | |
| width:auto; | |
| float:left; | |
| margin: 4px 4px 4px 0; | |
| padding:15px 18px 14px 18px; | |
| text-decoration:none; | |
| } | |
| .page_nav .page-numbers:hover{ | |
| background: #24221D; | |
| color:#fff; | |
| text-decoration: none; | |
| } | |
| .page_nav .current{ | |
| background: #24221D; | |
| color:#fff; | |
| padding:15px 18px 14px 18px; | |
| } |
Và đây là kết quả ta có cuối cùng
Nguồn: WPLift