Trong WordPress, hiện tại vẫn chưa có sẵn chức năng phân trang, điều này gây cản trở ít nhiều đến người đọc. Việc phân trang cho blog đem lại cho blog bạn sự tối ưu hóa, giúp người đọc dễ dàng tìm đến các bài viết cũ hơn, đồng thời qua nút phân trang người đọc cũng có thể biết trước hiện mình đang tìm trong chuyên mục có bao nhiêu trang, để có thể xác định xem chủ đề mà họ đang tìm kiếm trên blog bạn viết có nhiều hay không.

Để làm việc này, bạn có thể dùng plugin WP Paganavi, Tuy nhiên bạn không nên dùng quá nhiều plugin cho Blog, sẽ không tốt đẹp gì lắm đối với tốc độ tải trang của bạn, nhất là trong thời điểm “nhanh là thắng như hiện nay”.

Smart Pagination – WordPress plugin

Một vài đoạn mã dưới đây sẽ giúp bạn có một phân trang không kém cạnh plugin, đồng thời cũng thêm phần trang trí cho blog của bạn nếu biết cách tùy biến.

B1. Thêm mã vào functions.php ở thư mục theme.

 //Start of Paganavi
function wp_corenavi() {
global $wp_query, $wp_rewrite;
$pages = '';
$max = $wp_query->max_num_pages;
if (!$current = get_query_var('paged')) $current = 1;
$a['base'] = ($wp_rewrite->using_permalinks()) ? user_trailingslashit( trailingslashit( remove_query_arg( 's', get_pagenum_link( 1 ) ) ) . 'page/%#%/', 'paged' ) : @add_query_arg('paged','%#%');
if( !empty($wp_query->query_vars['s']) ) $a['add_args'] = array( 's' => get_query_var( 's' ) );
$a['total'] = $max;
$a['current'] = $current;

$total = 1; //1 - display the text "Page N of N", 0 - not display
$a['mid_size'] = 5; //how many links to show on the left and right of the current
$a['end_size'] = 1; //how many links to show in the beginning and end
$a['prev_text'] = '« Previous'; //text of the "Previous page" link
$a['next_text'] = 'Next »'; //text of the "Next page" link

if ($max > 1) echo '<div class="pagenavi">';
if ($total == 1 && $max > 1) $pages = '<span class="pages">Page ' . $current . ' of ' . $max . '</span>'."rn";
echo $pages . paginate_links($a);
if ($max > 1) echo '</div>';
}//End of Paganavi

B2. Thêm phân trang vào giao diện

Thêm dòng sau vào nơi bạn muốn hiện phân trang. Để kiểm tra xem vị trí có thể chèn, bạn xem trong giao diện có file navigation.php nào không, hoặc kiểm tra xem các tập tin có liên quan đến phân trang thì chèn vào. Thường thì nên chèn vào trong file index.php của giao diện.

<?php if (function_exists('wp_corenavi')) wp_corenavi(); ?>

B3. Làm đẹp phân trang

Đến bước này ta cần trổ tài chỉnh css một chút để làm đẹp cho phân trang của bạn. Dưới đây là đoạn css do mình soạn sẵn, bạn hãy tùy biến cho phù hợp với giao diện:

/*-- PageNavi --*/
.pagenavi{clear:both;position: relative; float: right; margin-top: 35px;}
.pagenavi span,.pagenavi a{color: #4d4d4d;padding:3px;margin-right:5px;background:transparent;border:1px solid #757575}
.pagenavi a:hover,.pagenavi .current{background:transparent;color:#4d4d4d;text-decoration:none}
.pagenavi .pages,.pagenavi .current{color: #4d4d4d;font-weight:bold}
.pagenavi .pages{border:none}

Thêm đoạn css vừa rồi vào cuối file style.css của giao diện. Nếu trong file style.css có sẵn .pagenavi thì hãy xóa dòng đó đi. Và bây giờ thì thưởng thức đi nào, blog của bạn đã có 1 phân trang khá đẹp rồi đấy!

Vietpan.Net

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s