Membuat Pagination WordPress Tanpa Plugin

Pagination WordPress. Mungkin ada yang belum tahu??
Pagination WordPress berfungsi untuk memudahkan pengunjung menampilkan halaman tiap halaman di blog. Berikut ini merupakan contoh pagination standar WordPress.Pagination Standar WordPress

Lalu langsung aja cara pembuatannya, salin kode berikut kemudian di tambahkan ke file functions.php

/** Awal Fungsi Penomoran Halaman **/
function pagenavi( $p = 2 ) { // pages will be show before and after current page
 if ( is_singular() ) return; // don't show in single page
 global $wp_query, $paged;
 $max_page = $wp_query->max_num_pages;
 if ( $max_page == 1 ) return; // don't show when only one page
 if ( empty( $paged ) ) $paged = 1;
 // echo '<span class="pages">Page: ' . $paged . ' of ' . $max_page . ' </span> '; // pages
 if ( $paged > $p + 1 ) p_link( 1, 'First' );
 if ( $paged > $p + 2 ) echo '... ';
 for( $i = $paged - $p; $i <= $paged + $p; $i++ ) { // Middle pages
 if ( $i > 0 && $i <= $max_page ) $i == $paged ? print "<span class='page-numbers current'>{$i}</span> " : p_link( $i );
 }
 if ( $paged < $max_page - $p - 1 ) echo '... ';
 if ( $paged < $max_page - $p ) p_link( $max_page, 'Last' );
}
function p_link( $i, $title = '' ) {
 if ( $title == '' ) $title = "Page {$i}";
 echo "<a class='page-numbers' href='", esc_html( get_pagenum_link( $i ) ), "' title='{$title}'>{$i}</a> ";
}
/** Akhir Fungsi Penomoran Halaman **/

Kemudian tambahkan kode berikut ke dalam file css anda:

.pagination {
	background-color:#eee;
	padding:10px;
}
.pagination span {
	font-weight:bold;
}
.page-numbers {
	border:1px solid #ccc;
	border-bottom:1px solid #aaa;
	font-weight:bolder;
	padding:5px 10px;
	font-size:11px;
	text-decoration:none;
	margin:1px;
	background:-moz-linear-gradient(#fff,#f9f9f9,#e9e9e9);
	background:-webkit-linear-gradient(#fff,#f9f9f9,#e9e9e9);
	background:-o-linear-gradient(#fff,#f9f9f9,#e9e9e9);
	background:linear-gradient(#fff,#f9f9f9,#e9e9e9);
	-moz-box-shadow:inset 0 0px 2px #fff;
	border-radius:3px;
	-webkit-box-shadow:inset 0 0px 2px #fff;
	border-radius:3px;
	box-shadow:inset 0 0px 2px #fff;
	border-radius:3px
}
.page-numbers:hover {
	border:1px #999 solid;
	-webkit-box-shadow:0 1px 4px -1px #888;
	-moz-box-shadow:0 1px 4px -1px #888;
	box-shadow:0 1px 4px -1px #888;
	background:-moz-linear-gradient(#fff,#f3f3f3,#e1e1e1);
	background:-webkit-linear-gradient(#fff,#f3f3f3,#e1e1e1);
	background:-o-linear-gradient(#fff,#f3f3f3,#e1e1e1);
	background:linear-gradient(#fff,#f3f3f3,#e1e1e1)
}
.page-numbers.current {
	margin-left:1px!important;
	font-size: 11px;
	box-shadow: none;
	border: 1px solid rgba(0,0,0,.1);
	margin-left:5px!important;
	border:#c6c6c6 1px solid;
	background:#005da4;
	color:#fff;
	font-weight:bold;
	-moz-box-shadow:inset 0 0px 5px 0px #c6c6c6;
	-webkit-box-shadow:inset 0 0px 5px 0px #c6c6c6;
	box-shadow:inset 0 0px 5px 0px #c6c6c6
}

Sisipkan kode berikut di salah satu file themes WordPress anda, misalkan single.php atau index.php:

<div class="pagination"><span>Halaman</span><?php pagenavi(); ?></div>

Hasilnya:Hasill Pagination

Selamat Mencoba 😀


35 Comments

Kebijakan Komentar (Mulai 16 Oktober 2015)

**Komentar akan ditampilkan setelah disetujui oleh admin.

**DILARANG MENGGUNAKAN FITUR KOMENTAR UNTUK PROMOSI. SEKALI PROMOSI AKAN LANGSUNG DIHAPUS.

**Mohon berkomentar yang bermutu sesuai dengan isi tulisan.

Leave a Reply